theme-switcher-ts

Thirty switches, one engine.

This page uses the library for its own dark mode — the toggle on the right (the "Classic Sky" design) controls the theme of the whole page, exactly the way it would in your app. Every switch below runs the actual published package, sharing one ThemeController.

npm install theme-switcher-ts

Click to toggle

The 30 built-in designs

All share one engine — click any of them

Using it in your framework

Same variant id (classic-sky) in every example

With or without Tailwind

ThemeController toggles a dark class on <html> by default — exactly what Tailwind's darkMode: 'class' strategy expects, so dark: variants work anywhere in your app with zero extra setup. Every stylesheet on this page is plain, hand-written CSS with no utility-class dependency, so it works identically in a project with no CSS framework at all.