Advanced Color & Theming
Unlock the full power of Axiom's dynamic and flexible theming system.
Live Theme Showcase
Use the theme switcher below to see how all components on this page instantly adapt to the new color scheme. This is the power of CSS variables at the core of Axiom.
Building with Color
Axiom's semantic color system makes it easy to build beautiful, consistent interfaces. Here are some examples of how to combine colors to create stunning components.
Themed Card
Primary Container
This card uses the primary container color for its background, ensuring perfect text contrast.
Themed Alert
Error! Something went wrong.
Themed Badges
Secondary TertiaryCreating a Custom Theme
Creating a new theme is as simple as defining a new set of CSS variables. You can use the interactive color pickers below to help you generate the code for your own theme.
Your Custom Theme CSS