Runde Checkbox
Eine runde Checkbox, die sich von der Mitte aus füllt und dann einen weißen Haken aufspringen lässt.
Einstellungen
Code
<label class="uv-cc"><input type="checkbox" checked><span><svg viewBox="0 0 24 24"><path d="M5 12.5l4.5 4.5L19 7.5" pathLength="1"/></svg></span>Angemeldet bleiben</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
Runde Checkboxen wirken weicher und mobiler als eckige. Diese hier eignet sich für „Angemeldet bleiben“ unter einem Login, für die Belag-Auswahl in einer Pizza-Bestell-App oder um Lektionen in einem Kurs als erledigt zu markieren. Die Farbe breitet sich von der Mitte aus wie ein Tintentropfen, der Haken folgt mit einem kleinen Federn.
Kreise werden oft als Radiobuttons gelesen, bei denen nur eine Option geht. Nutze diesen Stil für eine einzelne Auswahl wie „Angemeldet bleiben“ oder in Listen, in denen die Beschriftung klar macht, dass mehrere Häkchen erlaubt sind.