Switch

32×18 pill; on is ink, off is hairline. State moves, layout doesn't.

Night

Paper / black

The grid stays. Only the ink inverts.

Install

npx @noordvc/raster-cli add switch

Markup

<span class="rs-switch rs-switch-on"><i></i></span>

React

import { Switch } from "@/components/raster/switch";

<Switch checked={enabled} onCheckedChange={setEnabled} aria-label="Notifications" />

Classes

.rs-switch.rs-switch-on