Guides         Tools         Theory         Contact    

HTML Color Chart with Names, HEX Code, Luminance, WCAG & HSL


 

The following HTML color chart is designed to inspire you to find the perfect base color [or seed color] for your exact purpose. Therefore, the main elements of each line are the visual color sample and its name. We have also built two interactive columns to make your work with color more convenient: click on the HEX code to copy it to your clipboard, or click on the icon next to the color sample to import it into our HSL Color Picker. There, you can customize the color's properties to your precise needs.

 
 

Because color contrast is critical for modern design and digital accessibility, we have included relative luminance and WCAG contrast ratio values. Finally, HSL and RGB values tell you even more interesting facts about a color.

A , B , C , D , E , F , G , H , I , J , K , L , M ,
N , O , P , Q, R , S , T , U , V , W , X , Y , Z

Choose: Copy HEX codes including "#"

Find more information below the chart.

 
  Sample     HEX Name LUM % WCAG
Black		 WCAG
White		 Hue ° Sat % Lig % Red Gre Blu
 
 #5D8AA8 Air Force Blue 53 5.67 3.71 204 30 51 93 138 168
 
 #F0F8FF Alice Blue 97 19.58 1.07 208 100 97 240 248 255
 
 #E32636 Alizarin 51 4.6 4.57 355 77 52 227 38 54
 
 #E52B50 Amaranth 53 4.79 4.38 348 78 53 229 43 80
 
 #FFBF00 Amber 78 12.7 1.65 45 100 50 255 191 0
 
 #A4C639 Android Green 70 10.72 1.96 74 55 50 164 198 57
 
 #8DB600 Apple Green 62 8.82 2.38 74 100 36 141 182 0
 
 #FBCEB1 Apricot 85 14.57 1.44 24 90 84 251 206 177
 
 #7FFFD4 Aquamarine 88 17.16 1.22 160 100 75 127 255 212
 
 #4B5320 Army Green 30 2.56 8.21 69 44 23 75 83 32
 
 #3B444B Arsenic 26 2.11 9.93 206 12 26 59 68 75
 
 #E9D66B Arylide Yellow 82 14.3 1.47 51 74 67 233 214 107
 
 #B2BEB5 Ash Grey 73 10.93 1.92 135 8 72 178 190 181
 
 #87A96B Asparagus 60 7.92 2.65 93 27 54 135 169 107
 
 #FF9966 Atomic Tangerine 71 10 2.1 20 100 70 255 153 102
 
 #6D351A Auburn 28 2.17 9.66 20 61 26 109 53 26
 
 #007FFF Azure 57 5.48 3.83 210 100 50 0 127 255
 
 #89CFF0 Baby Blue 78 12.25 1.71 199 77 74 137 207 240
 
 #A1CAF1 Baby Blue Eyes 78 12.23 1.72 209 74 79 161 202 241
 
 #F4C2C2 Baby Pink 82 13.34 1.57 0 69 86 244 194 194
 
 #FFD12A Banana Yellow 82 14.41 1.46 47 100 58 255 209 42
 
 #848482 Battleship Grey 52 5.6 3.75 60 1 51 132 132 130
 
 #98777B Bazaar 51 5.26 3.99 353 14 53 152 119 123
 
 #F5F5DC Beige 95 18.98 1.11 60 56 91 245 245 220
 
 #3D2B1F Bistre 19 1.56 13.43 24 33 18 61 43 31
 
 #000000 Black 0 1 21 0 0 0 0 0 0
 
 #318CE7 Bleu De France 58 6.04 3.48 210 79 55 49 140 231
 
 #FAF0BE Blond 93 18.27 1.15 50 86 86 250 240 190
 
 #0000FF Blue 44 2.44 8.59 240 100 50 0 0 255
 
 #DE5D83 Blush 59 6 3.5 342 66 62 222 93 131
 
 #79443B Bole 34 2.7 7.77 9 34 35 121 68 59
 
 #CC0000 Boston University Red 43 3.57 5.89 0 100 40 204 0 0
 
 #B5A642 Brass 63 8.5 2.47 52 47 48 181 166 66
 
 #66FF00 Bright Green 82 15.87 1.32 96 100 50 102 255 0
 
 #BF94E4 Bright Lavender 70 8.57 2.45 272 60 74 191 148 228
 
 #C32148 Bright Maroon 45 3.63 5.78 346 71 45 195 33 72
 
 #FF007F Bright Pink 60 5.56 3.78 330 100 50 255 0 127
 
 #08E8DE Bright Turquoise 79 13.61 1.54 177 93 47 8 232 222
 
 #D19FE8 Bright Ube 74 9.84 2.14 281 61 77 209 159 232
 
 #004225 British Racing Green 20 1.81 11.63 154 100 13 0 66 37
 
 #CD7F32 Bronze 57 6.68 3.14 30 61 50 205 127 50
 
 #964B00 Brown 38 3.3 6.36 30 100 29 150 75 0
 
 #FFC1CC Bubble Gum 84 13.75 1.53 349 100 88 255 193 204
 
 #E7FEFF Bubbles 97 20.02 1.05 183 100 95 231 254 255
 
 #F0DC82 Buff 85 15.26 1.38 49 79 73 240 220 130
 
 #800020 Burgundy 28 1.94 10.83 345 100 25 128 0 32
 
 #DEB887 Burlywood 74 11.31 1.86 34 57 70 222 184 135
 
 #CC5500 Burnt Orange 49 4.87 4.31 25 100 40 204 85 0
 
 #E97451 Burnt Sienna 61 7.08 2.97 14 78 62 233 116 81
 
 #8A3324 Burnt Umber 33 2.58 8.14 9 59 34 138 51 36
 
 #BD33A4 Byzantine 52 4.17 5.03 311 58 47 189 51 164
 
 #702963 Byzantium 32 2.19 9.61 311 46 30 112 41 99
 
 #536878 Cadet 40 3.62 5.8 206 18 40 83 104 120
 
 #006B3C Cadmium Green 34 3.17 6.63 154 100 21 0 107 60
 
 #ED872D Cadmium Orange 64 8.1 2.59 28 84 55 237 135 45
 
 #E30022 Cadmium Red 49 4.29 4.9 351 100 45 227 0 34
 
 #A3C1AD Cambridge Blue 72 10.79 1.95 140 19 70 163 193 173
 
 #78866B Camouflage Green 50 5.42 3.87 91 11 47 120 134 107
 
 #FFEF00 Canary Yellow 90 17.6 1.19 56 100 50 255 239 0
 
 #FF0800 Candy Apple Red 54 5.29 3.97 2 100 50 255 8 0
 
 #C41E3A Cardinal 44 3.59 5.84 350 73 44 196 30 58
 
 #00CC99 Caribbean Green 67 10.1 2.08 165 100 40 0 204 153
 
 #960018 Carmine 32 2.31 9.09 350 100 29 150 0 24
 
 #99BADD Carolina Blue 73 10.42 2.01 211 50 73 153 186 221
 
 #ED9121 Carrot Orange 66 8.67 2.42 33 85 53 237 145 33
 
 #92A1CF Ceil 66 8.22 2.55 225 39 69 146 161 207
 
 #ACE1AF Celadon 81 14.14 1.48 123 47 78 172 225 175
 
 #007BA7 Cerulean 46 4.39 4.78 196 100 33 0 123 167
 
 #2A52BE Cerulean Blue 41 3.05 6.89 224 64 45 42 82 190
 
 #A0785A Chamoisee 51 5.33 3.94 26 28 49 160 120 90
 
 #F7E7CE Champagne 91 17.28 1.22 37 72 89 247 231 206
 
 #36454F Charcoal 26 2.12 9.9 204 19 26 54 69 79
 
 #DFFF00 Chartreuse 90 18.44 1.14 68 100 50 223 255 0
 
 #DE3163 Cherry 53 4.73 4.44 343 72 53 222 49 99
 
 #FFB7C5 Cherry Blossom Pink 82 12.83 1.64 348 100 86 255 183 197
 
 #CD5C5C Chestnut 53 5.28 3.98 0 53 58 205 92 92
 
 #7B3F00 Chocolate 31 2.55 8.22 31 100 24 123 63 0
 
 #FFA700 Chrome Yellow 73 10.78 1.95 39 100 50 255 167 0
 
 #98817B Cinereous 53 5.76 3.65 12 12 54 152 129 123
 
 #E34234 Cinnabar 52 5.1 4.12 5 76 55 227 66 52
 
 #D2691E Cinnamon 54 5.78 3.63 25 75 47 210 105 30
 
 #E4D00A Citrine 79 13.33 1.58 55 92 47 228 208 10
 
 #FBCCE7 Classic Rose 88 14.89 1.41 326 85 89 251 204 231
 
 #00FF6F Clover 81 15.53 1.35 146 100 50 0 255 111
 
 #0047AB Cobalt 36 2.49 8.44 215 100 34 0 71 171
 
 #9BDDFF Columbia Blue 83 14.18 1.48 200 100 80 155 221 255
 
 #002E63 Cool Black 21 1.57 13.37 212 100 19 0 46 99
 
 #8C92AC Cool Grey 59 6.82 3.08 229 16 61 140 146 172
 
 #B87333 Copper 52 5.54 3.79 29 57 46 184 115 51
 
 #FF3800 Coquelicot 56 5.82 3.61 13 100 50 255 56 0
 
 #FF7F50 Coral 66 8.4 2.5 16 100 66 255 127 80
 
 #893F45 Cordovan 36 2.86 7.34 355 37 39 137 63 69
 
 #FBEC5D Corn 89 17.26 1.22 54 95 67 251 236 93
 
 #B31B1B Cornell Red 39 3.09 6.8 0 74 40 179 27 27
 
 #6495ED Cornflower Blue 62 7.06 2.97 219 79 66 100 149 237
 
 #FFF8DC Cornsilk 97 19.71 1.07 48 100 93 255 248 220
 
 #FFFDD0 Cream 97 20.21 1.04 57 100 91 255 253 208
 
 #DC143C Crimson 49 4.21 4.99 348 83 47 220 20 60
 
 #00FFFF Cyan 87 16.75 1.25 180 100 50 0 255 255
 
 #FFFF31 Daffodil 94 19.6 1.07 60 100 60 255 255 49
 
 #F0E130 Dandelion 85 15.52 1.35 55 86 56 240 225 48
 
 #00008B Dark Blue 24 1.37 15.3 240 100 27 0 0 139
 
 #654321 Dark Brown 29 2.38 8.83 30 51 26 101 67 33
 
 #5D3954 Dark Byzantium 30 2.18 9.64 315 24 29 93 57 84
 
 #A40000 Dark Candy Apple Red 34 2.58 8.14 0 100 32 164 0 0
 
 #08457E Dark Cerulean 29 2.16 9.71 209 88 26 8 69 126
 
 #986960 Dark Chestnut 47 4.52 4.64 10 23 49 152 105 96
 
 #CD5B45 Dark Coral 52 5.18 4.06 10 58 54 205 91 69
 
 #008B8B Dark Cyan 47 5.07 4.15 180 100 27 0 139 139
 
 #B8860B Dark Goldenrod 55 6.45 3.25 43 89 38 184 134 11
 
 #013220 Dark Green 15 1.48 14.2 158 96 10 1 50 32
 
 #1A2421 Dark Jungle Green 13 1.32 15.93 162 16 12 26 36 33
 
 #BDB76B Dark Khaki 69 10.15 2.07 56 38 58 189 183 107
 
 #483C32 Dark Lava 24 1.97 10.67 27 18 24 72 60 50
 
 #734F96 Dark Lavender 42 3.29 6.39 270 31 45 115 79 150
 
 #8B008B Dark Magenta 39 2.47 8.5 300 100 27 139 0 139
 
 #003366 Dark Midnight Blue 23 1.67 12.61 210 100 20 0 51 102
 
 #556B2F Dark Olive Green 37 3.53 5.95 82 39 30 85 107 47
 
 #FF8C00 Dark Orange 67 9 2.33 33 100 50 255 140 0
 
 #779ECB Dark Pastel Blue 62 7.54 2.79 212 45 63 119 158 203
 
 #03C03C Dark Pastel Green 60 8.61 2.44 138 97 38 3 192 60
 
 #966FD6 Dark Pastel Purple 58 5.54 3.79 263 56 64 150 111 214
 
 #C23B22 Dark Pastel Red 45 3.94 5.33 9 70 45 194 59 34
 
 #E75480 Dark Pink 59 5.98 3.51 342 75 62 231 84 128
 
 #003399 Dark Powder Blue 30 1.93 10.86 220 100 30 0 51 153
 
 #872657 Dark Raspberry 35 2.45 8.59 330 56 34 135 38 87
 
 #E9967A Dark Salmon 68 9.11 2.31 15 72 70 233 150 122
 
 #560319 Dark Scarlet 19 1.42 14.76 344 93 17 86 3 25
 
 #3C1414 Dark Sienna 14 1.3 16.13 0 50 16 60 20 20
 
 #2F4F4F Dark Slate Gray 28 2.35 8.93 180 25 25 47 79 79
 
 #177245 Dark Spring Green 37 3.53 5.95 150 66 27 23 114 69
 
 #918151 Dark Tan 50 5.46 3.84 45 28 44 145 129 81
 
 #FFA812 Dark Tangerine 73 10.86 1.93 38 100 54 255 168 18
 
 #CC4E5C Dark Terra Cotta 51 4.81 4.36 353 55 55 204 78 92
 
 #9400D3 Dark Violet 48 3.2 6.56 282 100 41 148 0 211
 
 #555555 Davy'S Grey 33 2.82 7.46 0 0 33 85 85 85
 
 #1560BD Denim 43 3.44 6.1 213 80 41 21 96 189
 
 #C19A6B Desert 63 8.1 2.59 33 41 59 193 154 107
 
 #EDC9AF Desert Sand 82 13.57 1.55 25 63 81 237 201 175
 
 #696969 Dim Gray 41 3.83 5.49 0 0 41 105 105 105
 
 #85BB65 Dollar Bill 65 9.29 2.26 98 39 56 133 187 101
 
 #00009C Duke Blue 27 1.48 14.19 240 100 31 0 0 156
 
 #E1A95F Earth Yellow 70 10.04 2.09 34 68 63 225 169 95
 
 #614051 Eggplant 31 2.36 8.9 329 21 32 97 64 81
 
 #50C878 Emerald 66 9.87 2.13 140 52 55 80 200 120
 
 #E5AA70 Fawn 71 10.32 2.04 30 69 67 229 170 112
 
 #FF1C00 Ferrari Red 54 5.42 3.88 7 100 50 255 28 0
 
 #CE1620 Fire Engine Red 45 3.76 5.59 357 81 45 206 22 32
 
 #B22222 Firebrick 39 3.14 6.68 0 68 42 178 34 34
 
 #E25822 Flame 54 5.65 3.72 17 77 51 226 88 34
 
 #FC8EAC Flamingo Pink 73 9.6 2.19 344 95 77 252 142 172
 
 #F7E98E Flavescent 89 17 1.24 52 87 76 247 233 142
 
 #014421 Forest Green 21 1.85 11.35 149 97 14 1 68 33
 
 #E49B0F Gamboge 66 8.99 2.33 39 88 48 228 155 15
 
 #F8F8FF Ghost White 98 19.86 1.06 240 100 99 248 248 255
 
 #6082B6 Glaucous 53 5.37 3.91 216 37 55 96 130 182
 
 #996515 Golden Brown 44 4.23 4.97 36 76 34 153 101 21
 
 #FFDF00 Golden Yellow 85 15.81 1.33 52 100 50 255 223 0
 
 #DAA520 Goldenrod 67 9.38 2.24 43 74 49 218 165 32
 
 #808080 Gray 50 5.32 3.95 0 0 50 128 128 128
 
 #008000 Green 39 4.09 5.14 120 100 25 0 128 0
 
 #71A6D2 Iceberg 64 8.09 2.6 207 52 63 113 166 210
 
 #FCF75E Icterine 92 18.61 1.13 58 96 68 252 247 94
 
 #B2EC5D Inchworm 82 15.05 1.4 84 79 65 178 236 93
 
 #138808 India Green 42 4.55 4.61 115 89 28 19 136 8
 
 #FF5C5C Indian Red 62 6.94 3.03 0 100 68 255 92 92
 
 #E3A857 Indian Yellow 70 10 2.1 35 71 62 227 168 87
 
 #002FA7 International Klein Blue 32 1.96 10.69 223 100 33 0 47 167
 
 #FFFFF0 Ivory 99 20.81 1.01 60 100 97 255 255 240
 
 #00A86B Jade 54 6.81 3.08 158 100 33 0 168 107
 
 #D73B3E Jasper 50 4.58 4.58 359 66 54 215 59 62
 
 #C3B091 Khaki 70 9.94 2.11 37 29 67 195 176 145
 
 #B57EDC Lavender 64 6.98 3.01 275 57 68 181 126 220
 
 #CCCCFF Lavender Blue 84 13.65 1.54 240 100 90 204 204 255
 
 #FFF0F5 Lavender Blush 96 19.03 1.1 340 100 97 255 240 245
 
 #C4C3D0 Lavender Gray 78 12.06 1.74 245 12 79 196 195 208
 
 #7CFC00 Lawn Green 82 15.78 1.33 90 100 49 124 252 0
 
 #FFF700 Lemon 92 18.56 1.13 58 100 50 255 247 0
 
 #BFFF00 Lime 87 17.52 1.2 75 100 50 191 255 0
 
 #FF00FF Magenta 70 6.7 3.14 300 100 50 255 0 255
 
 #C04000 Mahogany 44 3.97 5.28 20 100 38 192 64 0
 
 #800000 Maroon 26 1.92 10.95 0 100 25 128 0 0
 
 #191970 Midnight Blue 22 1.41 14.85 240 64 27 25 25 112
 
 #3EB489 Mint 60 8.09 2.59 158 49 47 62 180 137
 
 #FFDB58 Mustard 85 15.53 1.35 47 100 67 255 219 88
 
 #000080 Navy Blue 22 1.31 16.01 240 100 25 0 0 128
 
 #CC7722 Ochre 55 6.23 3.37 30 71 47 204 119 34
 
 #002147 Old Glory Blue 15 1.31 16.05 212 100 14 0 33 71
 
 #BB133E Old Glory Red 42 3.28 6.41 345 82 40 187 19 62
 
 #808000 Olive 47 5.01 4.2 60 100 25 128 128 0
 
 #FF7F00 Orange 65 8.29 2.53 30 100 50 255 127 0
 
 #002147 Oxford Blue 15 1.31 16.05 212 100 14 0 33 71
 
 #AEC6CF Pastel Blue 76 11.78 1.78 196 26 75 174 198 207
 
 #836953 Pastel Brown 43 4.11 5.11 28 22 42 131 105 83
 
 #CFCFC4 Pastel Gray 81 13.38 1.57 60 10 79 207 207 196
 
 #77DD77 Pastel Green 74 12.39 1.69 120 60 67 119 221 119
 
 #F49AC2 Pastel Magenta 75 10.25 2.05 333 80 78 244 154 194
 
 #FFB347 Pastel Orange 76 11.79 1.78 35 100 64 255 179 71
 
 #FFD1DC Pastel Pink 88 15.41 1.36 346 100 91 255 209 220
 
 #B39EB5 Pastel Purple 66 8.47 2.48 295 13 66 179 158 181
 
 #FF6961 Pastel Red 64 7.45 2.82 3 100 69 255 105 97
 
 #CB99C9 Pastel Violet 70 8.94 2.35 302 32 70 203 153 201
 
 #FDFD96 Pastel Yellow 95 19.67 1.07 60 96 79 253 253 150
 
 #FFE5B4 Peach 91 17.12 1.23 39 100 85 255 229 180
 
 #D1E231 Pear 81 14.63 1.44 66 75 54 209 226 49
 
 #F0EAD6 Pearl 91 17.45 1.2 46 46 89 240 234 214
 
 #E6E200 Peridot 83 15.24 1.38 59 100 45 230 226 0
 
 #01796F Pine Green 40 3.97 5.3 175 98 24 1 121 111
 
 #FFC0CB Pink 84 13.65 1.54 350 100 88 255 192 203
 
 #93C572 Pistachio 69 10.47 2.01 96 42 61 147 197 114
 
 #E5E4E2 Platinum 89 16.53 1.27 40 5 89 229 228 226
 
 #8E4585 Plum 43 3.34 6.29 307 35 41 142 69 133
 
 #FF5A36 Portland Orange 60 6.77 3.1 11 100 61 255 90 54
 
 #701C1C Prune 25 1.87 11.22 0 60 27 112 28 28
 
 #FF7518 Pumpkin 63 7.81 2.69 24 100 55 255 117 24
 
 #69359C Purple Heart 38 2.59 8.11 270 49 41 105 53 156
 
 #E30B5D Raspberry 52 4.47 4.7 337 91 47 227 11 93
 
 #826644 Raw Umber 42 3.93 5.34 33 31 39 130 102 68
 
 #FF0000 Red 54 5.25 4 0 100 50 255 0 0
 
 #414833 Rifle Green 27 2.2 9.55 80 17 24 65 72 51
 
 #65000B Rosewood 21 1.56 13.48 353 100 20 101 0 11
 
 #002366 Royal Blue 20 1.43 14.66 219 100 20 0 35 102
 
 #E0115F Ruby 51 4.41 4.76 337 86 47 224 17 95
 
 #B7410E Rust 43 3.78 5.56 18 86 39 183 65 14
 
 #FF6700 Safety Orange 61 7.19 2.92 24 100 50 255 103 0
 
 #F4C430 Saffron 78 12.79 1.64 45 90 57 244 196 48
 
 #FF8C69 Salmon 69 9.21 2.28 14 100 71 255 140 105
 
 #C2B280 Sand 69 9.97 2.11 45 35 63 194 178 128
 
 #967117 Sand Dune 46 4.67 4.5 43 73 34 150 113 23
 
 #ECD540 Sandstorm 81 14.16 1.48 52 82 59 236 213 64
 
 #082567 Sapphire 21 1.47 14.28 222 86 22 8 37 103
 
 #321414 Seal Brown 12 1.25 16.86 0 43 14 50 20 20
 
 #FFF5EE Seashell 97 19.55 1.07 25 100 97 255 245 238
 
 #704214 Sepia 30 2.48 8.47 30 70 26 112 66 20
 
 #8A795D Shadow 48 4.97 4.22 37 19 45 138 121 93
 
 #C0C0C0 Silver 75 11.54 1.82 0 0 75 192 192 192
 
 #CB410B Sinopia 46 4.3 4.88 17 90 42 203 65 11
 
 #87CEEB Sky Blue 77 12.06 1.74 197 71 73 135 206 235
 
 #CF71AF Sky Magenta 62 6.63 3.17 320 49 63 207 113 175
 
 #FFFAFA Snow 99 20.31 1.03 0 100 99 255 250 250
 
 #A7FC00 Spring Bud 85 16.57 1.27 80 100 49 167 252 0
 
 #4682B4 Steel Blue 51 5.11 4.11 207 44 49 70 130 180
 
 #E4D96F Straw 82 14.45 1.45 54 68 66 228 217 111
 
 #FAD6A5 Sunset 86 15.23 1.38 35 89 81 250 214 165
 
 #F28500 Tangerine 64 8.13 2.58 33 100 47 242 133 0
 
 #008080 Teal 43 4.4 4.77 180 100 25 0 128 128
 
 #E2725B Terra Cotta 60 6.79 3.09 10 70 62 226 114 91
 
 #EEE600 Titanium Yellow 85 15.95 1.32 58 100 47 238 230 0
 
 #00755E Tropical Rain Forest 38 3.71 5.67 168 100 23 0 117 94
 
 #30D5C8 Turquoise 73 11.48 1.83 175 66 51 48 213 200
 
 #120A8F Ultramarine 25 1.47 14.33 244 87 30 18 10 143
 
 #5B92E5 United Nations Blue 60 6.69 3.14 216 73 63 91 146 229
 
 #F3E5AB Vanilla 89 16.61 1.26 48 75 81 243 229 171
 
 #8F00FF Violet 53 3.61 5.81 274 100 50 143 0 255
 
 #F5DEB3 Wheat 88 15.98 1.31 39 77 83 245 222 179
 
 #FFFFFF White 100 21 1 0 0 100 255 255 255
 
 #F5F5F5 White Smoke 96 19.26 1.09 0 0 96 245 245 245
 
 #738678 Xanadu 50 5.41 3.88 136 8 49 115 134 120
 
 #0F4D92 Yale Blue 34 2.5 8.41 212 81 32 15 77 146
 
 #FFFF00 Yellow 94 19.56 1.07 60 100 50 255 255 0


