DUSwitch

Forms

Toggle switch for boolean settings.

import { DUSwitch } from 'deri-ui';
Live preview
typescript
<DUSwitch label="Dark mode" defaultChecked />

Props

PropTypeDefaultDescription
labelReactNodeLabel
checkedbooleanControlled state

Usage

import { DUSwitch } from 'deri-ui';

<DUSwitch label="Dark mode" defaultChecked />

Customize with className, radius, and Tailwind utilities. Theme tokens come from deri-ui/tailwind.preset.

Related

© 2026 Deri Ui. Developed by Deribew Shimelis. Copy and use the code freely in your projects.