guideui-themes
v0.1.1
Published
GuideUI themes — light, dark, auto, and high-contrast via CSS variables.
Readme
guideui-themes
CSS-variable themes for GuideUI — light, dark, auto, and high-contrast. No CSS conflicts: every rule is scoped to .gui-* classes and --gui-* variables.
Install
npm install guideui-themesUsage
// Everything (recommended)
import 'guideui-themes/all.css';
// Or pick individual pieces
import 'guideui-themes/base.css';
import 'guideui-themes/light.css';
import 'guideui-themes/dark.css';
import 'guideui-themes/high-contrast.css';Switch themes by setting data-guideui-theme on <html> (or use useTheme() from guideui-react / guideui-vue):
document.documentElement.setAttribute('data-guideui-theme', 'dark');Custom themes
import { applyTheme } from 'guideui-themes';
applyTheme('brand', {
accent: '#ff5722',
bg: '#1a1a2e',
fg: '#eaeaea',
});Or override any variable directly in CSS: --gui-accent, --gui-bg, --gui-fg, --gui-border, --gui-radius, and more.
MIT © GuideUI
