Skip to content

Instantly share code, notes, and snippets.

@elyseholladay
Created January 16, 2013 20:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save elyseholladay/4550373 to your computer and use it in GitHub Desktop.
Save elyseholladay/4550373 to your computer and use it in GitHub Desktop.
SASS color naming setup
// -------------------------------------------------------------- //
// COLORS ------------------------------------------------------- //
// -------------------------------------------------------------- //
$black: #000000
$greydark: #464646
$greymedium: #686868
$grey: #9d9d9d
$greylight: #adadad
$greypale: #d0d0d0
$silver: #f9f9f9
$white: #ffffff
// STYLEABLE COLORS
// primary color: use main brand color.
$primary_color_bright: #c2002b
// darker version of the primary color. can be replaced by a specified brand color if one exists. used mainly for hover states.
$primary_color_dark: darken($primary_color_bright,10%)
// highlight color, should be bright and provide significant contrast to primary color.
$highlight_color_bright: #0073cb
// darker version of the primary color. can be replaced by a specified brand color if one exists. used mainly for hover states.
$highlight_color_dark: darken($highlight_color_bright,10%)
// tertiary brand color, used sparingly.
$tertiary_color: $greylight
// MESSAGE COLORS
$alert: $highlight_color_bright
$error: $primary_color_dark
$success: #81a635
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment