Skill Level: 
Intermediate

Background Colors

Brand Background Colors

.unl-bg-scarlet
scarlet #d00000
.unl-bg-cream
cream #fefdfa

User Interface Background Colors

.unl-bg-lightest-gray
lightest gray #f6f6f5
.unl-bg-lighter-gray
lighter gray #ebebea
.unl-bg-light-gray
light gray #e3e3e2 Note that use of .unl-scarlet (this includes links) on .unl-bg-light-gray is not color contrast compliant.
.unl-bg-dark-gray
dark gray #6d6d69
.unl-bg-darker-gray
darker gray #424240
.unl-bg-darkest-gray
darkest gray #242423

Background Images

.unl-bg-grit
grit background pattern

Border Color

Border Color (All Sides)

.unl-b-scarlet
border-color: scarlet #d00000, all sides
.unl-b-cream
border-color: cream #fefdfa, all sides
.unl-b-lightest-gray
border-color: lightest gray #f6f6f5, all sides
.unl-b-lighter-gray
border-color: lighter gray #ebebea, all sides
.unl-b-light-gray
border-color: light gray #e3e3e2, all sides
.unl-b-gray
border-color: gray #c7c8ca, all sides
.unl-b-dark-gray
border-color: dark gray #6d6d69, all sides
.unl-b-darker-gray
border-color: darker gray #424240, all sides
.unl-b-darkest-gray
border-color: darkest gray #242423, all sides

Border Top Color

.unl-bt-scarlet
border-top-color: scarlet #d00000
.unl-bt-cream
border-top-color: cream #fefdfa
.unl-bt-lightest-gray
border-top-color: lightest gray #f6f6f5
.unl-bt-lighter-gray
border-top-color: lighter gray #ebebea
.unl-bt-light-gray
border-top-color: light gray #e3e3e2
.unl-bt-gray
border-top-color: gray #c7c8ca
.unl-bt-dark-gray
border-top-color: dark gray #6d6d69
.unl-bt-darker-gray
border-top-color: darker gray #424240
.unl-bt-darkest-gray
border-top-color: darkest gray #242423

Border Right Color

.unl-br-scarlet
border-right-color: scarlet #d00000
.unl-br-cream
border-right-color: cream #fefdfa
.unl-br-lightest-gray
border-right-color: lightest gray #f6f6f5
.unl-br-lighter-gray
border-right-color: lighter gray #ebebea
.unl-br-light-gray
border-right-color: light gray #e3e3e2
.unl-br-gray
border-right-color: gray #c7c8ca
.unl-br-dark-gray
border-right-color: dark gray #6d6d69
.unl-br-darker-gray
border-right-color: darker gray #424240
.unl-br-darkest-gray
border-right-color: darkest gray #242423

Border Bottom Color

.unl-bb-scarlet
border-bottom-color: scarlet #d00000
.unl-bb-cream
border-bottom-color: cream #fefdfa
.unl-bb-lightest-gray
border-bottom-color: lightest gray #f6f6f5
.unl-bb-lighter-gray
border-bottom-color: lighter gray #ebebea
.unl-bb-light-gray
border-bottom-color: light gray #e3e3e2
.unl-bb-gray
border-bottom-color: gray #c7c8ca
.unl-bb-dark-gray
border-bottom-color: dark gray #6d6d69
.unl-bb-darker-gray
border-bottom-color: darker gray #424240
.unl-bb-darkest-gray
border-bottom-color: darkest gray #242423

Border Left Color

.unl-bl-scarlet
border-left-color: scarlet #d00000
.unl-bl-cream
border-left-color: cream #fefdfa
.unl-bl-lightest-gray
border-left-color: lightest gray #f6f6f5
.unl-bl-lighter-gray
border-left-color: lighter gray #ebebea
.unl-bl-light-gray
border-left-color: light gray #e3e3e2
.unl-bl-gray
border-left-color: gray #c7c8ca
.unl-bl-dark-gray
border-left-color: dark gray #6d6d69
.unl-bl-darker-gray
border-left-color: darker gray #424240
.unl-bl-darkest-gray
border-left-color: darkest gray #242423

Colors

Brand Colors

.unl-scarlet
scarlet #d00000
.unl-cream
cream #fefdfa
.unl-gray
gray #c7c8ca

User Interface Colors

.unl-lightest-gray
lightest gray #f6f6f5
.unl-lighter-gray
lighter gray #ebebea
.unl-light-gray
light gray #e3e3e2
.unl-dark-gray
dark gray #6d6d69
.unl-darker-gray
darker gray #424240
.unl-darkest-gray
darkest gray #242423

Fonts

.unl-font-sans
sans-serif font: Gotham
.unl-font-serif
serif font: Mercury Text

Letter Spacing

.unl-ls-0
letter-spacing: 0
.unl-ls-1
letter-spacing: .01em
.unl-ls-2
letter-spacing: .06em
.unl-ls-3
letter-spacing: .1em
Contributed By: 
IIM