Retro-Hebelschalter

Ein Metallhebel, der auf seinem Sockel von OFF nach ON schwenkt und eine Kontrolllampe einschaltet.

Einstellungen

Hauptfarbe#ff5b2e

Zweitfarbe#ffd36b

Größe16px

Tempo1x

Text

Code

index.html

<label class="uv-tlv"><input type="checkbox" role="switch"><span class="bs"><span class="lp"></span><span class="ax"><span class="ar"><b></b></span></span><span class="t0">OFF</span><span class="t1">ON</span></span>Hauptmotor</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

Wandlichtschalter

SchalterHTML + CSS

Flüssiger Toggle

SchalterHTML + CSS

Wofür du ihn nutzen kannst

Inspiriert von alten Schaltpulten und Laborgeräten schwenkt dieser Schalter einen verchromten Hebel mit farbiger Kugel über einen dunklen Sockel, mit eingraviertem OFF und ON an den Seiten. Bei ON leuchtet eine kleine Lampe in der Ecke auf. Passt zu Spiele-Interfaces, Maker-Tools, Audio-Plugins und Science-Fiction-Dashboards.

Der Hebel nutzt eine Federkurve, schwingt also leicht über und kommt dann zur Ruhe wie eine echte Mechanik. Die Hauptfarbe färbt die Kugel, die zweite die Lampe, so entsteht eine ganze Reihe verschiedener Schalter.