Colors tests
Shades test#
Click on color box to copy hex value to clipboard.
Turn on grayscale display to focus on the lightness of shades without being distracted by their saturation.
Shade
accentgraybluegreenorangered0
1.04
14.05
1.05
13.98
5
1.07
13.64
1.09
13.36
1.05
13.97
1.04
14.05
1.05
13.93
1.05
13.86
10
1.15
12.74
1.20
12.15
1.09
13.36
1.08
13.49
1.11
13.20
1.11
13.12
20
1.44
10.13
1.62
9.00
1.15
12.74
1.13
12.93
1.16
12.58
1.28
11.44
30
1.73
8.45
2.28
6.41
1.20
12.16
1.18
12.43
1.31
11.17
1.56
9.38
40
2.38
6.14
3.30
4.42
1.33
11.01
1.28
11.38
1.37
10.66
1.77
8.26
60
3.13
4.67
5.06
2.89
1.94
7.54
1.87
7.82
1.48
9.85
2.46
5.95
70
4.23
3.46
8.03
1.82
2.87
5.08
2.62
5.58
1.72
8.48
3.53
4.14
80
5.70
2.56
11.28
1.30
4.51
3.24
4.58
3.19
2.33
6.26
5.05
2.89
90
7.89
1.85
12.97
1.13
6.08
2.41
6.01
2.43
3.85
3.80
7.23
2.02
100
9.97
1.47
14.61
1.00
8.22
1.78
9.04
1.62
6.59
2.22
8.60
1.70
Data vis palette test#
Add new color
Contrast tests#
Palettes are shown with white, dark and each of particular palette's color text on top. Dots are representing contrast ratio between background color and text color.
Combination of a background color and a text color is checked against color contrast requirements​. Green dot means at least WCAG Level AA (4.5:1) and red dot means too low (inaccessible) contrast ratio.
Accent#
accent0accent5accent10accent20accent30accent40accent60accent70accent80accent90accent100
white
1.04
1.07
1.15
1.44
1.73
2.38
3.13
4.23
5.70
7.89
9.97
accent0
1.00
1.03
1.10
1.39
1.66
2.29
3.01
4.06
5.48
7.59
9.59
accent5
1.03
1.00
1.07
1.35
1.61
2.22
2.92
3.94
5.32
7.37
9.31
accent10
1.10
1.07
1.00
1.26
1.51
2.07
2.73
3.68
4.97
6.88
8.69
accent20
1.39
1.35
1.26
1.00
1.20
1.65
2.17
2.93
3.95
5.47
6.91
accent30
1.66
1.61
1.51
1.20
1.00
1.38
1.81
2.44
3.30
4.57
5.77
accent40
2.29
2.22
2.07
1.65
1.38
1.00
1.32
1.78
2.40
3.32
4.19
accent60
3.01
2.92
2.73
2.17
1.81
1.32
1.00
1.35
1.82
2.52
3.18
accent70
4.06
3.94
3.68
2.93
2.44
1.78
1.35
1.00
1.35
1.87
2.36
accent80
5.48
5.32
4.97
3.95
3.30
2.40
1.82
1.35
1.00
1.38
1.75
accent90
7.59
7.37
6.88
5.47
4.57
3.32
2.52
1.87
1.38
1.00
1.26
accent100
9.59
9.31
8.69
6.91
5.77
4.19
3.18
2.36
1.75
1.26
1.00
gray100
14.05
13.64
12.74
10.13
8.45
6.14
4.67
3.46
2.56
1.85
1.47
Gray#
gray0gray5gray10gray20gray30gray40gray60gray70gray80gray90gray100
white
1.05
1.09
1.20
1.62
2.28
3.30
5.06
8.03
11.28
12.97
14.61
gray0
1.00
1.05
1.15
1.55
2.18
3.16
4.84
7.69
10.79
12.41
13.98
gray5
1.05
1.00
1.10
1.48
2.08
3.02
4.62
7.35
10.31
11.86
13.36
gray10
1.15
1.10
1.00
1.35
1.89
2.75
4.21
6.68
9.37
10.78
12.15
gray20
1.55
1.48
1.35
1.00
1.40
2.04
3.12
4.95
6.95
7.99
9.00
gray30
2.18
2.08
1.89
1.40
1.00
1.45
2.22
3.53
4.95
5.69
6.41
gray40
3.16
3.02
2.75
2.04
1.45
1.00
1.53
2.43
3.41
3.92
4.42
gray60
4.84
4.62
4.21
3.12
2.22
1.53
1.00
1.59
2.23
2.56
2.89
gray70
7.69
7.35
6.68
4.95
3.53
2.43
1.59
1.00
1.40
1.61
1.82
gray80
10.79
10.31
9.37
6.95
4.95
3.41
2.23
1.40
1.00
1.15
1.30
gray90
12.41
11.86
10.78
7.99
5.69
3.92
2.56
1.61
1.15
1.00
1.13
gray100
13.98
13.36
12.15
9.00
6.41
4.42
2.89
1.82
1.30
1.13
1.00
Blue#
blue5blue10blue20blue30blue40blue60blue70blue80blue90blue100
white
1.05
1.09
1.15
1.20
1.33
1.94
2.87
4.51
6.08
8.22
blue5
1.00
1.05
1.10
1.15
1.27
1.85
2.75
4.31
5.81
7.86
blue10
1.05
1.00
1.05
1.10
1.21
1.77
2.63
4.13
5.55
7.51
blue20
1.10
1.05
1.00
1.05
1.16
1.69
2.51
3.93
5.30
7.17
blue30
1.15
1.10
1.05
1.00
1.11
1.61
2.39
3.76
5.06
6.84
blue40
1.27
1.21
1.16
1.11
1.00
1.46
2.16
3.40
4.58
6.19
blue60
1.85
1.77
1.69
1.61
1.46
1.00
1.48
2.33
3.13
4.24
blue70
2.75
2.63
2.51
2.39
2.16
1.48
1.00
1.57
2.11
2.86
blue80
4.31
4.13
3.93
3.76
3.40
2.33
1.57
1.00
1.35
1.82
blue90
5.81
5.55
5.30
5.06
4.58
3.13
2.11
1.35
1.00
1.35
blue100
7.86
7.51
7.17
6.84
6.19
4.24
2.86
1.82
1.35
1.00
gray100
13.97
13.36
12.74
12.16
11.01
7.54
5.08
3.24
2.41
1.78
Green#
green5green10green20green30green40green60green70green80green90green100
white
1.04
1.08
1.13
1.18
1.28
1.87
2.62
4.58
6.01
9.04
green5
1.00
1.04
1.09
1.13
1.23
1.80
2.52
4.40
5.78
8.69
green10
1.04
1.00
1.04
1.08
1.18
1.73
2.42
4.23
5.55
8.35
green20
1.09
1.04
1.00
1.04
1.14
1.65
2.32
4.06
5.32
8.01
green30
1.13
1.08
1.04
1.00
1.09
1.59
2.23
3.90
5.11
7.70
green40
1.23
1.18
1.14
1.09
1.00
1.46
2.04
3.57
4.68
7.04
green60
1.80
1.73
1.65
1.59
1.46
1.00
1.40
2.45
3.22
4.84
green70
2.52
2.42
2.32
2.23
2.04
1.40
1.00
1.75
2.30
3.46
green80
4.40
4.23
4.06
3.90
3.57
2.45
1.75
1.00
1.31
1.97
green90
5.78
5.55
5.32
5.11
4.68
3.22
2.30
1.31
1.00
1.50
green100
8.69
8.35
8.01
7.70
7.04
4.84
3.46
1.97
1.50
1.00
gray100
14.05
13.49
12.93
12.43
11.38
7.82
5.58
3.19
2.43
1.62
Orange#
orange5orange10orange20orange30orange40orange60orange70orange80orange90orange100
white
1.05
1.11
1.16
1.31
1.37
1.48
1.72
2.33
3.85
6.59
orange5
1.00
1.06
1.11
1.25
1.31
1.41
1.64
2.22
3.67
6.29
orange10
1.06
1.00
1.05
1.18
1.24
1.34
1.56
2.11
3.47
5.95
orange20
1.11
1.05
1.00
1.13
1.18
1.28
1.48
2.01
3.31
5.68
orange30
1.25
1.18
1.13
1.00
1.05
1.13
1.32
1.78
2.94
5.04
orange40
1.31
1.24
1.18
1.05
1.00
1.08
1.26
1.70
2.81
4.81
orange60
1.41
1.34
1.28
1.13
1.08
1.00
1.16
1.57
2.59
4.44
orange70
1.64
1.56
1.48
1.32
1.26
1.16
1.00
1.35
2.23
3.83
orange80
2.22
2.11
2.01
1.78
1.70
1.57
1.35
1.00
1.65
2.83
orange90
3.67
3.47
3.31
2.94
2.81
2.59
2.23
1.65
1.00
1.71
orange100
6.29
5.95
5.68
5.04
4.81
4.44
3.83
2.83
1.71
1.00
gray100
13.93
13.20
12.58
11.17
10.66
9.85
8.48
6.26
3.80
2.22
Red#
red5red10red20red30red40red60red70red80red90red100
white
1.05
1.11
1.28
1.56
1.77
2.46
3.53
5.05
7.23
8.60
red5
1.00
1.06
1.21
1.48
1.68
2.33
3.35
4.79
6.86
8.15
red10
1.06
1.00
1.15
1.40
1.59
2.21
3.17
4.54
6.49
7.72
red20
1.21
1.15
1.00
1.22
1.39
1.92
2.77
3.95
5.66
6.73
red30
1.48
1.40
1.22
1.00
1.14
1.58
2.27
3.24
4.64
5.52
red40
1.68
1.59
1.39
1.14
1.00
1.39
2.00
2.85
4.08
4.86
red60
2.33
2.21
1.92
1.58
1.39
1.00
1.44
2.06
2.94
3.50
red70
3.35
3.17
2.77
2.27
2.00
1.44
1.00
1.43
2.05
2.43
red80
4.79
4.54
3.95
3.24
2.85
2.06
1.43
1.00
1.43
1.70
red90
6.86
6.49
5.66
4.64
4.08
2.94
2.05
1.43
1.00
1.19
red100
8.15
7.72
6.73
5.52
4.86
3.50
2.43
1.70
1.19
1.00
gray100
13.86
13.12
11.44
9.38
8.26
5.95
4.14
2.89
2.02
1.70