• 欢迎来到小可 · Wiki，人人可编辑的，多平台聊天机器人“小可”的官方文档资源。
  • 小可很可爱，请给我们打钱。
  • 原 MkDocs 已迁入本站。若发现 404 属正常现象，请点击左上角搜索您想要的模块。

color/颜色列表：修订间差异

来自小可 · Wiki，人人可编辑的，QQ机器人“小可”的官方文档资源
可视化Wikitext
（→‎CSS1）
小 （→‎CSS3）
 
（未显示同一用户的31个中间版本）
第2行： 第2行：


== CSS ==
== CSS ==
斜体名称为受到支持但不会显示的别名。
=== CSS1 ===
=== CSS1 ===
{| class="wikitable sortable"
{| class="wikitable sortable"
第20行： 第22行：
|| <code>purple</code> || <code>#800080</code> || style="background:#800080;" |
|| <code>purple</code> || <code>#800080</code> || style="background:#800080;" |
|-
|-
|| <code>fuchsia</code> || <code>#ff00ff</code> || style="background:#ff00ff;" |
|| ''<code>fuchsia</code>'' || <code>#ff00ff</code> || style="background:#ff00ff;" |
|-
|-
|| <code>green</code> || <code>#008000</code> || style="background:#008000;" |
|| <code>green</code> || <code>#008000</code> || style="background:#008000;" |
第36行： 第38行：
|| <code>teal</code> || <code>#008080</code> || style="background:#008080;" |
|| <code>teal</code> || <code>#008080</code> || style="background:#008080;" |
|-
|-
|| <code>aqua</code> || <code>#00ffff</code> || style="background:#00ffff;" |
|| ''<code>aqua</code>'' || <code>#00ffff</code> || style="background:#00ffff;" |
|}
|}


=== CSS2 ===
=== CSS2 ===
{| class="wikitable sortable"
! 名称 !! Hex !! 颜色
|-
|| <code>orange</code> || <code>#ffa500</code> || style="background:#ffa500;" |
|}


