Theming & Styling
Learn how to customize Boreal UI with SCSS variables, built-in themes, state colors, and the ThemeProvider context.
Overview
Boreal UI provides a flexible theming system built on SCSS variables and a ThemeProvider context. Whether you want to use built-in themes or define your own, everything is designed for consistency and scalability.
Key Topics
- SCSS VariablesBase design tokens for colors, spacing, typography, and more.
- Shemes and ThemesBuilt-in color pallets: primary, secondary, tertiary, quaternary and custom color schemes.
- StatesCustomizing success, warning, and error colors.
- Theme Provider ContextWrap your app and switch themes dynamically with `useTheme`.
Want to Dive Deeper?
Check out the Components section to see how themes integrate with individual UI components.