Herz als Like-Button
Ein Herz mit Kontur, das sich beim Antippen rot füllt und kurz hüpft, die klassische Like-Geste.
Einstellungen
Code
<label class="uv-ch"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M12 21s-7.5-4.6-9.6-9.2C.9 8.4 3 4.5 6.8 4.5c2.1 0 3.6 1.2 5.2 3 1.6-1.8 3.1-3 5.2-3 3.8 0 5.9 3.9 4.4 7.3C19.5 16.4 12 21 12 21z"/></svg>Gefällt mir</label>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Checkboxen
Wofür du ihn nutzen kannst
Dieses Herz ist das universelle „Gefällt mir“ oder „Für später merken“. Setz es auf die Produktkarten eines Onlineshops als Wunschlisten-Button, neben Rezepte in einem Foodblog oder auf die Fotos einer Reisegalerie. Die Kontur füllt sich mit einem kurzen Hüpfer rot, genau wie man es aus jeder Social-App kennt.
Den Zustand merkt es sich nur auf der Seite selbst. Sollen Favoriten den nächsten Besuch überstehen, musst du sie selbst speichern. Die Beschriftung ist optional, das Herz funktioniert auch allein in der Ecke einer Karte.