On this page Notices Color Scheme Typography, Text Styling Highlight Containers Section (Side) Navigation Figure with Caption Call-to-Action Buttons Cards Number Counter Other Components and Source Code Notices Notice: This is a short emergency notice. <p class="h3 m-t-0"><span class="textBoldRed"><span class="ca-gov-icon-warning-triangle"></span> Notice:</span> This is a short emergency notice.</p> Notice: This is a longer emergency notice. It has two or more sentences. Lorem ipsum dolor sit amet. <p class="h4 m-t-0"><span class="textBoldRed"><span class="ca-gov-icon-warning-triangle"></span> Notice:</span> This is a longer emergency notice. It has two or more sentences. Lorem ipsum dolor sit amet.</p> Color Scheme Main Colors Class Swatch Hex .color-primary #045070 .color-default #F5F5F5 [plain] #FFFFFF Accent Colors Class Swatch Hex .color-standout #0A1E25 .color-highlight #FDB81E .color-s1 #E8F1F5 .color-s2 #AECAD5 .color-s3 #061217 Typography and Text Styling Headings Font: heading text uses “Inter” Bold/700. Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Body Text Font: body text uses “Source Sans Pro(opens in new tab)” Regular/400. "Lead" Paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet eleifend velit. Nulla imperdiet enim eu elit pretium, nec ullamcorper justo blandit. Nunc a lectus purus. Praesent dignissim a sem ut placerat. Regular Paragraph. Fusce rutrum sit amet arcu vitae luctus. Aenean placerat libero vel nibh egestas, quis imperdiet ante semper. Proin fringilla odio a urna fringilla dapibus. Phasellus at justo non ipsum dignissim pharetra a non turpis. Vivamus cursus metus ac lorem vestibulum, in consequat velit dictum. Aliquam vestibulum lorem quis dui hendrerit, at tincidunt eros fermentum. Nunc vel augue lectus. Sed facilisis, justo eget scelerisque tempor, ligula ante imperdiet tortor, nec pharetra sapien massa ac metus. Praesent placerat vel mauris vel porttitor. Sed eleifend condimentum lorem, eget elementum metus rutrum eu. Table-Default caption # First Name Last Name Username 1 Mark Otto @mdo 2 Jacob Thornton @fat 3 Larry the Bird @twitter Highlight Containers Default Big Announcement Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet eleifend velit. Nulla imperdiet enim eu elit pretium, nec ullamcorper justo blandit. Nunc a lectus purus Understated Big Announcement Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet eleifend velit. Nulla imperdiet enim eu elit pretium, nec ullamcorper justo blandit. Nunc a lectus purus Standout Big Announcement Use sparingly! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet eleifend velit. Nulla imperdiet enim eu elit pretium, nec ullamcorper justo blandit. Nunc a lectus purus Section (Side) Navigation Accordion side navigation Landing page Page 2 Subpage 1 Subpage 2 Subpage 3 Page 3 Page 4 Page 5 Figure with Caption Caption is optional. See Guidelines > Images for image credit standards. Rainbow trout. Photo credit. Call-to-Action Buttons Important Link 1 Important Link 2 Important Link 3 Cards Card Grid - 3 Columns with Photos Note: Size images for cards to 700 pixels wide, all the same height. Short Title Shortest description. Short Title A shorter description to show how all cards will have the same height in the grid. Short Title Briefly tell your reader what they will find at the card's destination then link to that location. A longer description to show how all cards will have the same height in the grid. Card Grid - 4 Columns with Icons Title Here This space should quickly describe what visitors will find at the button link. Title Here This space should quickly describe what visitors will find at the button link. Title Here This space should quickly describe what visitors will find at the button link. Title Here This space should quickly describe what visitors will find at the button link. Number Counter 39 million California is home to nearly 40 million residents. One in four Californians is born overseas. 15% of the US GDP California contributes almost 15% to the US GDP. It is the world's fifth-largest economy. 9 national parks With the most national parks in the US, California also boasts 87 state parks and 63 state beaches. Other Components and Source Code Blockquote Button Countdown timer Card grid Horizontal separator Link grid Lists Number counter Page navigation Progress bar Progress tracker Side navigation Social media icons Step List Table
Short Title Briefly tell your reader what they will find at the card's destination then link to that location. A longer description to show how all cards will have the same height in the grid.