Registry Index

Search the catalog

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

ComponentReactregistry:ui3 dependencies

Mode Toggler

mode-toggler

A minimal Sun / Moon theme toggle button built on next-themes. Supports an optional click sound, composable className, and dynamic aria-label.

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

## Installation ```bash npx shadcn@latest add @akoder/mode-toggler ``` ## Usage ```tsx import { ModeToggler } from "@/components/ui/mode-toggler"; export function Header() { return ( <header className="flex items-center justify-between px-4 h-12"> <span>my app</span> <ModeToggler /> </header> ); } ```
@akoder

More from @akoder