Eine animierte Checkbox mit gezeichnetem Haken und Gradient-Füllung samt sanftem Pop.
1<label class="draw-check">2 <input type="checkbox" checked />3 <span class="box">4 <svg viewBox="0 0 24 24" aria-hidden="true">5 <path class="tick" d="M5 12.5 L10 17.5 L19 6.5" />6 </svg>7 </span>8 <span class="text">Bedingungen akzeptieren</span>9</label>Keine Installation, kein Build-Step — reine Standards, sofort einsatzbereit.
Klicke oben auf „Code kopieren“ — HTML und CSS landen in deiner Zwischenablage.
Füge das Markup an der gewünschten Stelle deiner Seite oder Komponente ein.
Übernimm den <style>-Block bzw. die Klassen in deine Stylesheet-Datei.
Aus derselben Kategorie oder mit passenden Tags.
Melde dich an, um zu kommentieren.
Ein flüssiger, barrierefreier Toggle-Switch basierend auf einer versteckten nativen Checkbox. Bietet Tastatur-Unterstützung (Fokus-Status), einen "Squish"-Effekt beim aktiven Klicken und geschmeidige cubic-bezier Animationen. Völlig freistehend ohne umgebenden Hintergrund.