Web Services Help Center Banner

JCC Web Standards & Usability Guidelines

Color Palette

This section explains the usage of primary colors, supporting colors and color tints. The palette below was specifically chosen to bring cohesiveness to the California Courts Website brand.

Color palettes for web and digital services beginning 2021

The Judicial Council Web Digital Services team is in the process of updating the branch visual design style guide. Moving forward, new and redesigned web properties will use the following color palette; additional themes will be added as our design system grows, but our basic primary and accent colors are listed below:

Default Theme Colors

Below is the default theme color palette for new and redesigned websites.

Website Notification Colors

Below is the color palette for website notifications or states (such as errors, information, etc.) for new and redesigned websites:

California Courts Website Color Palette prior to 2021

During a transitional phase, the Web Digital Services team will continue to maintain websites using our previous color pallette.  As sites are redesigned, our default colors will be used, and new themes may be implemented.  Please reference the information below if your website or digital service has not yet undergone a redesign.  

Primary Colors (to be retired)

The current California Courts Website global colors are dark blue (#073873), medium blue (#6a88ab), and gray (#222222). A commonly used secondary color is a medium-light blue (#d3deeb).

The primary color may be used as percentages of the solid color ranging from 100% through to 10% or as tonal gradations; this allows versatility when creating backgrounds. Note: Designers must keep in mind ADA (American Disabilities Act) accessibility and maintain legibility. Where possible, allow for adequate padding between text, images and borders for easier readability for all site visitors.

Global colors are used throughout the site. They are used for links and content. Supporting colors are used in the drop-down menus, content page tabs, and side column boxes.

Global Colors

Secondary Colors (to be retired) 

The California Courts Website has a variety of secondary colors that can be used to highlight, accent, or call attention to content. Note that these colors should not be used for hyperlinks or text, and are mainly meant for graphical additions to the site. The darker maroon shades are reserved primarily for urgent or special notices, and should be used sparingly, and for a finite amount of time.

As with the primary colors, secondary colors may be used as percentages of the solid color ranging from 100% through to 10% or as tonal gradations; this allows versatility when creating backgrounds. Note: Designers must keep in mind ADA (American Disabilities Act) accessibility and maintain legibility. Where possible, allow for adequate padding between text, images and borders for easier readability for all site visitors.

Below are lighter and darker versions of each secondary color.

secondary colors codes

Examples of these secondary colors in use are as follows:

secondary colors examples