Wandlichtschalter

Eine Wippe auf ihrer Abdeckplatte, die beim Drücken umkippt und eine kleine Kontrollleuchte einschaltet.

Einstellungen

Hauptfarbe#ffad1f

Zweitfarbe#fff2c2

Größe16px

Tempo1x

Text

Code

index.html

<label class="uv-twl"><input type="checkbox" role="switch"><span class="pl"><i class="led"></i><span class="rk"></span></span>Küchenlicht</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

Alle ansehen: Schalter

Elastischer iOS-Toggle

SchalterHTML + CSS

Schalter für Tag und Nacht

SchalterHTML + CSS

ON/OFF-Schalter mit Text

SchalterHTML + CSS

Neon-Schalter mit Leuchten

SchalterHTML + CSS

Toggle mit Kreuz und Haken

SchalterHTML + CSS

Toggle im Soft-UI-Stil

SchalterHTML + CSS

Flüssiger Toggle

SchalterHTML + CSS

Retro-Hebelschalter

SchalterHTML + CSS

Wofür du ihn nutzen kannst

Smart-Home-Apps zeigen oft für jedes Gerät dieselbe Pille. Dieser Toggle nutzt ein Objekt, das jeder kennt: eine weiße Abdeckplatte mit einer Wippe, die beim Drücken kippt, eine winzige Kontrollleuchte und ein warmes Leuchten hinter der Platte. Passt zu Lichtsteuerungen, Raumszenen und Dashboards für Hausautomation.

Darunter steckt eine Checkbox mit der Rolle switch, Hilfstechnologien sagen also an und aus an. Die Hauptfarbe bestimmt Kontrollleuchte und Schein, ein kühles Weiß kann so auch für Ventilator oder Heizung stehen.