Style Guide Color Cards

Isolated color section of a style guide I'm currently working on.

Each card displays the sass variable name so designers, developers, and project managers can refer to colors by a consistent name. For this project all names are space related.

A large circle displays the color, while a lighter and darker variation is also displayed. These also get individual sass names.

The color values are displayed in multiple formats for reference outside of the compiled style sheets: Facebook, Photoshop.

When clicked, the card fills with the primary color to illustrate what text would look like above it.