Customizing Site Colors

The Pine is built on a 3 color plus 1 background color structure.

The Background Color is the color used for the site background.

The Primary Color is used for title and body copy. And allows for a Primary Tint to be set as well. By default this tint version is set as a lighter tint of the Primary Color.

The secondary color is used for features that aren’t essential to the user experience, and that we don’t want to draw attention specifically to. By default the Secondary Color is a darker version of the background color. It also allows for a lighter Secondary Color Tint and a darker  Secondary Color Shade.

The shade is used for things like hovers, and the tint is really only used for separating the meta content (tags and comments) from the background on posts.

The Accent Color is used for things we want to draw attention to. Things such as buttons and links.

The Accent Color Shade is used for hovers on titles and links. This is a darker shade of the Accent Color.