=== CSS3 ===
=== CSS3 ===
{| class="wikitable sortable"
! 名称 !! Hex !! 颜色
|-
|| <code>aliceblue</code> || <code>#f0f8ff</code> || style="background:#f0f8ff;" |
|-
|| <code>antiquewhite</code> || <code>#faebd7</code> || style="background:#faebd7;" |
|-
|| <code>aquamarine</code> || <code>#7fffd4</code> || style="background:#7fffd4;" |
|-
|| <code>azure</code> || <code>#f0ffff</code> || style="background:#f0ffff;" |
|-
|| <code>beige</code> || <code>#f5f5dc</code> || style="background:#f5f5dc;" |
|-
|| <code>bisque</code> || <code>#ffe4c4</code> || style="background:#ffe4c4;" |
|-
|| <code>blanchedalmond</code> || <code>#ffebcd</code> || style="background:#ffebcd;" |
|-
|| <code>blueviolet</code> || <code>#8a2be2</code> || style="background:#8a2be2;" |
|-
|| <code>brown</code> || <code>#a52a2a</code> || style="background:#a52a2a;" |
|-
|| <code>burlywood</code> || <code>#deb887</code> || style="background:#deb887;" |
|-
|| <code>cadetblue</code> || <code>#5f9ea0</code> || style="background:#5f9ea0;" |
|-
|| <code>chartreuse</code> || <code>#7fff00</code> || style="background:#7fff00;" |
|-
|| <code>chocolate</code> || <code>#d2691e</code> || style="background:#d2691e;" |
|-
|| <code>coral</code> || <code>#ff7f50</code> || style="background:#ff7f50;" |
|-
|| <code>cornflowerblue</code> || <code>#6495ed</code> || style="background:#6495ed;" |
|-
|| <code>cornsilk</code> || <code>#fff8dc</code> || style="background:#fff8dc;" |
|-
|| <code>cyan</code> || <code>#00ffff</code> || style="background:#00ffff;" |
|-
|| <code>darkblue</code> || <code>#00008b</code> || style="background:#00008b;" |
|-
|| <code>darkcyan</code> || <code>#008b8b</code> || style="background:#008b8b;" |
|-
|| <code>darkgoldenrod</code> || <code>#b8860b</code> || style="background:#b8860b;" |
|-
|| <code>darkgray</code> || <code>#a9a9a9</code> || style="background:#a9a9a9;" |
|-
|| <code>darkgreen</code> || <code>#006400</code> || style="background:#006400;" |
|-
|| ''<code>darkgrey</code>'' || <code>#a9a9a9</code> || style="background:#a9a9a9;" |
|-
|| <code>darkkhaki</code> || <code>#bdb76b</code> || style="background:#bdb76b;" |
|-
|| <code>darkmagenta</code> || <code>#8b008b</code> || style="background:#8b008b;" |
|-
|| <code>darkolivegreen</code> || <code>#556b2f</code> || style="background:#556b2f;" |
|-
|| <code>darkorange</code> || <code>#ff8c00</code> || style="background:#ff8c00;" |
|-
|| <code>darkorchid</code> || <code>#9932cc</code> || style="background:#9932cc;" |
|-
|| <code>darkred</code> || <code>#8b0000</code> || style="background:#8b0000;" |
|-
|| <code>darksalmon</code> || <code>#e9967a</code> || style="background:#e9967a;" |
|-
|| <code>darkseagreen</code> || <code>#8fbc8f</code> || style="background:#8fbc8f;" |
|-
|| <code>darkslateblue</code> || <code>#483d8b</code> || style="background:#483d8b;" |
|-
|| <code>darkslategray</code> || <code>#2f4f4f</code> || style="background:#2f4f4f;" |
|-
|| ''<code>darkslategrey</code>'' || <code>#2f4f4f</code> || style="background:#2f4f4f;" |
|-
|| <code>darkturquoise</code> || <code>#00ced1</code> || style="background:#00ced1;" |
|-
|| <code>darkviolet</code> || <code>#9400d3</code> || style="background:#9400d3;" |
|-
|| <code>deeppink</code> || <code>#ff1493</code> || style="background:#ff1493;" |
|-
|| <code>deepskyblue</code> || <code>#00bfff</code> || style="background:#00bfff;" |
|-
|| <code>dimgray</code> || <code>#696969</code> || style="background:#696969;" |
|-
|| ''<code>dimgrey</code>'' || <code>#696969</code> || style="background:#696969;" |
|-
|| <code>dodgerblue</code> || <code>#1e90ff</code> || style="background:#1e90ff;" |
|-
|| <code>floralwhite</code> || <code>#fffaf0</code> || style="background:#fffaf0;" |
|-
|| <code>forestgreen</code> || <code>#228b22</code> || style="background:#228b22;" |
|-
|| <code>gainsboro</code> || <code>#dcdcdc</code> || style="background:#dcdcdc;" |
|-
|| <code>ghostwhite</code> || <code>#f8f8ff</code> || style="background:#f8f8ff;" |
|-
|| <code>gold</code> || <code>#ffd700</code> || style="background:#ffd700;" |
|-
|| <code>goldenrod</code> || <code>#daa520</code> || style="background:#daa520;" |
|-
|| <code>greenyellow</code> || <code>#adff2f</code> || style="background:#adff2f;" |
|-
|| ''<code>grey</code>'' || <code>#808080</code> || style="background:#808080;" |
|-
|| <code>honeydew</code> || <code>#f0fff0</code> || style="background:#f0fff0;" |
|-
|| <code>hotpink</code> || <code>#ff69b4</code> || style="background:#ff69b4;" |
|-
|| <code>indianred</code> || <code>#cd5c5c</code> || style="background:#cd5c5c;" |
|-
|| <code>indigo</code> || <code>#4b0082</code> || style="background:#4b0082;" |
|-
|| <code>ivory</code> || <code>#fffff0</code> || style="background:#fffff0;" |
|-
|| <code>khaki</code> || <code>#f0e68c</code> || style="background:#f0e68c;" |
|-
|| <code>lavender</code> || <code>#e6e6fa</code> || style="background:#e6e6fa;" |
|-
|| <code>lavenderblush</code> || <code>#fff0f5</code> || style="background:#fff0f5;" |
|-
|| <code>lawngreen</code> || <code>#7cfc00</code> || style="background:#7cfc00;" |
|-
|| <code>lemonchiffon</code> || <code>#fffacd</code> || style="background:#fffacd;" |
|-
|| <code>lightblue</code> || <code>#add8e6</code> || style="background:#add8e6;" |
|-
|| <code>lightcoral</code> || <code>#f08080</code> || style="background:#f08080;" |
|-
|| <code>lightcyan</code> || <code>#e0ffff</code> || style="background:#e0ffff;" |
|-
|| <code>lightgoldenrodyellow</code> || <code>#fafad2</code> || style="background:#fafad2;" |
|-
|| <code>lightgray</code> || <code>#d3d3d3</code> || style="background:#d3d3d3;" |
|-
|| <code>lightgreen</code> || <code>#90ee90</code> || style="background:#90ee90;" |
|-
|| ''<code>lightgrey</code>'' || <code>#d3d3d3</code> || style="background:#d3d3d3;" |
|-
|| <code>lightpink</code> || <code>#ffb6c1</code> || style="background:#ffb6c1;" |
|-
|| <code>lightsalmon</code> || <code>#ffa07a</code> || style="background:#ffa07a;" |
|-
|| <code>lightseagreen</code> || <code>#20b2aa</code> || style="background:#20b2aa;" |
|-
|| <code>lightskyblue</code> || <code>#87cefa</code> || style="background:#87cefa;" |
|-
|| <code>lightslategray</code> || <code>#778899</code> || style="background:#778899;" |
|-
|| ''<code>lightslategrey</code>'' || <code>#778899</code> || style="background:#778899;" |
|-
|| <code>lightsteelblue</code> || <code>#b0c4be</code> || style="background:#b0c4be;" |
|-
|| <code>lightyellow</code> || <code>#ffffe0</code> || style="background:#ffffe0;" |
|-
|| <code>limegreen</code> || <code>#32cd32</code> || style="background:#32cd32;" |
|-
|| <code>linen</code> || <code>#faf0e6</code> || style="background:#faf0e6;" |
|-
|| <code>magenta</code> || <code>#ff00ff</code> || style="background:#ff00ff;" |
|-
|| <code>mediumaquamarine</code> || <code>#66cdaa</code> || style="background:#66cdaa;" |
|-
|| <code>mediumblue</code> || <code>#0000cd</code> || style="background:#0000cd;" |
|-
|| <code>mediumorchid</code> || <code>#ba55d3</code> || style="background:#ba55d3;" |
|-
|| <code>mediumpurple</code> || <code>#9370db</code> || style="background:#9370db;" |
|-
|| <code>mediumseagreen</code> || <code>#3cb371</code> || style="background:#3cb371;" |
|-
|| <code>mediumslateblue</code> || <code>#7b68ee</code> || style="background:#7b68ee;" |
|-
|| <code>mediumspringgreen</code> || <code>#00fa9a</code> || style="background:#00fa9a;" |
|-
|| <code>mediumturquoise</code> || <code>#48d1cc</code> || style="background:#48d1cc;" |
|-
|| <code>mediumvioletred</code> || <code>#c71585</code> || style="background:#c71585;" |
|-
|| <code>midnightblue</code> || <code>#191970</code> || style="background:#191970;" |
|-
|| <code>mintcream</code> || <code>#f5fffa</code> || style="background:#f5fffa;" |
|-
|| <code>mistyrose</code> || <code>#ffe4e1</code> || style="background:#ffe4e1;" |
|-
|| <code>moccasin</code> || <code>#ffe4b5</code> || style="background:#ffe4b5;" |
|-
|| <code>navajowhite</code> || <code>#ffdead</code> || style="background:#ffdead;" |
|-
|| <code>oldlace</code> || <code>#fdf5e6</code> || style="background:#fdf5e6;" |
|-
|| <code>olivedrab</code> || <code>#6b8e23</code> || style="background:#6b8e23;" |
|-
|| <code>orangered</code> || <code>#ff4500</code> || style="background:#ff4500;" |
|-
|| <code>orchid</code> || <code>#da70d6</code> || style="background:#da70d6;" |
|-
|| <code>palegoldenrod</code> || <code>#eee8aa</code> || style="background:#eee8aa;" |
|-
|| <code>palegreen</code> || <code>#98fb98</code> || style="background:#98fb98;" |
|-
|| <code>paleturquoise</code> || <code>#afeeee</code> || style="background:#afeeee;" |
|-
|| <code>palevioletred</code> || <code>#db7093</code> || style="background:#db7093;" |
|-
|| <code>papayawhip</code> || <code>#ffefd5</code> || style="background:#ffefd5;" |
|-
|| <code>peachpuff</code> || <code>#ffdab9</code> || style="background:#ffdab9;" |
|-
|| <code>peru</code> || <code>#cd853f</code> || style="background:#cd853f;" |
|-
|| <code>pink</code> || <code>#ffc0cb</code> || style="background:#ffc0cb;" |
|-
|| <code>plum</code> || <code>#dda0dd</code> || style="background:#dda0dd;" |
|-
|| <code>powderblue</code> || <code>#b0e0e6</code> || style="background:#b0e0e6;" |
|-
|| <code>rosybrown</code> || <code>#bc8f8f</code> || style="background:#bc8f8f;" |
|-
|| <code>royalblue</code> || <code>#4169e1</code> || style="background:#4169e1;" |
|-
|| <code>saddlebrown</code> || <code>#8b4513</code> || style="background:#8b4513;" |
|-
|| <code>salmon</code> || <code>#fa8072</code> || style="background:#fa8072;" |
|-
|| <code>sandybrown</code> || <code>#f4a460</code> || style="background:#f4a460;" |
|-
|| <code>seagreen</code> || <code>#2e8b57</code> || style="background:#2e8b57;" |
|-
|| <code>seashell</code> || <code>#fff5ee</code> || style="background:#fff5ee;" |
|-
|| <code>sienna</code> || <code>#a0522d</code> || style="background:#a0522d;" |
|-
|| <code>skyblue</code> || <code>#87ceeb</code> || style="background:#87ceeb;" |
|-
|| <code>slateblue</code> || <code>#6a5acd</code> || style="background:#6a5acd;" |
|-
|| <code>slategray</code> || <code>#708090</code> || style="background:#708090;" |
|-
|| ''<code>slategrey</code>'' || <code>#708090</code> || style="background:#708090;" |
|-
|| <code>snow</code> || <code>#fffafa</code> || style="background:#fffafa;" |
|-
|| <code>springgreen</code> || <code>#00ff7f</code> || style="background:#00ff7f;" |
|-
|| <code>steelblue</code> || <code>#4682b4</code> || style="background:#4682b4;" |
|-
|| <code>tan</code> || <code>#d2b48c</code> || style="background:#d2b48c;" |
|-
|| <code>thistle</code> || <code>#d8bfd8</code> || style="background:#d8bfd8;" |
|-
|| <code>tomato</code> || <code>#ff6347</code> || style="background:#ff6347;" |
|-
|| <code>turquoise</code> || <code>#40e0d0</code> || style="background:#40e0d0;" |
|-
|| <code>violet</code> || <code>#ee82ee</code> || style="background:#ee82ee;" |
|-
|| <code>wheat</code> || <code>#f5deb3</code> || style="background:#f5deb3;" |
|-
|| <code>whitesmoke</code> || <code>#f5f5f5</code> || style="background:#f5f5f5;" |
|-
|| <code>yellowgreen</code> || <code>#9acd32</code> || style="background:#9acd32;" |
|}


