Docscn

Theme switch

Switch between light, dark and system themes.

Installation

npx shadcn@latest add @docscn/theme-switch

Usage

The docs and home layouts show a theme switch. Configure it with the layout's themeSwitch option, or use it on its own inside RootProvider:

import { ThemeSwitch } from "@/components/docs/layouts/shared/slots/theme-switch";

<ThemeSwitch />
<ThemeSwitch mode="light-dark-system" />

mode="light-dark" (the default) is a button that toggles between light and dark. mode="light-dark-system" is a shadcn/ui toggle-group with a system option.

Search trigger

Buttons that open the search dialog.

MDX components

The components for Fumadocs MDX content.

On this page

InstallationUsage