Skip to main content
Generated
Mar 3, 2026
by
|
Auto-generate your docs now
Claim this site
shadcn-svelte home page
shadcn-svelte
Documentation
Ask AI
Search...
shadcn-svelte home page
shadcn-svelte
Search...
Navigation
Customization
Dark Mode
Get Started
Introduction
Installation
SvelteKit
Vite
Astro
Manual Installation
Components
Accordion
Alert
Alert Dialog
Aspect Ratio
Avatar
Badge
Breadcrumb
Button
Button Group
Calendar
Card
Carousel
Chart
Checkbox
Collapsible
Combobox
Command
Context Menu
Data Table
Date Picker
Dialog
Drawer
Dropdown Menu
Empty
Field
Formsnap
Hover Card
Input
Input Group
Input OTP
Item
Kbd
Label
Menubar
Native Select
Navigation Menu
Pagination
Popover
Progress
Radio Group
Range Calendar
Resizable
Scroll Area
Select
Separator
Sheet
Sidebar
Skeleton
Slider
Sonner
Spinner
Switch
Table
Tabs
Textarea
Toggle
Toggle Group
Tooltip
Typography
Customization
Theming
Dark Mode
Svelte
Astro
components.json
CLI
CLI
Advanced
JavaScript
Migration Guide
Registry
Getting Started
registry.json
registry-item.json
Examples
FAQ
Legacy Docs
Resources
About
Changelog
Figma
huntabyte/shadcn-svelte
Customization
Dark Mode
Adding dark mode to your site.
Choose the framework for your project to learn how to add dark mode support:
Svelte
Add dark mode to your Svelte application
Astro
Add dark mode to your Astro site
Theming
Svelte
⌘I
Build docs developers (and LLMs) love
Get started for free
Talk to us
Assistant
Responses are generated using AI and may contain mistakes.