=== CSS4 ===
=== CSS4 ===
{| class="wikitable sortable"
! 名称 !! Hex !! 颜色
|-
|| <code>rebeccapurple</code> || <code>#663399</code> || style="background:#663399;" |
|}


== Material Design ==
== Material Design ==
Material Design 颜色的颜色格式为<code><颜色名称>-<色号></code>。
=== red ===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#ffebee</code> || style="background:#ffebee;" |
|-
|| 100 || <code>#ffcdd2</code> || style="background:#ffcdd2;" |
|-
|| 200 || <code>#ef9a9a</code> || style="background:#ef9a9a;" |
|-
|| 300 || <code>#e57373</code> || style="background:#e57373;" |
|-
|| 400 || <code>#ef5350</code> || style="background:#ef5350;" |
|-
|| 500 || <code>#f44336</code> || style="background:#f44336;" |
|-
|| 600 || <code>#e53935</code> || style="background:#e53935;" |
|-
|| 700 || <code>#d32f2f</code> || style="background:#d32f2f;" |
|-
|| 800 || <code>#c62828</code> || style="background:#c62828;" |
|-
|| 900 || <code>#b71c1c</code> || style="background:#b71c1c;" |
|-
|| A100 || <code>#ff8a80</code> || style="background:#ff8a80;" |
|-
|| A200 || <code>#ff5252</code> || style="background:#ff5252;" |
|-
|| A400 || <code>#ff1744</code> || style="background:#ff1744;" |
|-
|| A700 || <code>#d50000</code> || style="background:#d50000;" |
|}
=== pink ===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#fce4ec</code> || style="background:#fce4ec;" |
|-
|| 100 || <code>#f8bbd0</code> || style="background:#f8bbd0;" |
|-
|| 200 || <code>#f48fb1</code> || style="background:#f48fb1;" |
|-
|| 300 || <code>#f06292</code> || style="background:#f06292;" |
|-
|| 400 || <code>#ec407a</code> || style="background:#ec407a;" |
|-
|| 500 || <code>#e91e63</code> || style="background:#e91e63;" |
|-
|| 600 || <code>#d81b60</code> || style="background:#d81b60;" |
|-
|| 700 || <code>#c2185b</code> || style="background:#c2185b;" |
|-
|| 800 || <code>#ad1457</code> || style="background:#ad1457;" |
|-
|| 900 || <code>#880e4f</code> || style="background:#880e4f;" |
|-
|| A100 || <code>#ff80ab</code> || style="background:#ff80ab;" |
|-
|| A200 || <code>#ff4081</code> || style="background:#ff4081;" |
|-
|| A400 || <code>#f50057</code> || style="background:#f50057;" |
|-
|| A700 || <code>#c51162</code> || style="background:#c51162;" |
|}
=== purple ===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#f3e5f5</code> || style="background:#f3e5f5;" |
|-
|| 100 || <code>#e1bee7</code> || style="background:#e1bee7;" |
|-
|| 200 || <code>#ce93d8</code> || style="background:#ce93d8;" |
|-
|| 300 || <code>#ba68c8</code> || style="background:#ba68c8;" |
|-
|| 400 || <code>#ab47bc</code> || style="background:#ab47bc;" |
|-
|| 500 || <code>#9c27b0</code> || style="background:#9c27b0;" |
|-
|| 600 || <code>#8e24aa</code> || style="background:#8e24aa;" |
|-
|| 700 || <code>#7b1fa2</code> || style="background:#7b1fa2;" |
|-
|| 800 || <code>#6a1b9a</code> || style="background:#6a1b9a;" |
|-
|| 900 || <code>#4a148c</code> || style="background:#4a148c;" |
|-
|| A100 || <code>#ea80fc</code> || style="background:#ea80fc;" |
|-
|| A200 || <code>#e040fb</code> || style="background:#e040fb;" |
|-
|| A400 || <code>#d500f9</code> || style="background:#d500f9;" |
|-
|| A700 || <code>#aa00ff</code> || style="background:#aa00ff;" |
|}
===deeppurple===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#ede7f6</code> || style="background:#ede7f6;" |
|-
|| 100 || <code>#d1c4e9</code> || style="background:#d1c4e9;" |
|-
|| 200 || <code>#b39ddb</code> || style="background:#b39ddb;" |
|-
|| 300 || <code>#9575cd</code> || style="background:#9575cd;" |
|-
|| 400 || <code>#7e57c2</code> || style="background:#7e57c2;" |
|-
|| 500 || <code>#673ab7</code> || style="background:#673ab7;" |
|-
|| 600 || <code>#5e35b1</code> || style="background:#5e35b1;" |
|-
|| 700 || <code>#512da8</code> || style="background:#512da8;" |
|-
|| 800 || <code>#4527a0</code> || style="background:#4527a0;" |
|-
|| 900 || <code>#311b92</code> || style="background:#311b92;" |
|-
|| A100 || <code>#b388ff</code> || style="background:#b388ff;" |
|-
|| A200 || <code>#7c4dff</code> || style="background:#7c4dff;" |
|-
|| A400 || <code>#651fff</code> || style="background:#651fff;" |
|-
|| A700 || <code>#6200ea</code> || style="background:#6200ea;" |
|}
=== indigo ===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#e8eaf6</code> || style="background:#e8eaf6;" |
|-
|| 100 || <code>#c5cae9</code> || style="background:#c5cae9;" |
|-
|| 200 || <code>#9fa8da</code> || style="background:#9fa8da;" |
|-
|| 300 || <code>#7986cb</code> || style="background:#7986cb;" |
|-
|| 400 || <code>#5c6bc0</code> || style="background:#5c6bc0;" |
|-
|| 500 || <code>#3f51b5</code> || style="background:#3f51b5;" |
|-
|| 600 || <code>#3949ab</code> || style="background:#3949ab;" |
|-
|| 700 || <code>#303f9f</code> || style="background:#303f9f;" |
|-
|| 800 || <code>#283593</code> || style="background:#283593;" |
|-
|| 900 || <code>#1a237e</code> || style="background:#1a237e;" |
|-
|| A100 || <code>#8c9eff</code> || style="background:#8c9eff;" |
|-
|| A200 || <code>#536dfe</code> || style="background:#536dfe;" |
|-
|| A400 || <code>#3d5afe</code> || style="background:#3d5afe;" |
|-
|| A700 || <code>#304ffe</code> || style="background:#304ffe;" |
|}
=== blue ===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#e3f2fd</code> || style="background:#e3f2fd;" |
|-
|| 100 || <code>#bbdefb</code> || style="background:#bbdefb;" |
|-
|| 200 || <code>#90caf9</code> || style="background:#90caf9;" |
|-
|| 300 || <code>#64b5f6</code> || style="background:#64b5f6;" |
|-
|| 400 || <code>#42a5f5</code> || style="background:#42a5f5;" |
|-
|| 500 || <code>#2196f3</code> || style="background:#2196f3;" |
|-
|| 600 || <code>#1e88e5</code> || style="background:#1e88e5;" |
|-
|| 700 || <code>#1976d2</code> || style="background:#1976d2;" |
|-
|| 800 || <code>#1565c0</code> || style="background:#1565c0;" |
|-
|| 900 || <code>#0d47a1</code> || style="background:#0d47a1;" |
|-
|| A100 || <code>#82b1ff</code> || style="background:#82b1ff;" |
|-
|| A200 || <code>#448aff</code> || style="background:#448aff;" |
|-
|| A400 || <code>#2979ff</code> || style="background:#2979ff;" |
|-
|| A700 || <code>#2962ff</code> || style="background:#2962ff;" |
|}
===lightblue===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#e1f5fe</code> || style="background:#e1f5fe;" |
|-
|| 100 || <code>#b3e5fc</code> || style="background:#b3e5fc;" |
|-
|| 200 || <code>#81d4fa</code> || style="background:#81d4fa;" |
|-
|| 300 || <code>#4fc3f7</code> || style="background:#4fc3f7;" |
|-
|| 400 || <code>#29b6f6</code> || style="background:#29b6f6;" |
|-
|| 500 || <code>#03a9f4</code> || style="background:#03a9f4;" |
|-
|| 600 || <code>#039be5</code> || style="background:#039be5;" |
|-
|| 700 || <code>#0288d1</code> || style="background:#0288d1;" |
|-
|| 800 || <code>#0277bd</code> || style="background:#0277bd;" |
|-
|| 900 || <code>#01579b</code> || style="background:#01579b;" |
|-
|| A100 || <code>#80d8ff</code> || style="background:#80d8ff;" |
|-
|| A200 || <code>#40c4ff</code> || style="background:#40c4ff;" |
|-
|| A400 || <code>#00b0ff</code> || style="background:#00b0ff;" |
|-
|| A700 || <code>#0091ea</code> || style="background:#0091ea;" |
|}
===cyan===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#e0f7fa</code> || style="background:#e0f7fa;" |
|-
|| 100 || <code>#b2ebf2</code> || style="background:#b2ebf2;" |
|-
|| 200 || <code>#80deea</code> || style="background:#80deea;" |
|-
|| 300 || <code>#4dd0e1</code> || style="background:#4dd0e1;" |
|-
|| 400 || <code>#26c6da</code> || style="background:#26c6da;" |
|-
|| 500 || <code>#00bcd4</code> || style="background:#00bcd4;" |
|-
|| 600 || <code>#00acc1</code> || style="background:#00acc1;" |
|-
|| 700 || <code>#0097a7</code> || style="background:#0097a7;" |
|-
|| 800 || <code>#00838f</code> || style="background:#00838f;" |
|-
|| 900 || <code>#006064</code> || style="background:#006064;" |
|-
|| A100 || <code>#84ffff</code> || style="background:#84ffff;" |
|-
|| A200 || <code>#18ffff</code> || style="background:#18ffff;" |
|-
|| A400 || <code>#00e5ff</code> || style="background:#00e5ff;" |
|-
|| A700 || <code>#00b8d4</code> || style="background:#00b8d4;" |
|}
===teal===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#e0f2f1</code> || style="background:#e0f2f1;" |
|-
|| 100 || <code>#b2dfdb</code> || style="background:#b2dfdb;" |
|-
|| 200 || <code>#80cbc4</code> || style="background:#80cbc4;" |
|-
|| 300 || <code>#4db6ac</code> || style="background:#4db6ac;" |
|-
|| 400 || <code>#26a69a</code> || style="background:#26a69a;" |
|-
|| 500 || <code>#009688</code> || style="background:#009688;" |
|-
|| 600 || <code>#00897b</code> || style="background:#00897b;" |
|-
|| 700 || <code>#00796b</code> || style="background:#00796b;" |
|-
|| 800 || <code>#00695c</code> || style="background:#00695c;" |
|-
|| 900 || <code>#004d40</code> || style="background:#004d40;" |
|-
|| A100 || <code>#a7ffeb</code> || style="background:#a7ffeb;" |
|-
|| A200 || <code>#64ffda</code> || style="background:#64ffda;" |
|-
|| A400 || <code>#1de9b6</code> || style="background:#1de9b6;" |
|-
|| A700 || <code>#00bfa5</code> || style="background:#00bfa5;" |
|}
===green===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#e8f5e9</code> || style="background:#e8f5e9;" |
|-
|| 100 || <code>#c8e6c9</code> || style="background:#c8e6c9;" |
|-
|| 200 || <code>#a5d6a7</code> || style="background:#a5d6a7;" |
|-
|| 300 || <code>#81c784</code> || style="background:#81c784;" |
|-
|| 400 || <code>#66bb6a</code> || style="background:#66bb6a;" |
|-
|| 500 || <code>#4caf50</code> || style="background:#4caf50;" |
|-
|| 600 || <code>#43a047</code> || style="background:#43a047;" |
|-
|| 700 || <code>#388e3c</code> || style="background:#388e3c;" |
|-
|| 800 || <code>#2e7d32</code> || style="background:#2e7d32;" |
|-
|| 900 || <code>#1b5e20</code> || style="background:#1b5e20;" |
|-
|| A100 || <code>#b9f6ca</code> || style="background:#b9f6ca;" |
|-
|| A200 || <code>#69f0ae</code> || style="background:#69f0ae;" |
|-
|| A400 || <code>#00e676</code> || style="background:#00e676;" |
|-
|| A700 || <code>#00c853</code> || style="background:#00c853;" |
|}
===lightgreen===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#f1f8e9</code> || style="background:#f1f8e9;" |
|-
|| 100 || <code>#dcedc8</code> || style="background:#dcedc8;" |
|-
|| 200 || <code>#c5e1a5</code> || style="background:#c5e1a5;" |
|-
|| 300 || <code>#aed581</code> || style="background:#aed581;" |
|-
|| 400 || <code>#9ccc65</code> || style="background:#9ccc65;" |
|-
|| 500 || <code>#8bc34a</code> || style="background:#8bc34a;" |
|-
|| 600 || <code>#7cb342</code> || style="background:#7cb342;" |
|-
|| 700 || <code>#689f38</code> || style="background:#689f38;" |
|-
|| 800 || <code>#558b2f</code> || style="background:#558b2f;" |
|-
|| 900 || <code>#33691e</code> || style="background:#33691e;" |
|-
|| A100 || <code>#ccff90</code> || style="background:#ccff90;" |
|-
|| A200 || <code>#b2ff59</code> || style="background:#b2ff59;" |
|-
|| A400 || <code>#76ff03</code> || style="background:#76ff03;" |
|-
|| A700 || <code>#64dd17</code> || style="background:#64dd17;" |
|}
===lime===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#f9fbe7</code> || style="background:#f9fbe7;" |
|-
|| 100 || <code>#f0f4c3</code> || style="background:#f0f4c3;" |
|-
|| 200 || <code>#e6ee9c</code> || style="background:#e6ee9c;" |
|-
|| 300 || <code>#dce775</code> || style="background:#dce775;" |
|-
|| 400 || <code>#d4e157</code> || style="background:#d4e157;" |
|-
|| 500 || <code>#cddc39</code> || style="background:#cddc39;" |
|-
|| 600 || <code>#c0ca33</code> || style="background:#c0ca33;" |
|-
|| 700 || <code>#afb42b</code> || style="background:#afb42b;" |
|-
|| 800 || <code>#9e9d24</code> || style="background:#9e9d24;" |
|-
|| 900 || <code>#827717</code> || style="background:#827717;" |
|-
|| A100 || <code>#f4ff81</code> || style="background:#f4ff81;" |
|-
|| A200 || <code>#eeff41</code> || style="background:#eeff41;" |
|-
|| A400 || <code>#c6ff00</code> || style="background:#c6ff00;" |
|-
|| A700 || <code>#aeea00</code> || style="background:#aeea00;" |
|}
===yellow===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#fffde7</code> || style="background:#fffde7;" |
|-
|| 100 || <code>#fff9c4</code> || style="background:#fff9c4;" |
|-
|| 200 || <code>#fff59d</code> || style="background:#fff59d;" |
|-
|| 300 || <code>#fff176</code> || style="background:#fff176;" |
|-
|| 400 || <code>#ffee58</code> || style="background:#ffee58;" |
|-
|| 500 || <code>#ffeb3b</code> || style="background:#ffeb3b;" |
|-
|| 600 || <code>#fdd835</code> || style="background:#fdd835;" |
|-
|| 700 || <code>#fbc02d</code> || style="background:#fbc02d;" |
|-
|| 800 || <code>#f9a825</code> || style="background:#f9a825;" |
|-
|| 900 || <code>#f57f17</code> || style="background:#f57f17;" |
|-
|| A100 || <code>#ffff8d</code> || style="background:#ffff8d;" |
|-
|| A200 || <code>#ffff00</code> || style="background:#ffff00;" |
|-
|| A400 || <code>#ffea00</code> || style="background:#ffea00;" |
|-
|| A700 || <code>#ffd600</code> || style="background:#ffd600;" |
|}
===amber===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
| 50 || <code>#fff8e1</code> || style="background:#fff8e1;" |
|-
|| 100 || <code>#ffecb3</code> || style="background:#ffecb3;" |
|-
|| 200 || <code>#ffe082</code> || style="background:#ffe082;" |
|-
|| 300 || <code>#ffd54f</code> || style="background:#ffd54f;" |
|-
|| 400 || <code>#ffca28</code> || style="background:#ffca28;" |
|-
|| 500 || <code>#ffc107</code> || style="background:#ffc107;" |
|-
|| 600 || <code>#ffb300</code> || style="background:#ffb300;" |
|-
|| 700 || <code>#ffa000</code> || style="background:#ffa000;" |
|-
|| 800 || <code>#ff8f00</code> || style="background:#ff8f00;" |
|-
|| 900 || <code>#ff6f00</code> || style="background:#ff6f00;" |
|-
|| A100 || <code>#ffe57f</code> || style="background:#ffe57f;" |
|-
|| A200 || <code>#ffd740</code> || style="background:#ffd740;" |
|-
|| A400 || <code>#ffc400</code> || style="background:#ffc400;" |
|-
|| A700 || <code>#ffab00</code> || style="background:#ffab00;" |
|}
===orange===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#fff3e0</code> || style="background:#fff3e0;" |
|-
|| 100 || <code>#ffe0b2</code> || style="background:#ffe0b2;" |
|-
|| 200 || <code>#ffcc80</code> || style="background:#ffcc80;" |
|-
|| 300 || <code>#ffb74d</code> || style="background:#ffb74d;" |
|-
|| 400 || <code>#ffa726</code> || style="background:#ffa726;" |
|-
|| 500 || <code>#ff9800</code> || style="background:#ff9800;" |
|-
|| 600 || <code>#fb8c00</code> || style="background:#fb8c00;" |
|-
|| 700 || <code>#f57c00</code> || style="background:#f57c00;" |
|-
|| 800 || <code>#ef6c00</code> || style="background:#ef6c00;" |
|-
|| 900 || <code>#e65100</code> || style="background:#e65100;" |
|-
|| A100 || <code>#ffd180</code> || style="background:#ffd180;" |
|-
|| A200 || <code>#ffab40</code> || style="background:#ffab40;" |
|-
|| A400 || <code>#ff9100</code> || style="background:#ff9100;" |
|-
|| A700 || <code>#ff6d00</code> || style="background:#ff6d00;" |
|}
===deeporange===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#fbe9e7</code> || style="background:#fbe9e7;" |
|-
|| 100 || <code>#ffccbc</code> || style="background:#ffccbc;" |
|-
|| 200 || <code>#ffab91</code> || style="background:#ffab91;" |
|-
|| 300 || <code>#ff8a65</code> || style="background:#ff8a65;" |
|-
|| 400 || <code>#ff7043</code> || style="background:#ff7043;" |
|-
|| 500 || <code>#ff5722</code> || style="background:#ff5722;" |
|-
|| 600 || <code>#f4511e</code> || style="background:#f4511e;" |
|-
|| 700 || <code>#e64a19</code> || style="background:#e64a19;" |
|-
|| 800 || <code>#d84315</code> || style="background:#d84315;" |
|-
|| 900 || <code>#bf360c</code> || style="background:#bf360c;" |
|-
|| A100 || <code>#ff9e80</code> || style="background:#ff9e80;" |
|-
|| A200 || <code>#ff6e40</code> || style="background:#ff6e40;" |
|-
|| A400 || <code>#ff3d00</code> || style="background:#ff3d00;" |
|-
|| A700 || <code>#dd2c00</code> || style="background:#dd2c00;" |
|}
===brown===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#efebe9</code> || style="background:#efebe9;" |
|-
|| 100 || <code>#d7ccc8</code> || style="background:#d7ccc8;" |
|-
|| 200 || <code>#bcaaa4</code> || style="background:#bcaaa4;" |
|-
|| 300 || <code>#a1887f</code> || style="background:#a1887f;" |
|-
|| 400 || <code>#8d6e63</code> || style="background:#8d6e63;" |
|-
|| 500 || <code>#795548</code> || style="background:#795548;" |
|-
|| 600 || <code>#6d4c41</code> || style="background:#6d4c41;" |
|-
|| 700 || <code>#5d4037</code> || style="background:#5d4037;" |
|-
|| 800 || <code>#4e342e</code> || style="background:#4e342e;" |
|-
|| 900 || <code>#3e2723</code> || style="background:#3e2723;" |
|}
===grey===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#fafafa</code> || style="background:#fafafa;" |
|-
|| 100 || <code>#f5f5f5</code> || style="background:#f5f5f5;" |
|-
|| 200 || <code>#eeeeee</code> || style="background:#eeeeee;" |
|-
|| 300 || <code>#e0e0e0</code> || style="background:#e0e0e0;" |
|-
|| 400 || <code>#bdbdbd</code> || style="background:#bdbdbd;" |
|-
|| 500 || <code>#9e9e9e</code> || style="background:#9e9e9e;" |
|-
|| 600 || <code>#757575</code> || style="background:#757575;" |
|-
|| 700 || <code>#616161</code> || style="background:#616161;" |
|-
|| 800 || <code>#424242</code> || style="background:#424242;" |
|-
|| 900 || <code>#212121</code> || style="background:#212121;" |
|}
===bluegrey===
{| class="wikitable"
! 色号 !! Hex !! 颜色
|-
|| 50 || <code>#eceff1</code> || style="background:#eceff1;" |
|-
|| 100 || <code>#cfd8dc</code> || style="background:#cfd8dc;" |
|-
|| 200 || <code>#b0bec5</code> || style="background:#b0bec5;" |
|-
|| 300 || <code>#90a4ae</code> || style="background:#90a4ae;" |
|-
|| 400 || <code>#78909c</code> || style="background:#78909c;" |
|-
|| 500 || <code>#607d8b</code> || style="background:#607d8b;" |
|-
|| 600 || <code>#546e7a</code> || style="background:#546e7a;" |
|-
|| 700 || <code>#455a64</code> || style="background:#455a64;" |
|-
|| 800 || <code>#37474f</code> || style="background:#37474f;" |
|-
|| 900 || <code>#263238</code> || style="background:#263238;" |
|}
===其他===
{| class="wikitable"
! 名称 !! Hex !! 颜色
|-
|| <code>black</code> || <code>#000000</code> || style="background:#000000;" |
|-
|| <code>white</code> || <code>#ffffff</code> || style="background:#ffffff;" |
|}

