devttl/reference
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
reference/docs/colors-named.md
fw_qaq 5701da6e5b
chore: format markdown code. (#42) 
* format: fix markdown

* update: fix markdown

* update: fix cron problems

* update: delete .markdownlintignore

* update

* chore: add tab -> 4 space

* chore: fix tab -> 2 in the .editorconfig
2022-11-11 01:51:54 +08:00

1603 lines
72 KiB
Markdown
Raw Blame History

Colors Named 备忘清单
===
CSS 定义了一大组[命名颜色](https://www.w3.org/TR/css-color-4/#named-colors)，以便可以更轻松地编写和阅读[常用颜色](https://www.w3.org/TR/css-color-4/#named-colors)，这里列出了它的颜色名称/Hex rgb/十进制 rgb 数据
Named Colors
---
<!-- markdownlint-disable MD038 -->
### 颜色列表
<!--rehype:wrap-class=col-span-3&style=display:none;&wrap-style=padding-top: 0;-->
颜色 | 颜色名称 | Hex RGB | 十进制 RGB
:- | :- | :- | :-
` `<!--rehype:style=background:aliceblue;padding:0.2rem 2em;border: 1px solid #333;--> | aliceblue | #f0f8ff | 240 248 255
` `<!--rehype:style=background:antiquewhite;padding:0.2rem 2em;border: 1px solid #333;--> | antiquewhite | #faebd7 | 250 235 215
` `<!--rehype:style=background:aqua;padding:0.2rem 2em;border: 1px solid #333;--> | aqua | #00ffff | 0 255 255
` `<!--rehype:style=background:aquamarine;padding:0.2rem 2em;border: 1px solid #333;--> | aquamarine | #7fffd4 | 127 255 212
` `<!--rehype:style=background:azure;padding:0.2rem 2em;border: 1px solid #333;--> | azure | #f0ffff | 240 255 255
` `<!--rehype:style=background:beige;padding:0.2rem 2em;border: 1px solid #333;--> | beige | #f5f5dc | 245 245 220
` `<!--rehype:style=background:bisque;padding:0.2rem 2em;border: 1px solid #333;--> | bisque | #ffe4c4 | 255 228 196
` `<!--rehype:style=background:black;padding:0.2rem 2em;border: 1px solid #333;--> | black | #000000 | 0 0 0
` `<!--rehype:style=background:blanchedalmond;padding:0.2rem 2em;border: 1px solid #333;--> | blanchedalmond | #ffebcd | 255 235 205
` `<!--rehype:style=background:blue;padding:0.2rem 2em;border: 1px solid #333;--> | blue | #0000ff | 0 0 255
` `<!--rehype:style=background:blueviolet;padding:0.2rem 2em;border: 1px solid #333;--> | blueviolet | #8a2be2 | 138 43 226
` `<!--rehype:style=background:brown;padding:0.2rem 2em;border: 1px solid #333;--> | brown | #a52a2a | 165 42 42
` `<!--rehype:style=background:burlywood;padding:0.2rem 2em;border: 1px solid #333;--> | burlywood | #deb887 | 222 184 135
` `<!--rehype:style=background:cadetblue;padding:0.2rem 2em;border: 1px solid #333;--> | cadetblue | #5f9ea0 | 95 158 160
` `<!--rehype:style=background:chartreuse;padding:0.2rem 2em;border: 1px solid #333;--> | chartreuse | #7fff00 | 127 255 0
` `<!--rehype:style=background:chocolate;padding:0.2rem 2em;border: 1px solid #333;--> | chocolate | #d2691e | 210 105 30
` `<!--rehype:style=background:coral;padding:0.2rem 2em;border: 1px solid #333;--> | coral | #ff7f50 | 255 127 80
` `<!--rehype:style=background:cornflowerblue;padding:0.2rem 2em;border: 1px solid #333;--> | cornflowerblue | #6495ed | 100 149 237
` `<!--rehype:style=background:cornsilk;padding:0.2rem 2em;border: 1px solid #333;--> | cornsilk | #fff8dc | 255 248 220
` `<!--rehype:style=background:crimson;padding:0.2rem 2em;border: 1px solid #333;--> | crimson | #dc143c | 220 20 60
` `<!--rehype:style=background:cyan;padding:0.2rem 2em;border: 1px solid #333;--> | cyan | #00ffff | 0 255 255
` `<!--rehype:style=background:darkblue;padding:0.2rem 2em;border: 1px solid #333;--> | darkblue | #00008b | 0 0 139
` `<!--rehype:style=background:darkcyan;padding:0.2rem 2em;border: 1px solid #333;--> | darkcyan | #008b8b | 0 139 139
` `<!--rehype:style=background:darkgoldenrod;padding:0.2rem 2em;border: 1px solid #333;--> | darkgoldenrod | #b8860b | 184 134 11
` `<!--rehype:style=background:darkgray;padding:0.2rem 2em;border: 1px solid #333;--> | darkgray | #a9a9a9 | 169 169 169
` `<!--rehype:style=background:darkgreen;padding:0.2rem 2em;border: 1px solid #333;--> | darkgreen | #006400 | 0 100 0
` `<!--rehype:style=background:darkgrey;padding:0.2rem 2em;border: 1px solid #333;--> | darkgrey | #a9a9a9 | 169 169 169
` `<!--rehype:style=background:darkkhaki;padding:0.2rem 2em;border: 1px solid #333;--> | darkkhaki | #bdb76b | 189 183 107
` `<!--rehype:style=background:darkmagenta;padding:0.2rem 2em;border: 1px solid #333;--> | darkmagenta | #8b008b | 139 0 139
` `<!--rehype:style=background:darkolivegreen;padding:0.2rem 2em;border: 1px solid #333;--> | darkolivegreen | #556b2f | 85 107 47
` `<!--rehype:style=background:darkorange;padding:0.2rem 2em;border: 1px solid #333;--> | darkorange | #ff8c00 | 255 140 0
` `<!--rehype:style=background:darkorchid;padding:0.2rem 2em;border: 1px solid #333;--> | darkorchid | #9932cc | 153 50 204
` `<!--rehype:style=background:darkred;padding:0.2rem 2em;border: 1px solid #333;--> | darkred | #8b0000 | 139 0 0
` `<!--rehype:style=background:darksalmon;padding:0.2rem 2em;border: 1px solid #333;--> | darksalmon | #e9967a | 233 150 122
` `<!--rehype:style=background:darkseagreen;padding:0.2rem 2em;border: 1px solid #333;--> | darkseagreen | #8fbc8f | 143 188 143
` `<!--rehype:style=background:darkslateblue;padding:0.2rem 2em;border: 1px solid #333;--> | darkslateblue | #483d8b | 72 61 139
` `<!--rehype:style=background:darkslategray;padding:0.2rem 2em;border: 1px solid #333;--> | darkslategray | #2f4f4f | 47 79 79
` `<!--rehype:style=background:darkslategrey;padding:0.2rem 2em;border: 1px solid #333;--> | darkslategrey | #2f4f4f | 47 79 79
` `<!--rehype:style=background:darkturquoise;padding:0.2rem 2em;border: 1px solid #333;--> | darkturquoise | #00ced1 | 0 206 209
` `<!--rehype:style=background:darkviolet;padding:0.2rem 2em;border: 1px solid #333;--> | darkviolet | #9400d3 | 148 0 211
` `<!--rehype:style=background:deeppink;padding:0.2rem 2em;border: 1px solid #333;--> | deeppink | #ff1493 | 255 20 147
` `<!--rehype:style=background:deepskyblue;padding:0.2rem 2em;border: 1px solid #333;--> | deepskyblue | #00bfff | 0 191 255
` `<!--rehype:style=background:dimgray;padding:0.2rem 2em;border: 1px solid #333;--> | dimgray | #696969 | 105 105 105
` `<!--rehype:style=background:dimgrey;padding:0.2rem 2em;border: 1px solid #333;--> | dimgrey | #696969 | 105 105 105
` `<!--rehype:style=background:dodgerblue;padding:0.2rem 2em;border: 1px solid #333;--> | dodgerblue | #1e90ff | 30 144 255
` `<!--rehype:style=background:firebrick;padding:0.2rem 2em;border: 1px solid #333;--> | firebrick | #b22222 | 178 34 34
` `<!--rehype:style=background:floralwhite;padding:0.2rem 2em;border: 1px solid #333;--> | floralwhite | #fffaf0 | 255 250 240
` `<!--rehype:style=background:forestgreen;padding:0.2rem 2em;border: 1px solid #333;--> | forestgreen | #228b22 | 34 139 34
` `<!--rehype:style=background:fuchsia;padding:0.2rem 2em;border: 1px solid #333;--> | fuchsia | #ff00ff | 255 0 255
` `<!--rehype:style=background:gainsboro;padding:0.2rem 2em;border: 1px solid #333;--> | gainsboro | #dcdcdc | 220 220 220
` `<!--rehype:style=background:ghostwhite;padding:0.2rem 2em;border: 1px solid #333;--> | ghostwhite | #f8f8ff | 248 248 255
` `<!--rehype:style=background:gold;padding:0.2rem 2em;border: 1px solid #333;--> | gold | #ffd700 | 255 215 0
` `<!--rehype:style=background:goldenrod;padding:0.2rem 2em;border: 1px solid #333;--> | goldenrod | #daa520 | 218 165 32
` `<!--rehype:style=background:gray;padding:0.2rem 2em;border: 1px solid #333;--> | gray | #808080 | 128 128 128
` `<!--rehype:style=background:green;padding:0.2rem 2em;border: 1px solid #333;--> | green | #008000 | 0 128 0
` `<!--rehype:style=background:greenyellow;padding:0.2rem 2em;border: 1px solid #333;--> | greenyellow | #adff2f | 173 255 47
` `<!--rehype:style=background:grey;padding:0.2rem 2em;border: 1px solid #333;--> | grey | #808080 | 128 128 128
` `<!--rehype:style=background:honeydew;padding:0.2rem 2em;border: 1px solid #333;--> | honeydew | #f0fff0 | 240 255 240
` `<!--rehype:style=background:hotpink;padding:0.2rem 2em;border: 1px solid #333;--> | hotpink | #ff69b4 | 255 105 180
` `<!--rehype:style=background:indianred;padding:0.2rem 2em;border: 1px solid #333;--> | indianred | #cd5c5c | 205 92 92
` `<!--rehype:style=background:indigo;padding:0.2rem 2em;border: 1px solid #333;--> | indigo | #4b0082 | 75 0 130
` `<!--rehype:style=background:ivory;padding:0.2rem 2em;border: 1px solid #333;--> | ivory | #fffff0 | 255 255 240
` `<!--rehype:style=background:khaki;padding:0.2rem 2em;border: 1px solid #333;--> | khaki | #f0e68c | 240 230 140
` `<!--rehype:style=background:lavender;padding:0.2rem 2em;border: 1px solid #333;--> | lavender | #e6e6fa | 230 230 250
` `<!--rehype:style=background:lavenderblush;padding:0.2rem 2em;border: 1px solid #333;--> | lavenderblush | #fff0f5 | 255 240 245
` `<!--rehype:style=background:lawngreen;padding:0.2rem 2em;border: 1px solid #333;--> | lawngreen | #7cfc00 | 124 252 0
` `<!--rehype:style=background:lemonchiffon;padding:0.2rem 2em;border: 1px solid #333;--> | lemonchiffon | #fffacd | 255 250 205
` `<!--rehype:style=background:lightblue;padding:0.2rem 2em;border: 1px solid #333;--> | lightblue | #add8e6 | 173 216 230
` `<!--rehype:style=background:lightcoral;padding:0.2rem 2em;border: 1px solid #333;--> | lightcoral | #f08080 | 240 128 128
` `<!--rehype:style=background:lightcyan;padding:0.2rem 2em;border: 1px solid #333;--> | lightcyan | #e0ffff | 224 255 255
` `<!--rehype:style=background:lightgoldenrodyellow;padding:0.2rem 2em;border: 1px solid #333;--> | lightgoldenrodyellow | #fafad2 | 250 250 210
` `<!--rehype:style=background:lightgray;padding:0.2rem 2em;border: 1px solid #333;--> | lightgray | #d3d3d3 | 211 211 211
` `<!--rehype:style=background:lightgreen;padding:0.2rem 2em;border: 1px solid #333;--> | lightgreen | #90ee90 | 144 238 144
` `<!--rehype:style=background:lightgrey;padding:0.2rem 2em;border: 1px solid #333;--> | lightgrey | #d3d3d3 | 211 211 211
` `<!--rehype:style=background:lightpink;padding:0.2rem 2em;border: 1px solid #333;--> | lightpink | #ffb6c1 | 255 182 193
` `<!--rehype:style=background:lightsalmon;padding:0.2rem 2em;border: 1px solid #333;--> | lightsalmon | #ffa07a | 255 160 122
` `<!--rehype:style=background:lightseagreen;padding:0.2rem 2em;border: 1px solid #333;--> | lightseagreen | #20b2aa | 32 178 170
` `<!--rehype:style=background:lightskyblue;padding:0.2rem 2em;border: 1px solid #333;--> | lightskyblue | #87cefa | 135 206 250
` `<!--rehype:style=background:lightslategray;padding:0.2rem 2em;border: 1px solid #333;--> | lightslategray | #778899 | 119 136 153
` `<!--rehype:style=background:lightslategrey;padding:0.2rem 2em;border: 1px solid #333;--> | lightslategrey | #778899 | 119 136 153
` `<!--rehype:style=background:lightsteelblue;padding:0.2rem 2em;border: 1px solid #333;--> | lightsteelblue | #b0c4de | 176 196 222
` `<!--rehype:style=background:lightyellow;padding:0.2rem 2em;border: 1px solid #333;--> | lightyellow | #ffffe0 | 255 255 224
` `<!--rehype:style=background:lime;padding:0.2rem 2em;border: 1px solid #333;--> | lime | #00ff00 | 0 255 0
` `<!--rehype:style=background:limegreen;padding:0.2rem 2em;border: 1px solid #333;--> | limegreen | #32cd32 | 50 205 50
` `<!--rehype:style=background:linen;padding:0.2rem 2em;border: 1px solid #333;--> | linen | #faf0e6 | 250 240 230
` `<!--rehype:style=background:magenta;padding:0.2rem 2em;border: 1px solid #333;--> | magenta | #ff00ff | 255 0 255
` `<!--rehype:style=background:maroon;padding:0.2rem 2em;border: 1px solid #333;--> | maroon | #800000 | 128 0 0
` `<!--rehype:style=background:mediumaquamarine;padding:0.2rem 2em;border: 1px solid #333;--> | mediumaquamarine | #66cdaa | 102 205 170
` `<!--rehype:style=background:mediumblue;padding:0.2rem 2em;border: 1px solid #333;--> | mediumblue | #0000cd | 0 0 205
` `<!--rehype:style=background:mediumorchid;padding:0.2rem 2em;border: 1px solid #333;--> | mediumorchid | #ba55d3 | 186 85 211
` `<!--rehype:style=background:mediumpurple;padding:0.2rem 2em;border: 1px solid #333;--> | mediumpurple | #9370db | 147 112 219
` `<!--rehype:style=background:mediumseagreen;padding:0.2rem 2em;border: 1px solid #333;--> | mediumseagreen | #3cb371 | 60 179 113
` `<!--rehype:style=background:mediumslateblue;padding:0.2rem 2em;border: 1px solid #333;--> | mediumslateblue | #7b68ee | 123 104 238
` `<!--rehype:style=background:mediumspringgreen;padding:0.2rem 2em;border: 1px solid #333;--> | mediumspringgreen | #00fa9a | 0 250 154
` `<!--rehype:style=background:mediumturquoise;padding:0.2rem 2em;border: 1px solid #333;--> | mediumturquoise | #48d1cc | 72 209 204
` `<!--rehype:style=background:mediumvioletred;padding:0.2rem 2em;border: 1px solid #333;--> | mediumvioletred | #c71585 | 199 21 133
` `<!--rehype:style=background:midnightblue;padding:0.2rem 2em;border: 1px solid #333;--> | midnightblue | #191970 | 25 25 112
` `<!--rehype:style=background:mintcream;padding:0.2rem 2em;border: 1px solid #333;--> | mintcream | #f5fffa | 245 255 250
` `<!--rehype:style=background:mistyrose;padding:0.2rem 2em;border: 1px solid #333;--> | mistyrose | #ffe4e1 | 255 228 225
` `<!--rehype:style=background:moccasin;padding:0.2rem 2em;border: 1px solid #333;--> | moccasin | #ffe4b5 | 255 228 181
` `<!--rehype:style=background:navajowhite;padding:0.2rem 2em;border: 1px solid #333;--> | navajowhite | #ffdead | 255 222 173
` `<!--rehype:style=background:navy;padding:0.2rem 2em;border: 1px solid #333;--> | navy | #000080 | 0 0 128
` `<!--rehype:style=background:oldlace;padding:0.2rem 2em;border: 1px solid #333;--> | oldlace | #fdf5e6 | 253 245 230
` `<!--rehype:style=background:olive;padding:0.2rem 2em;border: 1px solid #333;--> | olive | #808000 | 128 128 0
` `<!--rehype:style=background:olivedrab;padding:0.2rem 2em;border: 1px solid #333;--> | olivedrab | #6b8e23 | 107 142 35
` `<!--rehype:style=background:orange;padding:0.2rem 2em;border: 1px solid #333;--> | orange | #ffa500 | 255 165 0
` `<!--rehype:style=background:orangered;padding:0.2rem 2em;border: 1px solid #333;--> | orangered | #ff4500 | 255 69 0
` `<!--rehype:style=background:orchid;padding:0.2rem 2em;border: 1px solid #333;--> | orchid | #da70d6 | 218 112 214
` `<!--rehype:style=background:palegoldenrod;padding:0.2rem 2em;border: 1px solid #333;--> | palegoldenrod | #eee8aa | 238 232 170
` `<!--rehype:style=background:palegreen;padding:0.2rem 2em;border: 1px solid #333;--> | palegreen | #98fb98 | 152 251 152
` `<!--rehype:style=background:paleturquoise;padding:0.2rem 2em;border: 1px solid #333;--> | paleturquoise | #afeeee | 175 238 238
` `<!--rehype:style=background:palevioletred;padding:0.2rem 2em;border: 1px solid #333;--> | palevioletred | #db7093 | 219 112 147
` `<!--rehype:style=background:papayawhip;padding:0.2rem 2em;border: 1px solid #333;--> | papayawhip | #ffefd5 | 255 239 213
` `<!--rehype:style=background:peachpuff;padding:0.2rem 2em;border: 1px solid #333;--> | peachpuff | #ffdab9 | 255 218 185
` `<!--rehype:style=background:peru;padding:0.2rem 2em;border: 1px solid #333;--> | peru | #cd853f | 205 133 63
` `<!--rehype:style=background:pink;padding:0.2rem 2em;border: 1px solid #333;--> | pink | #ffc0cb | 255 192 203
` `<!--rehype:style=background:plum;padding:0.2rem 2em;border: 1px solid #333;--> | plum | #dda0dd | 221 160 221
` `<!--rehype:style=background:powderblue;padding:0.2rem 2em;border: 1px solid #333;--> | powderblue | #b0e0e6 | 176 224 230
` `<!--rehype:style=background:purple;padding:0.2rem 2em;border: 1px solid #333;--> | purple | #800080 | 128 0 128
` `<!--rehype:style=background:rebeccapurple;padding:0.2rem 2em;border: 1px solid #333;--> | rebeccapurple | #663399 | 102 51 153
` `<!--rehype:style=background:red;padding:0.2rem 2em;border: 1px solid #333;--> | red | #ff0000 | 255 0 0
` `<!--rehype:style=background:rosybrown;padding:0.2rem 2em;border: 1px solid #333;--> | rosybrown | #bc8f8f | 188 143 143
` `<!--rehype:style=background:royalblue;padding:0.2rem 2em;border: 1px solid #333;--> | royalblue | #4169e1 | 65 105 225
` `<!--rehype:style=background:saddlebrown;padding:0.2rem 2em;border: 1px solid #333;--> | saddlebrown | #8b4513 | 139 69 19
` `<!--rehype:style=background:salmon;padding:0.2rem 2em;border: 1px solid #333;--> | salmon | #fa8072 | 250 128 114
` `<!--rehype:style=background:sandybrown;padding:0.2rem 2em;border: 1px solid #333;--> | sandybrown | #f4a460 | 244 164 96
` `<!--rehype:style=background:seagreen;padding:0.2rem 2em;border: 1px solid #333;--> | seagreen | #2e8b57 | 46 139 87
` `<!--rehype:style=background:seashell;padding:0.2rem 2em;border: 1px solid #333;--> | seashell | #fff5ee | 255 245 238
` `<!--rehype:style=background:sienna;padding:0.2rem 2em;border: 1px solid #333;--> | sienna | #a0522d | 160 82 45
` `<!--rehype:style=background:silver;padding:0.2rem 2em;border: 1px solid #333;--> | silver | #c0c0c0 | 192 192 192
` `<!--rehype:style=background:skyblue;padding:0.2rem 2em;border: 1px solid #333;--> | skyblue | #87ceeb | 135 206 235
` `<!--rehype:style=background:slateblue;padding:0.2rem 2em;border: 1px solid #333;--> | slateblue | #6a5acd | 106 90 205
` `<!--rehype:style=background:slategray;padding:0.2rem 2em;border: 1px solid #333;--> | slategray | #708090 | 112 128 144
` `<!--rehype:style=background:slategrey;padding:0.2rem 2em;border: 1px solid #333;--> | slategrey | #708090 | 112 128 144
` `<!--rehype:style=background:snow;padding:0.2rem 2em;border: 1px solid #333;--> | snow | #fffafa | 255 250 250
` `<!--rehype:style=background:springgreen;padding:0.2rem 2em;border: 1px solid #333;--> | springgreen | #00ff7f | 0 255 127
` `<!--rehype:style=background:steelblue;padding:0.2rem 2em;border: 1px solid #333;--> | steelblue | #4682b4 | 70 130 180
` `<!--rehype:style=background:tan;padding:0.2rem 2em;border: 1px solid #333;--> | tan | #d2b48c | 210 180 140
` `<!--rehype:style=background:teal;padding:0.2rem 2em;border: 1px solid #333;--> | teal | #008080 | 0 128 128
` `<!--rehype:style=background:thistle;padding:0.2rem 2em;border: 1px solid #333;--> | thistle | #d8bfd8 | 216 191 216
` `<!--rehype:style=background:tomato;padding:0.2rem 2em;border: 1px solid #333;--> | tomato | #ff6347 | 255 99 71
` `<!--rehype:style=background:turquoise;padding:0.2rem 2em;border: 1px solid #333;--> | turquoise | #40e0d0 | 64 224 208
` `<!--rehype:style=background:violet;padding:0.2rem 2em;border: 1px solid #333;--> | violet | #ee82ee | 238 130 238
` `<!--rehype:style=background:wheat;padding:0.2rem 2em;border: 1px solid #333;--> | wheat | #f5deb3 | 245 222 179
` `<!--rehype:style=background:white;padding:0.2rem 2em;border: 1px solid #333;--> | white | #ffffff | 255 255 255
` `<!--rehype:style=background:whitesmoke;padding:0.2rem 2em;border: 1px solid #333;--> | whitesmoke | #f5f5f5 | 245 245 245
` `<!--rehype:style=background:yellow;padding:0.2rem 2em;border: 1px solid #333;--> | yellow | #ffff00 | 255 255 0
` `<!--rehype:style=background:yellowgreen;padding:0.2rem 2em;border: 1px solid #333;--> | yellowgreen | #9acd32 | 154 205 50
<!--rehype:className=show-header-->
HSL 颜色示例
---
<!--rehype:body-class=cols-9-->
### 0° Reds
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(255, 204, 204);"></td>
<td style="background-color: rgb(250, 209, 209);"></td>
<td style="background-color: rgb(245, 214, 214);"></td>
<td style="background-color: rgb(240, 219, 219);"></td>
<td style="background-color: rgb(235, 224, 224);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(255, 153, 153);"></td>
<td style="background-color: rgb(245, 163, 163);"></td>
<td style="background-color: rgb(235, 173, 173);"></td>
<td style="background-color: rgb(224, 184, 184);"></td>
<td style="background-color: rgb(214, 194, 194);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(255, 102, 102);"></td>
<td style="background-color: rgb(240, 117, 117);"></td>
<td style="background-color: rgb(224, 133, 133);"></td>
<td style="background-color: rgb(209, 148, 148);"></td>
<td style="background-color: rgb(194, 163, 163);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(255, 51, 51);"></td>
<td style="background-color: rgb(235, 71, 71);"></td>
<td style="background-color: rgb(214, 92, 92);"></td>
<td style="background-color: rgb(194, 112, 112);"></td>
<td style="background-color: rgb(173, 133, 133);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(255, 0, 0);"></td>
<td style="background-color: rgb(230, 26, 26);"></td>
<td style="background-color: rgb(204, 51, 51);"></td>
<td style="background-color: rgb(179, 77, 77);"></td>
<td style="background-color: rgb(153, 102, 102);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(204, 0, 0);"></td>
<td style="background-color: rgb(184, 20, 20);"></td>
<td style="background-color: rgb(163, 41, 41);"></td>
<td style="background-color: rgb(143, 61, 61);"></td>
<td style="background-color: rgb(122, 82, 82);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(153, 0, 0);"></td>
<td style="background-color: rgb(138, 15, 15);"></td>
<td style="background-color: rgb(122, 31, 31);"></td>
<td style="background-color: rgb(107, 46, 46);"></td>
<td style="background-color: rgb(92, 61, 61);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(102, 0, 0);"></td>
<td style="background-color: rgb(92, 10, 10);"></td>
<td style="background-color: rgb(82, 20, 20);"></td>
<td style="background-color: rgb(71, 31, 31);"></td>
<td style="background-color: rgb(61, 41, 41);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(51, 0, 0);"></td>
<td style="background-color: rgb(46, 5, 5);"></td>
<td style="background-color: rgb(41, 10, 10);"></td>
<td style="background-color: rgb(36, 15, 15);"></td>
<td style="background-color: rgb(31, 20, 20);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 30° Reds-Yellows (=Oranges)
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(255, 230, 204);"></td>
<td style="background-color: rgb(250, 230, 209);"></td>
<td style="background-color: rgb(245, 230, 214);"></td>
<td style="background-color: rgb(240, 230, 219);"></td>
<td style="background-color: rgb(235, 230, 224);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(255, 204, 153);"></td>
<td style="background-color: rgb(245, 204, 163);"></td>
<td style="background-color: rgb(235, 204, 173);"></td>
<td style="background-color: rgb(224, 204, 184);"></td>
<td style="background-color: rgb(214, 204, 194);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(255, 179, 102);"></td>
<td style="background-color: rgb(240, 179, 117);"></td>
<td style="background-color: rgb(224, 179, 133);"></td>
<td style="background-color: rgb(209, 179, 148);"></td>
<td style="background-color: rgb(194, 179, 163);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(255, 153, 51);"></td>
<td style="background-color: rgb(235, 153, 71);"></td>
<td style="background-color: rgb(214, 153, 92);"></td>
<td style="background-color: rgb(194, 153, 112);"></td>
<td style="background-color: rgb(173, 153, 133);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(255, 128, 0);"></td>
<td style="background-color: rgb(230, 128, 26);"></td>
<td style="background-color: rgb(204, 128, 51);"></td>
<td style="background-color: rgb(179, 128, 77);"></td>
<td style="background-color: rgb(153, 128, 102);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(204, 102, 0);"></td>
<td style="background-color: rgb(184, 102, 20);"></td>
<td style="background-color: rgb(163, 102, 41);"></td>
<td style="background-color: rgb(143, 102, 61);"></td>
<td style="background-color: rgb(122, 102, 82);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(153, 77, 0);"></td>
<td style="background-color: rgb(138, 77, 15);"></td>
<td style="background-color: rgb(122, 77, 31);"></td>
<td style="background-color: rgb(107, 77, 46);"></td>
<td style="background-color: rgb(92, 77, 61);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(102, 51, 0);"></td>
<td style="background-color: rgb(92, 51, 10);"></td>
<td style="background-color: rgb(82, 51, 20);"></td>
<td style="background-color: rgb(71, 51, 31);"></td>
<td style="background-color: rgb(61, 51, 41);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(51, 26, 0);"></td>
<td style="background-color: rgb(46, 26, 5);"></td>
<td style="background-color: rgb(41, 26, 10);"></td>
<td style="background-color: rgb(36, 26, 15);"></td>
<td style="background-color: rgb(31, 26, 20);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 60° Yellows
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(255, 255, 204);"></td>
<td style="background-color: rgb(250, 250, 209);"></td>
<td style="background-color: rgb(245, 245, 214);"></td>
<td style="background-color: rgb(240, 240, 219);"></td>
<td style="background-color: rgb(235, 235, 224);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(255, 255, 153);"></td>
<td style="background-color: rgb(245, 245, 163);"></td>
<td style="background-color: rgb(235, 235, 173);"></td>
<td style="background-color: rgb(224, 224, 184);"></td>
<td style="background-color: rgb(214, 214, 194);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(255, 255, 102);"></td>
<td style="background-color: rgb(240, 240, 117);"></td>
<td style="background-color: rgb(224, 224, 133);"></td>
<td style="background-color: rgb(209, 209, 148);"></td>
<td style="background-color: rgb(194, 194, 163);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(255, 255, 51);"></td>
<td style="background-color: rgb(235, 235, 71);"></td>
<td style="background-color: rgb(214, 214, 92);"></td>
<td style="background-color: rgb(194, 194, 112);"></td>
<td style="background-color: rgb(173, 173, 133);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(255, 255, 0);"></td>
<td style="background-color: rgb(230, 230, 26);"></td>
<td style="background-color: rgb(204, 204, 51);"></td>
<td style="background-color: rgb(179, 179, 77);"></td>
<td style="background-color: rgb(153, 153, 102);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(204, 204, 0);"></td>
<td style="background-color: rgb(184, 184, 20);"></td>
<td style="background-color: rgb(163, 163, 41);"></td>
<td style="background-color: rgb(143, 143, 61);"></td>
<td style="background-color: rgb(122, 122, 82);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(153, 153, 0);"></td>
<td style="background-color: rgb(138, 138, 15);"></td>
<td style="background-color: rgb(122, 122, 31);"></td>
<td style="background-color: rgb(107, 107, 46);"></td>
<td style="background-color: rgb(92, 92, 61);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(102, 102, 0);"></td>
<td style="background-color: rgb(92, 92, 10);"></td>
<td style="background-color: rgb(82, 82, 20);"></td>
<td style="background-color: rgb(71, 71, 31);"></td>
<td style="background-color: rgb(61, 61, 41);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(51, 51, 0);"></td>
<td style="background-color: rgb(46, 46, 5);"></td>
<td style="background-color: rgb(41, 41, 10);"></td>
<td style="background-color: rgb(36, 36, 15);"></td>
<td style="background-color: rgb(31, 31, 20);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 90° Yellow-Greens
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(230, 255, 204);"></td>
<td style="background-color: rgb(230, 250, 209);"></td>
<td style="background-color: rgb(230, 245, 214);"></td>
<td style="background-color: rgb(230, 240, 219);"></td>
<td style="background-color: rgb(230, 235, 224);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(204, 255, 153);"></td>
<td style="background-color: rgb(204, 245, 163);"></td>
<td style="background-color: rgb(204, 235, 173);"></td>
<td style="background-color: rgb(204, 224, 184);"></td>
<td style="background-color: rgb(204, 214, 194);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(179, 255, 102);"></td>
<td style="background-color: rgb(179, 240, 117);"></td>
<td style="background-color: rgb(179, 224, 133);"></td>
<td style="background-color: rgb(179, 209, 148);"></td>
<td style="background-color: rgb(179, 194, 163);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(153, 255, 51);"></td>
<td style="background-color: rgb(153, 235, 71);"></td>
<td style="background-color: rgb(153, 214, 92);"></td>
<td style="background-color: rgb(153, 194, 112);"></td>
<td style="background-color: rgb(153, 173, 133);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(128, 255, 0);"></td>
<td style="background-color: rgb(128, 230, 26);"></td>
<td style="background-color: rgb(128, 204, 51);"></td>
<td style="background-color: rgb(128, 179, 77);"></td>
<td style="background-color: rgb(128, 153, 102);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(102, 204, 0);"></td>
<td style="background-color: rgb(102, 184, 20);"></td>
<td style="background-color: rgb(102, 163, 41);"></td>
<td style="background-color: rgb(102, 143, 61);"></td>
<td style="background-color: rgb(102, 122, 82);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(77, 153, 0);"></td>
<td style="background-color: rgb(77, 138, 15);"></td>
<td style="background-color: rgb(77, 122, 31);"></td>
<td style="background-color: rgb(77, 107, 46);"></td>
<td style="background-color: rgb(77, 92, 61);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(51, 102, 0);"></td>
<td style="background-color: rgb(51, 92, 10);"></td>
<td style="background-color: rgb(51, 82, 20);"></td>
<td style="background-color: rgb(51, 71, 31);"></td>
<td style="background-color: rgb(51, 61, 41);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(26, 51, 0);"></td>
<td style="background-color: rgb(26, 46, 5);"></td>
<td style="background-color: rgb(26, 41, 10);"></td>
<td style="background-color: rgb(26, 36, 15);"></td>
<td style="background-color: rgb(26, 31, 20);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 120° Greens
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(204, 255, 204);"></td>
<td style="background-color: rgb(209, 250, 209);"></td>
<td style="background-color: rgb(214, 245, 214);"></td>
<td style="background-color: rgb(219, 240, 219);"></td>
<td style="background-color: rgb(224, 235, 224);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(153, 255, 153);"></td>
<td style="background-color: rgb(163, 245, 163);"></td>
<td style="background-color: rgb(173, 235, 173);"></td>
<td style="background-color: rgb(184, 224, 184);"></td>
<td style="background-color: rgb(194, 214, 194);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(102, 255, 102);"></td>
<td style="background-color: rgb(117, 240, 117);"></td>
<td style="background-color: rgb(133, 224, 133);"></td>
<td style="background-color: rgb(148, 209, 148);"></td>
<td style="background-color: rgb(163, 194, 163);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(51, 255, 51);"></td>
<td style="background-color: rgb(71, 235, 71);"></td>
<td style="background-color: rgb(92, 214, 92);"></td>
<td style="background-color: rgb(112, 194, 112);"></td>
<td style="background-color: rgb(133, 173, 133);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(0, 255, 0);"></td>
<td style="background-color: rgb(26, 230, 26);"></td>
<td style="background-color: rgb(51, 204, 51);"></td>
<td style="background-color: rgb(77, 179, 77);"></td>
<td style="background-color: rgb(102, 153, 102);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(0, 204, 0);"></td>
<td style="background-color: rgb(20, 184, 20);"></td>
<td style="background-color: rgb(41, 163, 41);"></td>
<td style="background-color: rgb(61, 143, 61);"></td>
<td style="background-color: rgb(82, 122, 82);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(0, 153, 0);"></td>
<td style="background-color: rgb(15, 138, 15);"></td>
<td style="background-color: rgb(31, 122, 31);"></td>
<td style="background-color: rgb(46, 107, 46);"></td>
<td style="background-color: rgb(61, 92, 61);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(0, 102, 0);"></td>
<td style="background-color: rgb(10, 92, 10);"></td>
<td style="background-color: rgb(20, 82, 20);"></td>
<td style="background-color: rgb(31, 71, 31);"></td>
<td style="background-color: rgb(41, 61, 41);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(0, 51, 0);"></td>
<td style="background-color: rgb(5, 46, 5);"></td>
<td style="background-color: rgb(10, 41, 10);"></td>
<td style="background-color: rgb(15, 36, 15);"></td>
<td style="background-color: rgb(20, 31, 20);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 150° Green-Cyans
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(204, 255, 230);"></td>
<td style="background-color: rgb(209, 250, 230);"></td>
<td style="background-color: rgb(214, 245, 230);"></td>
<td style="background-color: rgb(219, 240, 230);"></td>
<td style="background-color: rgb(224, 235, 230);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(153, 255, 204);"></td>
<td style="background-color: rgb(163, 245, 204);"></td>
<td style="background-color: rgb(173, 235, 204);"></td>
<td style="background-color: rgb(184, 224, 204);"></td>
<td style="background-color: rgb(194, 214, 204);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(102, 255, 179);"></td>
<td style="background-color: rgb(117, 240, 179);"></td>
<td style="background-color: rgb(133, 224, 179);"></td>
<td style="background-color: rgb(148, 209, 179);"></td>
<td style="background-color: rgb(163, 194, 179);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(51, 255, 153);"></td>
<td style="background-color: rgb(71, 235, 153);"></td>
<td style="background-color: rgb(92, 214, 153);"></td>
<td style="background-color: rgb(112, 194, 153);"></td>
<td style="background-color: rgb(133, 173, 153);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(0, 255, 128);"></td>
<td style="background-color: rgb(26, 230, 128);"></td>
<td style="background-color: rgb(51, 204, 128);"></td>
<td style="background-color: rgb(77, 179, 128);"></td>
<td style="background-color: rgb(102, 153, 128);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(0, 204, 102);"></td>
<td style="background-color: rgb(20, 184, 102);"></td>
<td style="background-color: rgb(41, 163, 102);"></td>
<td style="background-color: rgb(61, 143, 102);"></td>
<td style="background-color: rgb(82, 122, 102);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(0, 153, 77);"></td>
<td style="background-color: rgb(15, 138, 77);"></td>
<td style="background-color: rgb(31, 122, 77);"></td>
<td style="background-color: rgb(46, 107, 77);"></td>
<td style="background-color: rgb(61, 92, 77);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(0, 102, 51);"></td>
<td style="background-color: rgb(10, 92, 51);"></td>
<td style="background-color: rgb(20, 82, 51);"></td>
<td style="background-color: rgb(31, 71, 51);"></td>
<td style="background-color: rgb(41, 61, 51);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(0, 51, 26);"></td>
<td style="background-color: rgb(5, 46, 26);"></td>
<td style="background-color: rgb(10, 41, 26);"></td>
<td style="background-color: rgb(15, 36, 26);"></td>
<td style="background-color: rgb(20, 31, 26);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 180° Cyans
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(204, 255, 255);"></td>
<td style="background-color: rgb(209, 250, 250);"></td>
<td style="background-color: rgb(214, 245, 245);"></td>
<td style="background-color: rgb(219, 240, 240);"></td>
<td style="background-color: rgb(224, 235, 235);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(153, 255, 255);"></td>
<td style="background-color: rgb(163, 245, 245);"></td>
<td style="background-color: rgb(173, 235, 235);"></td>
<td style="background-color: rgb(184, 224, 224);"></td>
<td style="background-color: rgb(194, 214, 214);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(102, 255, 255);"></td>
<td style="background-color: rgb(117, 240, 240);"></td>
<td style="background-color: rgb(133, 224, 224);"></td>
<td style="background-color: rgb(148, 209, 209);"></td>
<td style="background-color: rgb(163, 194, 194);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(51, 255, 255);"></td>
<td style="background-color: rgb(71, 235, 235);"></td>
<td style="background-color: rgb(92, 214, 214);"></td>
<td style="background-color: rgb(112, 194, 194);"></td>
<td style="background-color: rgb(133, 173, 173);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(0, 255, 255);"></td>
<td style="background-color: rgb(26, 230, 230);"></td>
<td style="background-color: rgb(51, 204, 204);"></td>
<td style="background-color: rgb(77, 179, 179);"></td>
<td style="background-color: rgb(102, 153, 153);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(0, 204, 204);"></td>
<td style="background-color: rgb(20, 184, 184);"></td>
<td style="background-color: rgb(41, 163, 163);"></td>
<td style="background-color: rgb(61, 143, 143);"></td>
<td style="background-color: rgb(82, 122, 122);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(0, 153, 153);"></td>
<td style="background-color: rgb(15, 138, 138);"></td>
<td style="background-color: rgb(31, 122, 122);"></td>
<td style="background-color: rgb(46, 107, 107);"></td>
<td style="background-color: rgb(61, 92, 92);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(0, 102, 102);"></td>
<td style="background-color: rgb(10, 92, 92);"></td>
<td style="background-color: rgb(20, 82, 82);"></td>
<td style="background-color: rgb(31, 71, 71);"></td>
<td style="background-color: rgb(41, 61, 61);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(0, 51, 51);"></td>
<td style="background-color: rgb(5, 46, 46);"></td>
<td style="background-color: rgb(10, 41, 41);"></td>
<td style="background-color: rgb(15, 36, 36);"></td>
<td style="background-color: rgb(20, 31, 31);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 210° Cyan-Blues
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(204, 230, 255);"></td>
<td style="background-color: rgb(209, 230, 250);"></td>
<td style="background-color: rgb(214, 230, 245);"></td>
<td style="background-color: rgb(219, 230, 240);"></td>
<td style="background-color: rgb(224, 230, 235);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(153, 204, 255);"></td>
<td style="background-color: rgb(163, 204, 245);"></td>
<td style="background-color: rgb(173, 204, 235);"></td>
<td style="background-color: rgb(184, 204, 224);"></td>
<td style="background-color: rgb(194, 204, 214);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(102, 179, 255);"></td>
<td style="background-color: rgb(117, 179, 240);"></td>
<td style="background-color: rgb(133, 179, 224);"></td>
<td style="background-color: rgb(148, 179, 209);"></td>
<td style="background-color: rgb(163, 179, 194);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(51, 153, 255);"></td>
<td style="background-color: rgb(71, 153, 235);"></td>
<td style="background-color: rgb(92, 153, 214);"></td>
<td style="background-color: rgb(112, 153, 194);"></td>
<td style="background-color: rgb(133, 153, 173);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(0, 128, 255);"></td>
<td style="background-color: rgb(26, 128, 230);"></td>
<td style="background-color: rgb(51, 128, 204);"></td>
<td style="background-color: rgb(77, 128, 179);"></td>
<td style="background-color: rgb(102, 128, 153);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(0, 102, 204);"></td>
<td style="background-color: rgb(20, 102, 184);"></td>
<td style="background-color: rgb(41, 102, 163);"></td>
<td style="background-color: rgb(61, 102, 143);"></td>
<td style="background-color: rgb(82, 102, 122);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(0, 77, 153);"></td>
<td style="background-color: rgb(15, 77, 138);"></td>
<td style="background-color: rgb(31, 77, 122);"></td>
<td style="background-color: rgb(46, 77, 107);"></td>
<td style="background-color: rgb(61, 77, 92);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(0, 51, 102);"></td>
<td style="background-color: rgb(10, 51, 92);"></td>
<td style="background-color: rgb(20, 51, 82);"></td>
<td style="background-color: rgb(31, 51, 71);"></td>
<td style="background-color: rgb(41, 51, 61);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(0, 26, 51);"></td>
<td style="background-color: rgb(5, 26, 46);"></td>
<td style="background-color: rgb(10, 26, 41);"></td>
<td style="background-color: rgb(15, 26, 36);"></td>
<td style="background-color: rgb(20, 26, 31);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 240° blues
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(204, 204, 255);"></td>
<td style="background-color: rgb(209, 209, 250);"></td>
<td style="background-color: rgb(214, 214, 245);"></td>
<td style="background-color: rgb(219, 219, 240);"></td>
<td style="background-color: rgb(224, 224, 235);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(153, 153, 255);"></td>
<td style="background-color: rgb(163, 163, 245);"></td>
<td style="background-color: rgb(173, 173, 235);"></td>
<td style="background-color: rgb(184, 184, 224);"></td>
<td style="background-color: rgb(194, 194, 214);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(102, 102, 255);"></td>
<td style="background-color: rgb(117, 117, 240);"></td>
<td style="background-color: rgb(133, 133, 224);"></td>
<td style="background-color: rgb(148, 148, 209);"></td>
<td style="background-color: rgb(163, 163, 194);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(51, 51, 255);"></td>
<td style="background-color: rgb(71, 71, 235);"></td>
<td style="background-color: rgb(92, 92, 214);"></td>
<td style="background-color: rgb(112, 112, 194);"></td>
<td style="background-color: rgb(133, 133, 173);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(0, 0, 255);"></td>
<td style="background-color: rgb(26, 26, 230);"></td>
<td style="background-color: rgb(51, 51, 204);"></td>
<td style="background-color: rgb(77, 77, 179);"></td>
<td style="background-color: rgb(102, 102, 153);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(0, 0, 204);"></td>
<td style="background-color: rgb(20, 20, 184);"></td>
<td style="background-color: rgb(41, 41, 163);"></td>
<td style="background-color: rgb(61, 61, 143);"></td>
<td style="background-color: rgb(82, 82, 122);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(0, 0, 153);"></td>
<td style="background-color: rgb(15, 15, 138);"></td>
<td style="background-color: rgb(31, 31, 122);"></td>
<td style="background-color: rgb(46, 46, 107);"></td>
<td style="background-color: rgb(61, 61, 92);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(0, 0, 102);"></td>
<td style="background-color: rgb(10, 10, 92);"></td>
<td style="background-color: rgb(20, 20, 82);"></td>
<td style="background-color: rgb(31, 31, 71);"></td>
<td style="background-color: rgb(41, 41, 61);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(0, 0, 51);"></td>
<td style="background-color: rgb(5, 5, 46);"></td>
<td style="background-color: rgb(10, 10, 41);"></td>
<td style="background-color: rgb(15, 15, 36);"></td>
<td style="background-color: rgb(20, 20, 31);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 270° Blue-Magentas
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(230, 204, 255);"></td>
<td style="background-color: rgb(230, 209, 250);"></td>
<td style="background-color: rgb(230, 214, 245);"></td>
<td style="background-color: rgb(230, 219, 240);"></td>
<td style="background-color: rgb(230, 224, 235);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(204, 153, 255);"></td>
<td style="background-color: rgb(204, 163, 245);"></td>
<td style="background-color: rgb(204, 173, 235);"></td>
<td style="background-color: rgb(204, 184, 224);"></td>
<td style="background-color: rgb(204, 194, 214);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(179, 102, 255);"></td>
<td style="background-color: rgb(179, 117, 240);"></td>
<td style="background-color: rgb(179, 133, 224);"></td>
<td style="background-color: rgb(179, 148, 209);"></td>
<td style="background-color: rgb(179, 163, 194);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(153, 51, 255);"></td>
<td style="background-color: rgb(153, 71, 235);"></td>
<td style="background-color: rgb(153, 92, 214);"></td>
<td style="background-color: rgb(153, 112, 194);"></td>
<td style="background-color: rgb(153, 133, 173);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(128, 0, 255);"></td>
<td style="background-color: rgb(128, 26, 230);"></td>
<td style="background-color: rgb(128, 51, 204);"></td>
<td style="background-color: rgb(128, 77, 179);"></td>
<td style="background-color: rgb(128, 102, 153);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(102, 0, 204);"></td>
<td style="background-color: rgb(102, 20, 184);"></td>
<td style="background-color: rgb(102, 41, 163);"></td>
<td style="background-color: rgb(102, 61, 143);"></td>
<td style="background-color: rgb(102, 82, 122);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(77, 0, 153);"></td>
<td style="background-color: rgb(77, 15, 138);"></td>
<td style="background-color: rgb(77, 31, 122);"></td>
<td style="background-color: rgb(77, 46, 107);"></td>
<td style="background-color: rgb(77, 61, 92);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(51, 0, 102);"></td>
<td style="background-color: rgb(51, 10, 92);"></td>
<td style="background-color: rgb(51, 20, 82);"></td>
<td style="background-color: rgb(51, 31, 71);"></td>
<td style="background-color: rgb(51, 41, 61);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(26, 0, 51);"></td>
<td style="background-color: rgb(26, 5, 46);"></td>
<td style="background-color: rgb(26, 10, 41);"></td>
<td style="background-color: rgb(26, 15, 36);"></td>
<td style="background-color: rgb(26, 20, 31);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 300° Magentas
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(255, 204, 255);"></td>
<td style="background-color: rgb(250, 209, 250);"></td>
<td style="background-color: rgb(245, 214, 245);"></td>
<td style="background-color: rgb(240, 219, 240);"></td>
<td style="background-color: rgb(235, 224, 235);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(255, 153, 255);"></td>
<td style="background-color: rgb(245, 163, 245);"></td>
<td style="background-color: rgb(235, 173, 235);"></td>
<td style="background-color: rgb(224, 184, 224);"></td>
<td style="background-color: rgb(214, 194, 214);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(255, 102, 255);"></td>
<td style="background-color: rgb(240, 117, 240);"></td>
<td style="background-color: rgb(224, 133, 224);"></td>
<td style="background-color: rgb(209, 148, 209);"></td>
<td style="background-color: rgb(194, 163, 194);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(255, 51, 255);"></td>
<td style="background-color: rgb(235, 71, 235);"></td>
<td style="background-color: rgb(214, 92, 214);"></td>
<td style="background-color: rgb(194, 112, 194);"></td>
<td style="background-color: rgb(173, 133, 173);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(255, 0, 255);"></td>
<td style="background-color: rgb(230, 26, 230);"></td>
<td style="background-color: rgb(204, 51, 204);"></td>
<td style="background-color: rgb(179, 77, 179);"></td>
<td style="background-color: rgb(153, 102, 153);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(204, 0, 204);"></td>
<td style="background-color: rgb(184, 20, 184);"></td>
<td style="background-color: rgb(163, 41, 163);"></td>
<td style="background-color: rgb(143, 61, 143);"></td>
<td style="background-color: rgb(122, 82, 122);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(153, 0, 153);"></td>
<td style="background-color: rgb(138, 15, 138);"></td>
<td style="background-color: rgb(122, 31, 122);"></td>
<td style="background-color: rgb(107, 46, 107);"></td>
<td style="background-color: rgb(92, 61, 92);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(102, 0, 102);"></td>
<td style="background-color: rgb(92, 10, 92);"></td>
<td style="background-color: rgb(82, 20, 82);"></td>
<td style="background-color: rgb(71, 31, 71);"></td>
<td style="background-color: rgb(61, 41, 61);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(51, 0, 51);"></td>
<td style="background-color: rgb(46, 5, 46);"></td>
<td style="background-color: rgb(41, 10, 41);"></td>
<td style="background-color: rgb(36, 15, 36);"></td>
<td style="background-color: rgb(31, 20, 31);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
### 330° Magenta-Reds
<!--rehype:wrap-class=col-span-3-->
<table style="font-size:12px;border-radius: 0.5rem;overflow: hidden;">
<thead>
<tr>
<th></th>
<th>100%</th>
<th>80%</th>
<th>60%</th>
<th>40%</th>
<th>20%</th>
<th>0%</th>
</tr>
</thead>
<tbody>
<tr>
<th>100%</th>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
<td style="background-color: rgb(255, 255, 255);"></td>
</tr>
<tr>
<th>90%</th>
<td style="background-color: rgb(255, 204, 230);"></td>
<td style="background-color: rgb(250, 209, 230);"></td>
<td style="background-color: rgb(245, 214, 230);"></td>
<td style="background-color: rgb(240, 219, 230);"></td>
<td style="background-color: rgb(235, 224, 230);"></td>
<td style="background-color: rgb(230, 230, 230);"></td>
</tr>
<tr>
<th>80%</th>
<td style="background-color: rgb(255, 153, 204);"></td>
<td style="background-color: rgb(245, 163, 204);"></td>
<td style="background-color: rgb(235, 173, 204);"></td>
<td style="background-color: rgb(224, 184, 204);"></td>
<td style="background-color: rgb(214, 194, 204);"></td>
<td style="background-color: rgb(204, 204, 204);"></td>
</tr>
<tr>
<th>70%</th>
<td style="background-color: rgb(255, 102, 179);"></td>
<td style="background-color: rgb(240, 117, 179);"></td>
<td style="background-color: rgb(224, 133, 179);"></td>
<td style="background-color: rgb(209, 148, 179);"></td>
<td style="background-color: rgb(194, 163, 179);"></td>
<td style="background-color: rgb(179, 179, 179);"></td>
</tr>
<tr>
<th>60%</th>
<td style="background-color: rgb(255, 51, 153);"></td>
<td style="background-color: rgb(235, 71, 153);"></td>
<td style="background-color: rgb(214, 92, 153);"></td>
<td style="background-color: rgb(194, 112, 153);"></td>
<td style="background-color: rgb(173, 133, 153);"></td>
<td style="background-color: rgb(153, 153, 153);"></td>
</tr>
<tr>
<th>50%</th>
<td style="background-color: rgb(255, 0, 128);"></td>
<td style="background-color: rgb(230, 26, 128);"></td>
<td style="background-color: rgb(204, 51, 128);"></td>
<td style="background-color: rgb(179, 77, 128);"></td>
<td style="background-color: rgb(153, 102, 128);"></td>
<td style="background-color: rgb(128, 128, 128);"></td>
</tr>
<tr>
<th>40%</th>
<td style="background-color: rgb(204, 0, 102);"></td>
<td style="background-color: rgb(184, 20, 102);"></td>
<td style="background-color: rgb(163, 41, 102);"></td>
<td style="background-color: rgb(143, 61, 102);"></td>
<td style="background-color: rgb(122, 82, 102);"></td>
<td style="background-color: rgb(102, 102, 102);"></td>
</tr>
<tr>
<th>30%</th>
<td style="background-color: rgb(153, 0, 77);"></td>
<td style="background-color: rgb(138, 15, 77);"></td>
<td style="background-color: rgb(122, 31, 77);"></td>
<td style="background-color: rgb(107, 46, 77);"></td>
<td style="background-color: rgb(92, 61, 77);"></td>
<td style="background-color: rgb(77, 77, 77);"></td>
</tr>
<tr>
<th>20%</th>
<td style="background-color: rgb(102, 0, 51);"></td>
<td style="background-color: rgb(92, 10, 51);"></td>
<td style="background-color: rgb(82, 20, 51);"></td>
<td style="background-color: rgb(71, 31, 51);"></td>
<td style="background-color: rgb(61, 41, 51);"></td>
<td style="background-color: rgb(51, 51, 51);"></td>
</tr>
<tr>
<th>10%</th>
<td style="background-color: rgb(51, 0, 26);"></td>
<td style="background-color: rgb(46, 5, 26);"></td>
<td style="background-color: rgb(41, 10, 26);"></td>
<td style="background-color: rgb(36, 15, 26);"></td>
<td style="background-color: rgb(31, 20, 26);"></td>
<td style="background-color: rgb(26, 26, 26);"></td>
</tr>
<tr>
<th>0%</th>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
<td style="background-color: rgb(0, 0, 0);"></td>
</tr>
</tbody>
</table>
<!--rehype:className=show-header-->
另见
----
- [CSS 备忘清单](./css.md)
- [Named Colors](https://www.w3.org/TR/css-color-4/#named-colors) _(w3.org)_
Reference in New Issue View Git Blame Copy Permalink