natnu Switch
The light/dark switch from natnu.design, measured to the pixel: 48 × 32 track, 24 px knob, 0.3 s ease. Same as the one top right.
Switches, checkboxes and segmented controls – each one tells assistive technology whether it is on, off or which option is chosen.
The light/dark switch from natnu.design, measured to the pixel: 48 × 32 track, 24 px knob, 0.3 s ease. Same as the one top right.
Rests at −6°, turns to +12° and softens to 70 % on hover, springs in on press. The next icon spins in after each switch.
An illustrated switch: the sun sets into a cratered moon, the clouds sink, the stars come out one after another.
Native checkboxes underneath: the box fills with a little bounce, the tick draws itself, the label gets struck through.
One indicator slides between the options – the Emerald / Sapphire switch from the liquid pill demo, as a real radio group.
The heart pops with an overshoot and a ring of particles bursts out. aria-pressed tells screen readers whether you like it.