2024年4月8日 (一) 13:25的最新版本

本页面为 CSS 颜色和 Material Design 颜色的所有列表。

CSS

斜体名称为受到支持但不会显示的别名。

CSS1

名称 Hex 颜色
black #000000
silver #c0c0c0
gray #808080
white #ffffff
maroon #800000
red #ff0000
purple #800080
fuchsia #ff00ff
green #008000
lime #00ff00
olive #808000
yellow #ffff00
navy #000080
blue #0000ff
teal #008080
aqua #00ffff

CSS2

名称 Hex 颜色
orange #ffa500

CSS3

名称 Hex 颜色
aliceblue #f0f8ff
antiquewhite #faebd7
aquamarine #7fffd4
azure #f0ffff
beige #f5f5dc
bisque #ffe4c4
blanchedalmond #ffebcd
blueviolet #8a2be2
brown #a52a2a
burlywood #deb887
cadetblue #5f9ea0
chartreuse #7fff00
chocolate #d2691e
coral #ff7f50
cornflowerblue #6495ed
cornsilk #fff8dc
cyan #00ffff
darkblue #00008b
darkcyan #008b8b
darkgoldenrod #b8860b
darkgray #a9a9a9
darkgreen #006400
darkgrey #a9a9a9
darkkhaki #bdb76b
darkmagenta #8b008b
darkolivegreen #556b2f
darkorange #ff8c00
darkorchid #9932cc
darkred #8b0000
darksalmon #e9967a
darkseagreen #8fbc8f
darkslateblue #483d8b
darkslategray #2f4f4f
darkslategrey #2f4f4f
darkturquoise #00ced1
darkviolet #9400d3
deeppink #ff1493
deepskyblue #00bfff
dimgray #696969
dimgrey #696969
dodgerblue #1e90ff
floralwhite #fffaf0
forestgreen #228b22
gainsboro #dcdcdc
ghostwhite #f8f8ff
gold #ffd700
goldenrod #daa520
greenyellow #adff2f
grey #808080
honeydew #f0fff0
hotpink #ff69b4
indianred #cd5c5c
indigo #4b0082
ivory #fffff0
khaki #f0e68c
lavender #e6e6fa
lavenderblush #fff0f5
lawngreen #7cfc00
lemonchiffon #fffacd
lightblue #add8e6
lightcoral #f08080
lightcyan #e0ffff
lightgoldenrodyellow #fafad2
lightgray #d3d3d3
lightgreen #90ee90
lightgrey #d3d3d3
lightpink #ffb6c1
lightsalmon #ffa07a
lightseagreen #20b2aa
lightskyblue #87cefa
lightslategray #778899
lightslategrey #778899
lightsteelblue #b0c4be
lightyellow #ffffe0
limegreen #32cd32
linen #faf0e6
magenta #ff00ff
mediumaquamarine #66cdaa
mediumblue #0000cd
mediumorchid #ba55d3
mediumpurple #9370db
mediumseagreen #3cb371
mediumslateblue #7b68ee
mediumspringgreen #00fa9a
mediumturquoise #48d1cc
mediumvioletred #c71585
midnightblue #191970
mintcream #f5fffa
mistyrose #ffe4e1
moccasin #ffe4b5
navajowhite #ffdead
oldlace #fdf5e6
olivedrab #6b8e23
orangered #ff4500
orchid #da70d6
palegoldenrod #eee8aa
palegreen #98fb98
paleturquoise #afeeee
palevioletred #db7093
papayawhip #ffefd5
peachpuff #ffdab9
peru #cd853f
pink #ffc0cb
plum #dda0dd
powderblue #b0e0e6
rosybrown #bc8f8f
royalblue #4169e1
saddlebrown #8b4513
salmon #fa8072
sandybrown #f4a460
seagreen #2e8b57
seashell #fff5ee
sienna #a0522d
skyblue #87ceeb
slateblue #6a5acd
slategray #708090
slategrey #708090
snow #fffafa
springgreen #00ff7f
steelblue #4682b4
tan #d2b48c
thistle #d8bfd8
tomato #ff6347
turquoise #40e0d0
violet #ee82ee
wheat #f5deb3
whitesmoke #f5f5f5
yellowgreen #9acd32

