Vizel API / core/src / getVizelThemeInitScript

Function: getVizelThemeInitScript()

function getVizelThemeInitScript(storageKey?): string;

Defined in: packages/core/src/theme.ts:175

Initialize theme on page load (for SSR/hydration)

Call this in a script tag in the head to prevent flash of incorrect theme.

Parameters

Parameter	Type	Default value
storageKey	string	VIZEL_DEFAULT_THEME_STORAGE_KEY

Returns

string

Example

<script>
  (function() {
    const storageKey = 'vizel-theme';
    const stored = localStorage.getItem(storageKey);
    const systemDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
    const theme = stored === 'dark' ? 'dark' :
                  stored === 'light' ? 'light' :
                  systemDark ? 'dark' : 'light';
    document.documentElement.setAttribute('data-vizel-theme', theme);
  })();
</script>