6XC

CSS-Cursor-Auswahl

Fahren Sie über jeden CSS-Cursor-Wert, um ihn live zu testen, und klicken Sie, um die cursor-Deklaration zu kopieren.

986 Aufrufe

Zum Testen bewegen · Klicken zum Kopieren

Die Eigenschaft cursor

Der Cursor zeigt Nutzern, was ein Element tut, bevor sie klicken: pointer für Klickbares, grab für Ziehbares, not-allowed für deaktivierte Bereiche, col-resize/row-resize für teilbare Leisten. Fahren Sie über jede Kachel unten, um den Cursor auf Ihrem eigenen Bildschirm zu spüren; ein Klick kopiert die fertige Deklaration. Eigene Bilder sind ebenfalls möglich mit cursor: url(...), fallback.

Häufig gestellte Fragen

Warum wird mein eigener Cursor nicht angezeigt?

Eigene Cursor-Bilder müssen klein sein (auf den meisten Plattformen 32×32 oder weniger), und die Deklaration benötigt ein Fallback-Schlüsselwort: cursor: url("c.png"), auto;.

Sollten Buttons cursor: pointer verwenden?

Browser wenden es standardmäßig nicht auf <button> an, aber Nutzer erwarten es — die meisten Designsysteme fügen allen interaktiven Steuerelementen cursor: pointer hinzu.

Ähnliche Tools

CSS-Farbverlauf-Generator Gestalten Sie lineare, radiale und konische CSS-Farbverläufe mit Live-Vorschau und kopieren Sie den Code. Erstellen CSS-Box-Shadow-Generator Gestalten Sie einen box-shadow visuell — Versatz, Unschärfe, Ausdehnung, Farbe, Deckkraft und Inset — mit Live-Vorschau. Erstellen CSS Border-Radius-Generator Runden Sie jede Ecke einzeln oder alle zusammen, in px oder %, mit Live-Vorschau und kopierbarem CSS. Erstellen CSS Text-Schatten-Generator Gestalten Sie einen text-shadow mit Versatz, Unschärfe, Farbe und Deckkraft — Live-Vorschau an Beispieltext. Erstellen