Registry Index

Search the catalog

Type to search items across every indexed registry, or pick a page.

ComponentReactregistry:ui2 dependencies

Theme Toggle

theme-toggle

Class-strategy dark mode toggle with localStorage persistence and no-flash pre-paint script helper.

@washiveilRegistry JSON
Live, loading

Starting the live preview…

Runs in a sandboxed frame on a separate origin, in its registry's own theme. Mounted with no props — an item that paints an empty box is given its name as text, and some items need input to show anything.

Notes from the author

Place <ThemeScript /> inside <head> in your root layout to avoid a dark-mode flash; put <ThemeToggle /> wherever the switch lives.
6 other registries

Similar components

Other registries' take on theme-toggle.

Theme toggle
0@000h-cojeev
Component
Theme Toggle
a@atroui
Component
Theme Toggle
b@beui
Component
Theme Toggle
e@easeui
Component
Theme Toggle
i@iconiq
Component
Theme Toggle
m@mischief
Component
@washiveil

More from @washiveil

All 28 items
Glass Switch
glass-switch
Component
Glass Toggle
glass-toggle
Component
Status Badge
status-badge
Component
Chip
chip
Component
Glass Alert
glass-alert
Component
Glass Avatar
glass-avatar
Component
Glass Calendar
glass-calendar
Component
Glass Checkbox
glass-checkbox
Component