Skip to main content
Skip to main content

Web Style Guidelines
and Resources

Strata - Version Three

Colors

Strata Three expands upon the garnet, gold, and black (labeled "slate" here). Shades were added to garnet for use on purely garnet backgrounds only. Tints were added for gold to have a wider range of background options. Using the process black as a base, a range of values from the nearly white to the nearly black were generated.

Swatches


Garnet

Garnet

#782f40

S3C: gt
H: #7c3546
S: #6c2c3b

Garnet Shades

Garnet +1 Black *

#5f2835

S3C: gt1k
H: #662a38
S: #542530

Garnet +2 Black *

#47222a

S3C: gt2k
H: #4d242d
S: #3b1f25

Garnet +3 Black *

#2f1c1f

S3C: gt3k
H: #3a1f24
S: #23181a

Legend

S3C: Strata Three Code
H: Highlight
S: Shadow

* Garnet shades are only for use as accent colors on top of the pure garnet and not as normal backgrounds.


Gold

Gold

#ceb888

S3C: gd
H: #d1bc8f
S: #c3ae81

Gold Tints

Gold +1 Canvas

#dacaa6

S3C: gd1c
H: #ddcead
S: #d4c197

Gold +2 Canvas

#e7dcc4

S3C: gd2c
H: #e9e0cb
S: #e1d3b5

Gold +3 Canvas

#f3ede1

S3C: gd3c
H: #f6f2e9
S: #ede5d3
 

Neutrals

Canvas

#fdfcfc

S3C: c
H: #ffffff
S: #f3f2f2

White

#f4f4f4

S3C: w
H: #fbfbfb
S: #e5e5e5

Neutral +2 White

#d5d4d4

S3C: n2w
H: #dbdbdb
S: #c8c8c8

Neutral +1 White

#b5b5b4

S3C: n1w
H: #bbbbba
S: #a8a7a7

Neutral

#969594

S3C: n
H: #9c9b9a
S: #898887

Neutral +1 Slate

#767474

S3C: n1s
H: #7c7b7a
S: #696867

Neutral +2 Slate

#565554

S3C: n2s
H: #5d5b5b
S: #4a4847

Slate

#2c2a29

S3C: s
H: #333130
S: #292726

Black

#161514

S3C: k
H: #1d1c1b
S: #141312

Table

S3 Name

S3 Class

S3 Class Alt

Pure Color

Highlight

Shadow

Garnet .s3-gt .s3-bg-gt #782f40 #7c3546 #6c2c3b
Garnet +1 Black * .s3-gt1k . #5f2835 #662a38 #542530
Garnet +2 Black * .s3-gt2k . #47222a #4d242d #3b1f25
Garnet +3 Black * .s3-gt3k . #2f1c1f #3a1f24 #23181a
Gold .s3-gd .s3-bg-gd #ceb888 #d1bc8f #c3ae81
Gold +1 Canvas .s3-gd1c .s3-bg-gd1c #dacaa6 #ddcead #d4c197
Gold +2 Canvas .s3-gd2c .s3-bg-gd2c #e7dcc4 #e9e0cb #e1d3b5
Gold +3 Canvas .s3-gd3c .s3-bg-gd3c #f3ede1 #f6f2e9 #ede5d3
Canvas .s3-c .s3-bg-c #fdfcfc #ffffff #f3f2f2
White .s3-w .s3-bg-w #f4f4f4 #fbfbfb #e5e5e5
Neutral +2 White .s3-n2w .s3-bg-n2w #d5d4d4 #dbdbdb #c8c8c8
Neutral +1 White .s3-n1w .s3-bg-n1w #b5b5b4 #bbbbba #a8a7a7
Neutral .s3-n .s3-bg-n #969594 #9c9b9a #898887
Neutral +1 Slate .s3-n1s .s3-bg-n1s #767474 #7c7b7a #696867
Neutral +2 Slate .s3-n2s .s3-bg-n2s #565554 #5d5b5b #4a4847
Slate .s3-s .s3-bg-s #2c2a29 #333130 #292726
Black .s3-k .s3-bg-k #161514 #1d1c1b #141312