↑ scroll to top  


You can also browse these colors grouped by hue ranges and ordered by luminance:


What is the relative luminance value [LUM %]?

It is the perceived brightness of a color, relative to the absolute brightness of an environment. For example, one display has an absolute brightness of 300 nits, and a second display has 400 nits. A color with relative luminance of 50% is in absolute terms brighter on the 400 nits display.

What is [relative] luminance contrast?

It is the calculated difference of two luminance values. Subtract the smaller value from the larger value. If a color has 40% relative luminance, it has 40% contrast relative to black = 0%, and 60% contrast relative to white = 100%. If another color has 60% relative luminance, the contrast between the first color and the second color is 20%.

Can luminance contrast be converted to a WCAG contrast ratio?

No, luminance contrast only allows you to make an educated guess about a WCAG contrast ratio. A luminance contrast greater than 50% often results in a WCAG contrast ratio of 4.5:1 or greater.

What else is important about luminance contrast?

The luminance contrast effect is dependent on the size of the area a color is applied to. The contrast gets more obvious the larger the filled shape. Small text or thin lines have a significant lower effect than a shape that fills half of the screen.

What else can the luminance value be used for?

It allows you to calculate the RGB grayscale value for your color. RGB grayscale = round[255 * [luminance / 100]].

Other Interesting Pages


Guides

How to Make a Business Card

Tools

Website URL QR Code Generator
VCard QR Code Generator
HSL Color Picker
HSL Color Schemer
Colors by Name
Color Converter
Multi Model Color Blender

Theory

Color Theory Introduction
Colors of the Rainbow
Color Vision
Color Properties / Terminology
Color Luminance
The Color Wheel





↑ scroll to top  

Copyright © 2026 WorkWithColor.com and licensors - All rights reserved!
  Make Excellent Marketing Materials     Guides     Tools     Theory  
  Privacy Policy     About     Contact