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.

State of California Design System BETA
Custom Google Search

California Design System

California Design System

Meet the California Design System

This system makes it easy to build digital services that meet the needs of Californians.

Get started
California bear with abstract shapes

What's in the Design System

abstract shapes in circles
Principles

Designing excellent services and products is hard. These best practices guide you in your journey.

abstract shapes and lines
Design guide

Design systems are only as good as what goes in them. The design guide help you build quality services and products.

many colored circles
Component library

You do not have to reinvent the wheel every time you need a digital solution. The components solve common user needs for you.

What design systems do

They solve common problems digital teams commonly face. They combine UX principles, interface components, and code. Teams work faster, design better, and focus on new problems instead of old ones.

Make experiences consistent

Services that use a design system feel familiar. This helps people trust a service, even if it's new to them.

Build in accessibility and performance

Components meet WCAG 2.1 accessibility standards. They work well across a range of devices and internet speeds.

Give tested solutions

We test components before releasing them. This lets you deploy them with confidence.

Speak a common language

Shared names for components, patterns, and conventions increases collaboration within and across teams.

Leverage best practices

Design systems capture tried-and-true best practices and allow other teams to use them.

Use resources effectively

With common problems already solved, teams can speed through the basics. You do more with less time and budget.

Principles for people-centered services

highlight section demo

Design for people's needs

Principle 1

Put the needs of Californians first in everything you do. Make your guiding question, “What does someone need to do?”

See all the principles

Who's using the Design System

cannabis.ca.gov website homepage

Department of Cannabis Control

This site is the first implementation of Design System components. It proved the design system model works for state departments.

Visit Department of Cannabis Control cannabis.ca.gov

broadbandforall.cdt.ca.gov website homepage

Broadband for All

The Design System allowed the Broadband for All team to plug-and-play with components on the homepage. With less time spent on engineering, the team could focus more on content and design.

Visit Broadband for All broadbandforall.cdt.ca.gov

GitHub Twitter