vue-multiple-themesReal Multi-Theme System for Vue

Vue 2 & 3 · TypeScript · CSS Variables · TailwindCSS · Lucide Icons

🎨

Real Multiple Themes

Not just dark/light – define unlimited custom themes (Ocean, Forest, Sunset, Winter…) with a full semantic colour token system.

✨

Use CSS custom properties (`data-theme` attribute) or Tailwind CSS classes (`theme-`) – or both simultaneously for maximum flexibility.

🔩

`useTheme()` gives you reactive access to the current theme, typed colour tokens, and navigation helpers (next, prev, toggle).

🦄

📦

Import only what you need. ESM-first, fully typed, SSR-safe.

🖼️

Built-in Lucide SVG icons (sun, moon, coffee, leaf…) with `currentColor` rendering – icon colours follow your theme automatically.

primary#3b82f6

secondary#8b5cf6

accent#f59e0b

success#10b981

warning#f59e0b

error#ef4444

Light

data-theme="light"

Dark

data-theme="dark"

Sepia

data-theme="sepia"

Ocean

data-theme="ocean"

Forest

data-theme="forest"

Sunset

data-theme="sunset"

Winter

data-theme="winter"