![Image Description](/sample/images/service-tiles/service-paid-family-leave.jpg)
Santa Cruz Theme
Theme Main Colors
.color-highlight
@color-p1
HEX: #f5811bRGB: 245,129,27
.color-primary
@color-p2
HEX: #0f4f94RGB: 15,79,148
.color-standout
@color-p3
HEX: #2c2c4fRGB: 44,44,79
.color-s1
@color-s1
HEX: #E1ECF7RGB: 225,236,247
Theme Colors Customization
There are two ways to customize theme main colors. One way is to change primary and secondary theme color variables in the colorscheme-[yourcolorshceme].scss file. This method will require you to re-compile the state template, you can find instructions in the readme file. After the compilation you will have updated colorscheme-[yourcolorshceme].css file.
Another way is to manually find and replace all main theme colors and their variations in colorscheme-[yourcolorshceme].css. Main theme colors classes will be listed at the top of the CSS file. You can copy their values and use find/replace feature in your web editor software to replace all those colors references with your custom colors throughout entire css file.
Note: Before changing your colors make sure that your custom theme colors have sufficient color cotrast ratios.