HTML + CSSToggles

Retro lever switch

A metal lever that swings across its base from OFF to ON and lights an indicator lamp.

Settings

16px
1x

Code

<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>Main engine</label>

Prompt for AI

Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.

More in Toggles

See all Toggles

Where to use it

Inspired by old control panels and lab equipment, this switch swings a chrome lever with a colored ball across a dark base, with an engraved OFF and ON on each side. When it reaches ON, a small lamp in the corner lights up with a glow. It suits game interfaces, maker tools, audio plugins and sci-fi dashboards.

The lever uses a spring curve so it overshoots slightly and settles, like a real mechanism. The main color sets the ball, the second the lamp, which lets you build a whole row of different system switches.