Skip to content

The Beta Design System is no longer being updated.

It remains online for reference only. Maintenance, bug fixes, and security updates will continue through July 1, 2026 and are tracked in the Beta GitHub repository.

For active development, head over to California's next design system in our new GitHub repository.

Base CSS

Readme Changelog

Development stage

1
In research
2
Alpha
3
Beta
4
Production

Alpha components have not been thoroughly tested by developers. Learn more about component maturity.

This is a package of universal style rules for the Design System.

Preview

preview

Theming

Theme-specific stylesheets are generated by the build command.

A theme is composed of:

@import '../colorschemes/_cannabis'; /* theme colors */
@import '../_core';
  • A themed file defining specific values for standard colors
  • The core file which includes all sass files in the base-css package

CSS variables

All variables are defined using CSS variables with a fallback value.

There are variables defined in src/_variables.scss which are shared between all themes.

Theme specific values are defined in src/colorschemes