Dowe

MULTI THEME

ToggleTheme

ToggleTheme is an icon-only control for switching directly between the light and dark themes.

PLAYGROUND

Switch the current appearance

The sun and moon icon describe the next action. Every ToggleTheme control reflects the same persisted preference.

Light and dark, in one action

Use ToggleTheme when the interface only needs the two canonical appearance modes.

ToggleTheme variant:"soft" scheme:"secondary" size:"lg"
  lightLabel:"Switch to light mode"
  darkLabel:"Switch to dark mode"

APPEARANCE

The same button language

variant, scheme, and size follow the portable Button visual contract while keeping the control icon-only.

Solid

Soft

Outlined

Ghost

BEHAVIOR

A focused two-theme choice

ToggleTheme is deliberately limited to light and dark. Use SelectTheme when your theme catalog has additional named palettes.

PERSISTENCE

One shared preference

The selected theme is stored as theme-preference and restored before the next view mounts.

ACCESSIBILITY

Next-action labels

The accessible label names the next mode, rather than repeating the active one.

TARGETS

Immediate tokens

Web, Android, and iOS apply the new design tokens immediately from the same source model.

API

ToggleTheme props

ToggleTheme also accepts applicable common identity, spacing, sizing, visibility, radius, border, and shadow props. It does not accept children.

Prop	Type	Default
No data There are no records to display