ASCE Digital Style Guide

Source:global-scss/_colors.scss, line 1

Grayscale Colors

Go to Confluence for details.

BlackSass: primary-color(black) Hex: #1a1a1a
Gray shade 2Sass: primary-color(gray, shade2) Hex: #555555
Gray shade 1Sass: primary-color(gray, shade1) Hex: #5f6a78
WhiteSass: primary-color(white) Hex: #ffffff
Gray tint 3Sass: primary-color(gray, tint3) Hex: #e5e8ec
GraySass: primary-color(gray) Hex: #edeff1
Gray tint 2Sass: primary-color(gray, tint2) Hex: #f1f3f5
Gray tint 1Sass: primary-color(gray, tint1) Hex: #f6f7f8
Source:global-scss/_colors.scss, line 8

Primary Colors

Go to Confluence for details.

Blue shade 3Sass: primary-color(blue, shade3) Hex: #037fb0
Blue shade 2Sass: primary-color(blue, shade2) Hex: #012a52
Blue shade 1Sass: primary-color(blue, shade1) Hex: #253a6e
BlueSass: primary-color(blue) Hex: #0273ba
Blue tint 1Sass: primary-color(blue, tint1) Hex: #059bd6
Blue tint 2Sass: primary-color(blue, tint2) Hex: #d9eaf5
Green shade 1Sass: primary-color(green, shade1) Hex: #44873c
GreenSass: primary-color(green) Hex: #9fd64d
TealSass: primary-color(teal) Hex: #00818f
Teal tint 1Sass: primary-color(teal, tint1) Hex: #0099a9
Teal tint 2Sass: primary-color(teal, tint2) Hex: #b0e3e4
PinkSass: primary-color(pink) Hex: #d6006e
Pink tint 1Sass: primary-color(pink, tint1) Hex: #e98698
OrangeSass: primary-color(orange) Hex: #d14200
Orange tint 1Sass: primary-color(orange, tint1) Hex: #ff5200
Orange tint 2Sass: primary-color(orange, tint1) Hex: #ef9070
RedSass: primary-color(red) Hex: #ff0000
Source:global-scss/_colors.scss, line 27

Secondary Colors

Go to Confluence for details.