CSS4

名称 Hex 颜色
rebeccapurple #663399

Material Design

Material Design 颜色的颜色格式为<颜色名称>-<色号>。

red

色号 Hex 颜色
50 #ffebee
100 #ffcdd2
200 #ef9a9a
300 #e57373
400 #ef5350
500 #f44336
600 #e53935
700 #d32f2f
800 #c62828
900 #b71c1c
A100 #ff8a80
A200 #ff5252
A400 #ff1744
A700 #d50000

pink

色号 Hex 颜色
50 #fce4ec
100 #f8bbd0
200 #f48fb1
300 #f06292
400 #ec407a
500 #e91e63
600 #d81b60
700 #c2185b
800 #ad1457
900 #880e4f
A100 #ff80ab
A200 #ff4081
A400 #f50057
A700 #c51162

purple

色号 Hex 颜色
50 #f3e5f5
100 #e1bee7
200 #ce93d8
300 #ba68c8
400 #ab47bc
500 #9c27b0
600 #8e24aa
700 #7b1fa2
800 #6a1b9a
900 #4a148c
A100 #ea80fc
A200 #e040fb
A400 #d500f9
A700 #aa00ff

deeppurple

色号 Hex 颜色
50 #ede7f6
100 #d1c4e9
200 #b39ddb
300 #9575cd
400 #7e57c2
500 #673ab7
600 #5e35b1
700 #512da8
800 #4527a0
900 #311b92
A100 #b388ff
A200 #7c4dff
A400 #651fff
A700 #6200ea

