Custom Cursor

Eine Form oder ein Label folgt dem Zeiger mit federnder oder weich gebremster Verzögerung.

Füge bei [wo] einen „Cursor Follower“ hinzu (auch following pointer oder smooth cursor genannt).
Ein kleiner runder Marker soll dem Zeiger mit weicher, sanft gebremster Verzögerung folgen und genau dort ausgleiten, wo der Zeiger stehen bleibt, ohne nachzufedern.
Lass den echten Zeiger sichtbar, sorg dafür, dass der Marker nie Klicks blockiert, und lass ihn auf Touch-Geräten weg.

Ein kreisförmiger Cursor invertiert die Farben darunter mit mix-blend-mode difference.

Füge bei [wo] einen „Blend-Mode Cursor“ hinzu (auch difference cursor oder inverting cursor genannt).
Ersetze den Zeiger durch einen gefüllten Kreis, der ohne Verzögerung direkt darunter sitzt und die Farben von Text und Formen invertiert, über die er fährt.
Begrenze das Blending auf diesen Bereich, damit es sich nicht mit dem Rest der Seite mischt, sorg dafür, dass es auch im Dark Mode klar invertiert, und behalte auf Touch-Geräten den normalen Cursor.

Hinter dem Mauszeiger bleibt beim Bewegen eine verblassende Spur aus Formen zurück.

Füge bei [wo] eine Mausspur (Cursor Trail) hinzu, auch mouse trail genannt.
Wenn sich der Zeiger bewegt, soll er eine kurze Kette kleiner Punkte hinterlassen, die jeweils schnell schrumpfen und verblassen, sodass die Spur kurz bleibt und den Weg weich nachzeichnet.
Zeichne die Spur nur, solange sich der Zeiger bewegt, lass sie nie Klicks blockieren und lass sie auf Touch-Geräten und bei reduzierter Bewegung (prefers-reduced-motion) weg.

Die Textmarke wächst oder schrumpft passend zur Größe des Zeichens, neben dem sie steht.

Füge bei [wo] einen „Adaptive Caret“-Effekt hinzu (auch adaptive caret size genannt).
Die Textmarke soll vor das Zeichen springen, das dem Zeiger am nächsten ist, und sich schnell auf dessen Höhe strecken oder stauchen, mit einer weichen, zackigen Größenänderung ohne Nachfedern.
Verhindere, dass sich der Text selbst verschiebt, und lass die Marke Tastaturbewegungen genauso folgen wie dem Zeiger.

Das Element wird zum Zeiger hingezogen, wenn er sich nähert, und schnellt zurück, sobald er sich entfernt.

Füge bei [wo] einen „Magnetic Button“-Effekt hinzu (auch magnetic target oder magnetic hover genannt).
Wenn sich der Zeiger nähert, soll der Button ein Stück zu ihm hingezogen werden, seine Beschriftung noch etwas weiter, und wenn der Zeiger weggeht, soll er mit einem kleinen federnden Nachschwingen an seinen Platz zurückkehren.
Das umgebende Layout darf sich nicht verschieben; schalte die Anziehung auf Touch-Geräten und bei reduzierter Bewegung (prefers-reduced-motion) ab.

Ein Feld kleiner Striche dreht sich zum Zeiger hin, wie Eisenspäne um einen Magneten.

Füge bei [wo] einen „Magnetic Filings“-Effekt hinzu.
Ein Raster kurzer Striche soll sich sofort so drehen, dass jeder direkt auf den Zeiger zeigt, wie Eisenspäne um einen Magneten, und ohne Zeiger sollen alle zur Mitte zeigen.
Halte es als dekorativen Hintergrund, der nie Klicks blockiert, und lass die Striche bei reduzierter Bewegung (prefers-reduced-motion) stillstehen.