Skip to main content

setTheme

Sets the current custom theme

setTheme is a function that updates the active custom theme.

Unlike setMode, which toggles light/dark/system modes, setTheme accepts any string (e.g. "dracula", "retro", "corporate"), persists it to localStorage, and applies it to the <html> element via the data-theme attribute.

This enables support for more granular visual themes, similar to DaisyUI.

Usage

		<script lang="ts">
	import { setTheme } from "mode-watcher";
</script>
 
<button onclick={() => setTheme("dracula")}>Dracula Theme</button>
<button onclick={() => setTheme("retro")}>Retro Theme</button>