indigo

色号 Hex 颜色
50 #e8eaf6
100 #c5cae9
200 #9fa8da
300 #7986cb
400 #5c6bc0
500 #3f51b5
600 #3949ab
700 #303f9f
800 #283593
900 #1a237e
A100 #8c9eff
A200 #536dfe
A400 #3d5afe
A700 #304ffe

blue

色号 Hex 颜色
50 #e3f2fd
100 #bbdefb
200 #90caf9
300 #64b5f6
400 #42a5f5
500 #2196f3
600 #1e88e5
700 #1976d2
800 #1565c0
900 #0d47a1
A100 #82b1ff
A200 #448aff
A400 #2979ff
A700 #2962ff

lightblue

色号 Hex 颜色
50 #e1f5fe
100 #b3e5fc
200 #81d4fa
300 #4fc3f7
400 #29b6f6
500 #03a9f4
600 #039be5
700 #0288d1
800 #0277bd
900 #01579b
A100 #80d8ff
A200 #40c4ff
A400 #00b0ff
A700 #0091ea

cyan

色号 Hex 颜色
50 #e0f7fa
100 #b2ebf2
200 #80deea
300 #4dd0e1
400 #26c6da
500 #00bcd4
600 #00acc1
700 #0097a7
800 #00838f
900 #006064
A100 #84ffff
A200 #18ffff
A400 #00e5ff
A700 #00b8d4

