HTML + CSSToggles

CRT television toggle

A seventies TV turns on like a cathode ray tube: a bright line, a flash and colour bars with scanlines.

Settings

16px
1x

Code

<label class="uvq03-crt"><input type="checkbox" role="switch"><span class="tv"><i class="an"></i><span class="bz"><span class="sc"><span class="im"></span></span><span class="kb"><i></i><i></i></span></span></span>Television</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.

Markdown version with all the code, for AI assistants

More in Toggles

See all Toggles

Where to use it

This switch is a small orange television from the seventies with a curved screen, side knobs, a speaker grille and a rabbit ear antenna. Turning it on plays the classic tube start: a thin bright line opens into the full picture, the flash fades and colour bars appear with scanlines, a slow rolling band and a slight flicker. Turning it off collapses the image back into a line.

The main color is the cabinet and the second one replaces one of the colour bars. A cream or wood cabinet gives another decade, and the effect works for media settings, screen modes or retro landing pages.