ON/OFF-Schalter mit Text
Ein Schalter, der seinen Zustand ausschreibt: ON und OFF gleiten neben dem Knopf herein und hinaus.
Einstellungen
Code
<label class="uv-tt"><input type="checkbox" checked><span><em>ON</em><em>OFF</em></span></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 Schalter
Wofür du ihn nutzen kannst
Manche Schalter müssen sagen, was sie tun, statt nur eine Farbe zu zeigen. Dieser ON/OFF-Toggle passt zu Admin-Panels und Abrechnungsseiten: „Wartungsmodus“ in einem CMS, „Automatische Verlängerung“ bei einem Abo oder „Zwei-Faktor-Login“ in den Sicherheitseinstellungen. Die Wörter gleiten mit dem Knopf, niemand muss raten, ob Blau nun an bedeutet.
Das hilft auch Menschen, die Farben schlecht unterscheiden. Halte die Beschriftung bei zwei oder drei Buchstaben, etwa ON und OFF. JA und NEIN wird schon knapp, längere Wörter passen nicht in die Schiene. Ändern kannst du sie direkt im HTML.