teal

色号 Hex 颜色
50 #e0f2f1
100 #b2dfdb
200 #80cbc4
300 #4db6ac
400 #26a69a
500 #009688
600 #00897b
700 #00796b
800 #00695c
900 #004d40
A100 #a7ffeb
A200 #64ffda
A400 #1de9b6
A700 #00bfa5

green

色号 Hex 颜色
50 #e8f5e9
100 #c8e6c9
200 #a5d6a7
300 #81c784
400 #66bb6a
500 #4caf50
600 #43a047
700 #388e3c
800 #2e7d32
900 #1b5e20
A100 #b9f6ca
A200 #69f0ae
A400 #00e676
A700 #00c853

lightgreen

色号 Hex 颜色
50 #f1f8e9
100 #dcedc8
200 #c5e1a5
300 #aed581
400 #9ccc65
500 #8bc34a
600 #7cb342
700 #689f38
800 #558b2f
900 #33691e
A100 #ccff90
A200 #b2ff59
A400 #76ff03
A700 #64dd17

lime

色号 Hex 颜色
50 #f9fbe7
100 #f0f4c3
200 #e6ee9c
300 #dce775
400 #d4e157
500 #cddc39
600 #c0ca33
700 #afb42b
800 #9e9d24
900 #827717
A100 #f4ff81
A200 #eeff41
A400 #c6ff00
A700 #aeea00

