Styles that compose
Choose your look, surface, mode, and accent.
Lyra’s optional style layers keep a solid base available while looks such as shadcn and Material can be combined with surface presets. Theme inputs also cover type, radius, elevation, chart colours, contrast, and motion preferences.
Example
Import the base theme and one optional look, then select it on a scope.
import '@aceshooting/lyra-ui/theme.css';
import '@aceshooting/lyra-ui/looks/shadcn.css';
import '@aceshooting/lyra-ui/surfaces/glass.css';
import { setLyraStyle } from '@aceshooting/lyra-ui/theme.js';
setLyraStyle({ look: 'shadcn', surface: 'glass', mode: 'system',
accent: 'emerald', density: 'comfortable' });