RedSass: secondary-color(red) Hex: #cc0000
GreenSass: secondary-color(green) Hex: #83c32e
Source:global-scss/_colors.scss, line 99
Example
$blue-gradientSass: @include linear-gradient($blue-gradient)CSS: linear-gradient(-45deg, #253a6e, #1d5389, #146ea6, #0c85be, #059bd6)
$green-gradientSass: @include linear-gradient($green-gradient)CSS: linear-gradient(-45deg, #9fd64d, #75c170, #49ab95, #2297b6, #0086d2)
$dark-green-gradientSass: @include linear-gradient($dark-green-gradient)CSS: linear-gradient(-45deg, #9fd64d, #44873c, #2c736e, #186299, #059bd6)
$light-green-gradientSass: @include linear-gradient($light-green-gradient)CSS: linear-gradient(-45deg, rgba(#9fd64d, .6), rgba(#75c170, .6), rgba(#49ab95, .6), rgba(#2297b6, .6), rgba(#0086d2, .6))
$bg-blue-gradientSass: @include linear-gradient($bg-blue-gradient)CSS: linear-gradient(-45deg, rgba(#253a6e, .93), rgba(#1d5389, .93), rgba(#146ea6, .93), rgba(#0c85be, .93), rgba(#059bd6, .93))
$black-gradientSass: @include linear-gradient($black-gradient)CSS: linear-gradient(-45deg, transparent, rgba(0, 0, 0, .25) 50%, rgba(0, 0, 0, .6) 75%, rgba(0, 0, 0, 1) 100%)
$black-gradient-mobileSass: @include linear-gradient($black-gradient-mobile)CSS:linear-gradient(-45deg, transparent, rgba(0, 0, 0, .25) 50%, rgba(0, 0, 0, .6) 65%, rgba(0, 0, 0, 1) 100%)
View Markup
 <div class="kss-gradients-container">
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, #253a6e, #1d5389, #146ea6, #0c85be, #059bd6)"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$blue-gradient</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($blue-gradient)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS: </span>
         <code class="language-css">linear-gradient(-45deg, #253a6e, #1d5389, #146ea6, #0c85be, #059bd6)</code>
       </span>
     </div>
   </div>
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, #9fd64d, #75c170, #49ab95, #2297b6, #0086d2)"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$green-gradient</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($green-gradient)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS: </span>
         <code class="language-css">linear-gradient(-45deg, #9fd64d, #75c170, #49ab95, #2297b6, #0086d2)</code>
       </span>
     </div>
   </div>
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, #9fd64d, #44873c, #2c736e, #186299, #059bd6)"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$dark-green-gradient</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($dark-green-gradient)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS: </span>
         <code class="language-css">linear-gradient(-45deg, #9fd64d, #44873c, #2c736e, #186299, #059bd6)</code>
       </span>
     </div>
   </div>
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, rgba(159,214,77,.6), rgba(117,193,112,.6), rgba(73,171,149,.6), rgba(34,151,182,.6), rgba(0,134,210,.6))"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$light-green-gradient</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($light-green-gradient)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS: </span>
         <code class="language-css">linear-gradient(-45deg, rgba(#9fd64d, .6), rgba(#75c170, .6), rgba(#49ab95, .6), rgba(#2297b6, .6), rgba(#0086d2, .6))</code>
       </span>
     </div>
   </div>
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, rgba(37,58,110,.93), rgba(29,83,137,.93), rgba(20,110,166,.93), rgba(12,133,190,.93),rgba(5,155,214,.93))"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$bg-blue-gradient</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($bg-blue-gradient)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS: </span>
         <code class="language-css">linear-gradient(-45deg, rgba(#253a6e, .93), rgba(#1d5389, .93), rgba(#146ea6, .93), rgba(#0c85be, .93), rgba(#059bd6, .93))</code>
       </span>
     </div>
   </div>
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, transparent, rgba(0, 0, 0, .25) 50%, rgba(0, 0, 0, .6) 75%, rgba(0, 0, 0, 1) 100%)"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$black-gradient</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($black-gradient)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS: </span>
         <code class="language-css">linear-gradient(-45deg, transparent, rgba(0, 0, 0, .25) 50%, rgba(0, 0, 0, .6) 75%, rgba(0, 0, 0, 1) 100%)</code>
       </span>
     </div>
   </div>
   <div class="kss-gradient">
     <div class="kss-gradient-swatch" style="background:linear-gradient(-45deg, transparent, rgba(0, 0, 0, .25) 50%, rgba(0, 0, 0, .6) 65%, rgba(0, 0, 0, 1) 100%)"></div>
     <div class="kss-gradient-description">
       <span class="kss-gradient-name">$black-gradient-mobile</span>
       <span class="kss-gradient-var">
         <span class="kss-gradient-label">Sass: </span>
         <code class="language-scss">@include linear-gradient($black-gradient-mobile)</code>
       </span>
       <span class="kss-gradient-code">
         <span class="kss-gradient-label">CSS:</span>
         <code class="language-css">linear-gradient(-45deg, transparent, rgba(0, 0, 0, .25) 50%, rgba(0, 0, 0, .6) 65%, rgba(0, 0, 0, 1) 100%)</code>
       </span>
     </div>
   </div>
 </div>
Source:global-scss/_settings.scss, line 35

Color Accessibility

Below is a grid of all possible color combinations and whether or not they pass/fail accessibility standards. Refer to the legend below the table for more information if needed.

Go to Confluence for details about color contrast.

ColorBlack#1A1A1A Gray shade 2#555555 Gray shade 1#5F6A78 Gray#EDEFF1 Gray tint 1#F6F7F8 Gray tint 2#F1F3F5 Gray tint 3#E5E8EC White#FFFFFF Blue shade 3#037FB0 Blue shade 2#012A52 Blue shade 1#253A6E Blue#0273BA Blue tint 1#059BD6 Blue tint 2#D9EAF5 Green shade 1#44873C Green#9FD64D Teal#00818F Teal tint 1#0099A9 Teal tint 2#B0E3E4 Pink#D6006E Pink tint 1#E98698 Orange#D14200 Orange tint 1#FF5200 Orange tint 2#EF9070 Red#FF0000 Red (secondary)#CC0000 Green (secondary)#83C32E
Black#1A1A1A
Text
Fail
2.3
Text
AA18
3.2
Text
AAA
15.1
Text
AAA
16.2
Text
AAA
15.6
Text
AAA
14.2
Text
AAA
17.4
Text
AA18
3.9
Text
Fail
1.2
Text
Fail
1.6
Text
AA18
3.5
Text
AA
5.5
Text
AAA
14.1
Text
AA18
4.0
Text
AAA
10.1
Text
AA18
3.8
Text
AA
5.1
Text
AAA
12.4
Text
AA18
3.4
Text
AA
6.9
Text
AA18
3.7
Text
AA
5.4
Text
AAA
7.4
Text
AA18
4.4
Text
Fail
3.0
Text
AAA
8.1
Gray shade 2#555555
Text
Fail
2.3
Text
Fail
1.4
Text
AA
6.5
Text
AA
7.0
Text
AA
6.7
Text
AA
6.1
Text
AAA
7.5
Text
Fail
1.7
Text
Fail
1.9
Text
Fail
1.5
Text
Fail
1.5
Text
Fail
2.4
Text
AA
6.0
Text
Fail
1.7
Text
AA18
4.3
Text
Fail
1.6
Text
Fail
2.2
Text
AA
5.3
Text
Fail
1.4
Text
Fail
3.0
Text
Fail
1.6
Text
Fail
2.3
Text
AA18
3.2
Text
Fail
1.9
Text
Fail
1.3
Text
AA18
3.5
Gray shade 1#5F6A78
Text
AA18
3.2
Text
Fail
1.4
Text
AA
4.8
Text
AA
5.1
Text
AA
4.9
Text
AA18
4.5
Text
AA
5.5
Text
Fail
1.2
Text
Fail
2.6
Text
Fail
2.0
Text
Fail
1.1
Text
Fail
1.7
Text
AA18
4.5
Text
Fail
1.3
Text
AA18
3.2
Text
Fail
1.2
Text
Fail
1.6
Text
AA18
3.9
Text
Fail
1.1
Text
Fail
2.2
Text
Fail
1.2
Text
Fail
1.7
Text
Fail
2.3
Text
Fail
1.4
Text
Fail
1.1
Text
Fail
2.6
Gray#EDEFF1
Text
AAA
15.1
Text
AA
6.5
Text
AA
4.8
Text
Fail
1.1
Text
Fail
1.0
Text
Fail
1.1
Text
Fail
1.2
Text
AA18
3.9
Text
AAA
12.5
Text
AAA
9.5
Text
AA18
4.4
Text
Fail
2.7
Text
Fail
1.1
Text
AA18
3.8
Text
Fail
1.5
Text
AA18
4.0
Text
Fail
3.0
Text
Fail
1.2
Text
AA18
4.5
Text
Fail
2.2
Text
AA18
4.1
Text
Fail
2.8
Text
Fail
2.0
Text
AA18
3.5
Text
AA
5.1
Text
Fail
1.9
Gray tint 1#F6F7F8
Text
AAA
16.2
Text
AA
7.0
Text
AA
5.1
Text
Fail
1.1
Text
Fail
1.0
Text
Fail
1.1
Text
Fail
1.1
Text
AA18
4.2
Text
AAA
13.5
Text
AAA
10.3
Text
AA
4.7
Text
Fail
2.9
Text
Fail
1.1
Text
AA18
4.1
Text
Fail
1.6
Text
AA18
4.3
Text
AA18
3.2
Text
Fail
1.3
Text
AA
4.8
Text
Fail
2.4
Text
AA18
4.4
Text
AA18
3.0
Text
Fail
2.2
Text
AA18
3.7
Text
AA
5.5
Text
Fail
2.0
Gray tint 2#F1F3F5
Text
AAA
15.6
Text
AA
6.7
Text
AA
4.9
Text
Fail
1.0
Text
Fail
1.0
Text
Fail
1.1
Text
Fail
1.1
Text
AA18
4.0
Text
AAA
13.0
Text
AAA
9.9
Text
AA
4.5
Text
Fail
2.8
Text
Fail
1.1
Text
AA18
4.0
Text
Fail
1.5
Text
AA18
4.2
Text
AA18
3.1
Text
Fail
1.3
Text
AA
4.6
Text
Fail
2.3
Text
AA18
4.2
Text
Fail
2.9
Text
Fail
2.1
Text
AA18
3.6
Text
AA
5.3
Text
Fail
1.9
Gray tint 3#E5E8EC
Text
AAA
14.2
Text
AA
6.1
Text
AA18
4.5
Text
Fail
1.1
Text
Fail
1.1
Text
Fail
1.1
Text
Fail
1.2
Text
AA18
3.7
Text
AAA
11.7
Text
AAA
8.9
Text
AA18
4.1
Text
Fail
2.6
Text
Fail
1.0
Text
AA18
3.6
Text
Fail
1.4
Text
AA18
3.8
Text
Fail
2.8
Text
Fail
1.1
Text
AA18
4.2
Text
Fail
2.1
Text
AA18
3.8
Text
Fail
2.6
Text
Fail
1.9
Text
AA18
3.3
Text
AA
4.8
Text
Fail
1.7
White#FFFFFF
Text
AAA
17.4
Text
AAA
7.5
Text
AA
5.5
Text
Fail
1.2
Text
Fail
1.1
Text
Fail
1.1
Text
Fail
1.2
Text
AA
4.5
Text
AAA
14.4
Text
AAA
11.0
Text
AA
5.0
Text
AA18
3.2
Text
Fail
1.2
Text
AA18
4.4
Text
Fail
1.7
Text
AA
4.6
Text
AA18
3.4
Text
Fail
1.4
Text
AA
5.1
Text
Fail
2.5
Text
AA
4.7
Text
AA18
3.3
Text
Fail
2.4
Text
AA18
4.0
Text
AA
5.9
Text
Fail
2.1
Blue shade 3#037FB0
Text
AA18
3.9
Text
Fail
1.7
Text
Fail
1.2
Text
AA18
3.9
Text
AA18
4.2
Text
AA18
4.0
Text
AA18
3.7
Text
AA
4.5
Text
AA18
3.2
Text
Fail
2.4
Text
Fail
1.1
Text
Fail
1.4
Text
AA18
3.7
Text
Fail
1.0
Text
Fail
2.6
Text
Fail
1.0
Text
Fail
1.3
Text
AA18
3.2
Text
Fail
1.1
Text
Fail
1.8
Text
Fail
1.0
Text
Fail
1.4
Text
Fail
1.9
Text
Fail
1.1
Text
Fail
1.3
Text
Fail
2.1
Blue shade 2#012A52
Text
Fail
1.2
Text
Fail
1.9
Text
Fail
2.6
Text
AAA
12.5
Text
AAA
13.5
Text
AAA
13.0
Text
AAA
11.7
Text
AAA
14.4
Text
AA18
3.2
Text
Fail
1.3
Text
Fail
2.9
Text
AA
4.6
Text
AAA
11.7
Text
AA18
3.3
Text
AAA
8.4
Text
AA18
3.1
Text
AA18
4.2
Text
AAA
10.3
Text
Fail
2.8
Text
AA
5.7
Text
AA18
3.1
Text
AA18
4.4
Text
AA
6.1
Text
AA18
3.6
Text
Fail
2.5
Text
AA
6.7
Blue shade 1#253A6E
Text
Fail
1.6
Text
Fail
1.5
Text
Fail
2.0
Text
AAA
9.5
Text
AAA
10.3
Text
AAA
9.9
Text
AAA
8.9
Text
AAA
11.0
Text
Fail
2.4
Text
Fail
1.3
Text
Fail
2.2
Text
AA18
3.5
Text
AAA
8.9
Text
Fail
2.5
Text
AA
6.4
Text
Fail
2.4
Text
AA18
3.2
Text
AAA
7.8
Text
Fail
2.1
Text
AA18
4.4
Text
Fail
2.4
Text
AA18
3.4
Text
AA
4.7
Text
Fail
2.8
Text
Fail
1.9
Text
AA
5.1
Blue#0273BA
Text
AA18
3.5
Text
Fail
1.5
Text
Fail
1.1
Text
AA18
4.4
Text
AA
4.7
Text
AA
4.5
Text
AA18
4.1
Text
AA
5.0
Text
Fail
1.1
Text
Fail
2.9
Text
Fail
2.2
Text
Fail
1.6
Text
AA18
4.1
Text
Fail
1.1
Text
Fail
2.9
Text
Fail
1.1
Text
Fail
1.5
Text
AA18
3.6
Text
Fail
1.0
Text
Fail
2.0
Text
Fail
1.1
Text
Fail
1.6
Text
Fail
2.1
Text
Fail
1.3
Text
Fail
1.2
Text
Fail
2.4
Blue tint 1#059BD6
Text
AA
5.5
Text
Fail
2.4
Text
Fail
1.7
Text
Fail
2.7
Text
Fail
2.9
Text
Fail
2.8
Text
Fail
2.6
Text
AA18
3.2
Text
Fail
1.4
Text
AA
4.6
Text
AA18
3.5
Text
Fail
1.6
Text
Fail
2.6
Text
Fail
1.4
Text
Fail
1.8
Text
Fail
1.5
Text
Fail
1.1
Text
Fail
2.2
Text
Fail
1.6
Text
Fail
1.2
Text
Fail
1.5
Text
Fail
1.0
Text
Fail
1.3
Text
Fail
1.3
Text
Fail
1.9
Text
Fail
1.5
Blue tint 2#D9EAF5
Text
AAA
14.1
Text
AA
6.0
Text
AA18
4.5
Text
Fail
1.1
Text
Fail
1.1
Text
Fail
1.1
Text
Fail
1.0
Text
Fail
1.2
Text
AA18
3.7
Text
AAA
11.7
Text
AAA
8.9
Text
AA18
4.1
Text
Fail
2.6
Text
AA18
3.6
Text
Fail
1.4
Text
AA18
3.8
Text
Fail
2.8
Text
Fail
1.1
Text
AA18
4.2
Text
Fail
2.0
Text
AA18
3.8
Text
Fail
2.6
Text
Fail
1.9
Text
AA18
3.2
Text
AA
4.8
Text
Fail
1.7
Green shade 1#44873C
Text
AA18
4.0
Text
Fail
1.7
Text
Fail
1.3
Text
AA18
3.8
Text
AA18
4.1
Text
AA18
4.0
Text
AA18
3.6
Text
AA18
4.4
Text
Fail
1.0
Text
AA18
3.3
Text
Fail
2.5
Text
Fail
1.1
Text
Fail
1.4
Text
AA18
3.6
Text
Fail
2.6
Text
Fail
1.1
Text
Fail
1.3
Text
AA18
3.1
Text
Fail
1.2
Text
Fail
1.7
Text
Fail
1.1
Text
Fail
1.4
Text
Fail
1.9
Text
Fail
1.1
Text
Fail
1.3
Text
Fail
2.1
Green#9FD64D
Text
AAA
10.1
Text
AA18
4.3
Text
AA18
3.2
Text
Fail
1.5
Text
Fail
1.6
Text
Fail
1.5
Text
Fail
1.4
Text
Fail
1.7
Text
Fail
2.6
Text
AAA
8.4
Text
AA
6.4
Text
Fail
2.9
Text
Fail
1.8
Text
Fail
1.4
Text
Fail
2.6
Text
Fail
2.7
Text
Fail
2.0
Text
Fail
1.2
Text
Fail
3.0
Text
Fail
1.5
Text
Fail
2.7
Text
Fail
1.9
Text
Fail
1.4
Text
Fail
2.3
Text
AA18
3.4
Text
Fail
1.2
Teal#00818F
Text
AA18
3.8
Text
Fail
1.6
Text
Fail
1.2
Text
AA18
4.0
Text
AA18
4.3
Text
AA18
4.2
Text
AA18
3.8
Text
AA
4.6
Text
Fail
1.0
Text
AA18
3.1
Text
Fail
2.4
Text
Fail
1.1
Text
Fail
1.5
Text
AA18
3.8
Text
Fail
1.1
Text
Fail
2.7
Text
Fail
1.4
Text
AA18
3.3
Text
Fail
1.1
Text
Fail
1.8
Text
Fail
1.0
Text
Fail
1.4
Text
Fail
2.0
Text
Fail
1.2
Text
Fail
1.3
Text
Fail
2.2
Teal tint 1#0099A9
Text
AA
5.1
Text
Fail
2.2
Text
Fail
1.6
Text
Fail
3.0
Text
AA18
3.2
Text
AA18
3.1
Text
Fail
2.8
Text
AA18
3.4
Text
Fail
1.3
Text
AA18
4.2
Text
AA18
3.2
Text
Fail
1.5
Text
Fail
1.1
Text
Fail
2.8
Text
Fail
1.3
Text
Fail
2.0
Text
Fail
1.4
Text
Fail
2.4
Text
Fail
1.5
Text
Fail
1.4
Text
Fail
1.4
Text
Fail
1.1
Text
Fail
1.5
Text
Fail
1.2
Text
Fail
1.7
Text
Fail
1.6
Teal tint 2#B0E3E4
Text
AAA
12.4
Text
AA
5.3
Text
AA18
3.9
Text
Fail
1.2
Text
Fail
1.3
Text
Fail
1.3
Text
Fail
1.1
Text
Fail
1.4
Text
AA18
3.2
Text
AAA
10.3
Text
AAA
7.8
Text
AA18
3.6
Text
Fail
2.2
Text
Fail
1.1
Text
AA18
3.1
Text
Fail
1.2
Text
AA18
3.3
Text
Fail
2.4
Text
AA18
3.7
Text
Fail
1.8
Text
AA18
3.3
Text
Fail
2.3
Text
Fail
1.7
Text
Fail
2.8
Text
AA18
4.2
Text
Fail
1.5
Pink#D6006E
Text
AA18
3.4
Text
Fail
1.4
Text
Fail
1.1
Text
AA18
4.5
Text
AA
4.8
Text
AA
4.6
Text
AA18
4.2
Text
AA
5.1
Text
Fail
1.1
Text
Fail
2.8
Text
Fail
2.1
Text
Fail
1.0
Text
Fail
1.6
Text
AA18
4.2
Text
Fail
1.2
Text
Fail
3.0
Text
Fail
1.1
Text
Fail
1.5
Text
AA18
3.7
Text
Fail
2.0
Text
Fail
1.1
Text
Fail
1.6
Text
Fail
2.2
Text
Fail
1.3
Text
Fail
1.1
Text
Fail
2.4
Pink tint 1#E98698
Text
AA
6.9
Text
Fail
3.0
Text
Fail
2.2
Text
Fail
2.2
Text
Fail
2.4
Text
Fail
2.3
Text
Fail
2.1
Text
Fail
2.5
Text
Fail
1.8
Text
AA
5.7
Text
AA18
4.4
Text
Fail
2.0
Text
Fail
1.2
Text
Fail
2.0
Text
Fail
1.7
Text
Fail
1.5
Text
Fail
1.8
Text
Fail
1.4
Text
Fail
1.8
Text
Fail
2.0
Text
Fail
1.9
Text
Fail
1.3
Text
Fail
1.1
Text
Fail
1.6
Text
Fail
2.3
Text
Fail
1.2
Orange#D14200
Text
AA18
3.7
Text
Fail
1.6
Text
Fail
1.2
Text
AA18
4.1
Text
AA18
4.4
Text
AA18
4.2
Text
AA18
3.8
Text
AA
4.7
Text
Fail
1.0
Text
AA18
3.1
Text
Fail
2.4
Text
Fail
1.1
Text
Fail
1.5
Text
AA18
3.8
Text
Fail
1.1
Text
Fail
2.7
Text
Fail
1.0
Text
Fail
1.4
Text
AA18
3.3
Text
Fail
1.1
Text
Fail
1.9
Text
Fail
1.4
Text
Fail
2.0
Text
Fail
1.2
Text
Fail
1.3
Text
Fail
2.2
Orange tint 1#FF5200
Text
AA
5.4
Text
Fail
2.3
Text
Fail
1.7
Text
Fail
2.8
Text
AA18
3.0
Text
Fail
2.9
Text
Fail
2.6
Text
AA18
3.3
Text
Fail
1.4
Text
AA18
4.4
Text
AA18
3.4
Text
Fail
1.6
Text
Fail
1.0
Text
Fail
2.6
Text
Fail
1.4
Text
Fail
1.9
Text
Fail
1.4
Text
Fail
1.1
Text
Fail
2.3
Text
Fail
1.6
Text
Fail
1.3
Text
Fail
1.4
Text
Fail
1.4
Text
Fail
1.2
Text
Fail
1.8
Text
Fail
1.5
Orange tint 2#EF9070
Text
AAA
7.4
Text
AA18
3.2
Text
Fail
2.3
Text
Fail
2.0
Text
Fail
2.2
Text
Fail
2.1
Text
Fail
1.9
Text
Fail
2.4
Text
Fail
1.9
Text
AA
6.1
Text
AA
4.7
Text
Fail
2.1
Text
Fail
1.3
Text
Fail
1.9
Text
Fail
1.9
Text
Fail
1.4
Text
Fail
2.0
Text
Fail
1.5
Text
Fail
1.7
Text
Fail
2.2
Text
Fail
1.1
Text
Fail
2.0
Text
Fail
1.4
Text
Fail
1.7
Text
Fail
2.5
Text
Fail
1.1
Red#FF0000
Text
AA18
4.4
Text
Fail
1.9
Text
Fail
1.4
Text
AA18
3.5
Text
AA18
3.7
Text
AA18
3.6
Text
AA18
3.3
Text
AA18
4.0
Text
Fail
1.1
Text
AA18
3.6
Text
Fail
2.8
Text
Fail
1.3
Text
Fail
1.3
Text
AA18
3.2
Text
Fail
1.1
Text
Fail
2.3
Text
Fail
1.2
Text
Fail
1.2
Text
Fail
2.8
Text
Fail
1.3
Text
Fail
1.6
Text
Fail
1.2
Text
Fail
1.2
Text
Fail
1.7
Text
Fail
1.5
Text
Fail
1.9
Red (secondary)#CC0000
Text
Fail
3.0
Text
Fail
1.3
Text
Fail
1.1
Text
AA
5.1
Text
AA
5.5
Text
AA
5.3
Text
AA
4.8
Text
AA
5.9
Text
Fail
1.3
Text
Fail
2.5
Text
Fail
1.9
Text
Fail
1.2
Text
Fail
1.9
Text
AA
4.8
Text
Fail
1.3
Text
AA18
3.4
Text
Fail
1.3
Text
Fail
1.7
Text
AA18
4.2
Text
Fail
1.1
Text
Fail
2.3
Text
Fail
1.3
Text
Fail
1.8
Text
Fail
2.5
Text
Fail
1.5
Text
Fail
2.7
Green (secondary)#83C32E
Text
AAA
8.1
Text
AA18
3.5
Text
Fail
2.6
Text
Fail
1.9
Text
Fail
2.0
Text
Fail
1.9
Text
Fail
1.7
Text
Fail
2.1
Text
Fail
2.1
Text
AA
6.7
Text
AA
5.1
Text
Fail
2.4
Text
Fail
1.5
Text
Fail
1.7
Text
Fail
2.1
Text
Fail
1.2
Text
Fail
2.2
Text
Fail
1.6
Text
Fail
1.5
Text
Fail
2.4
Text
Fail
1.2
Text
Fail
2.2
Text
Fail
1.5
Text
Fail
1.1
Text
Fail
1.9
Text
Fail
2.7
AAA Pass, AAA (7+)
AA Pass, AA (4.5+)
AA18 Pass, Large Text Only (3+)
Fail Fail
Source:global-scss/_colors.scss, line 120