yellow

色号 Hex 颜色
50 #fffde7
100 #fff9c4
200 #fff59d
300 #fff176
400 #ffee58
500 #ffeb3b
600 #fdd835
700 #fbc02d
800 #f9a825
900 #f57f17
A100 #ffff8d
A200 #ffff00
A400 #ffea00
A700 #ffd600

amber

色号 Hex 颜色
50 #fff8e1
100 #ffecb3
200 #ffe082
300 #ffd54f
400 #ffca28
500 #ffc107
600 #ffb300
700 #ffa000
800 #ff8f00
900 #ff6f00
A100 #ffe57f
A200 #ffd740
A400 #ffc400
A700 #ffab00

orange

色号 Hex 颜色
50 #fff3e0
100 #ffe0b2
200 #ffcc80
300 #ffb74d
400 #ffa726
500 #ff9800
600 #fb8c00
700 #f57c00
800 #ef6c00
900 #e65100
A100 #ffd180
A200 #ffab40
A400 #ff9100
A700 #ff6d00

deeporange

色号 Hex 颜色
50 #fbe9e7
100 #ffccbc
200 #ffab91
300 #ff8a65
400 #ff7043
500 #ff5722
600 #f4511e
700 #e64a19
800 #d84315
900 #bf360c
A100 #ff9e80
A200 #ff6e40
A400 #ff3d00
A700 #dd2c00

brown

色号 Hex 颜色
50 #efebe9
100 #d7ccc8
200 #bcaaa4
300 #a1887f
400 #8d6e63
500 #795548
600 #6d4c41
700 #5d4037
800 #4e342e
900 #3e2723

grey

色号 Hex 颜色
50 #fafafa
100 #f5f5f5
200 #eeeeee
300 #e0e0e0
400 #bdbdbd
500 #9e9e9e
600 #757575
700 #616161
800 #424242
900 #212121

bluegrey

色号 Hex 颜色
50 #eceff1
100 #cfd8dc
200 #b0bec5
300 #90a4ae
400 #78909c
500 #607d8b
600 #546e7a
700 #455a64
800 #37474f
900 #263238

其他

名称 Hex 颜色
black #000000
white #ffffff
取自“https://bot.teahouse.team/index.php?title=color/颜色列表&oldid=2877”
Cookie帮助我们提供我们的服务。通过使用我们的服务，您同意我们使用cookie。
更多信息