boxmoe_header_banner_img

学习是一件漫长而又免费的事

加载中

文章导读

HTML 颜色名


avatar
海豚V靓仔 2026年2月8日 27

掌握HTML颜色名的重要性

    理解并正确使用HTML颜色名,对网页开发与设计至关重要:

      标准支持与兼容性:W3C 的 HTML 4.0 标准仅正式定义了 16 种颜色名,包括:aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow。这是确保最大兼容性的最基础集合,在使用时应优先考虑。
      现代浏览器的扩展支持:当前主流浏览器(如 Chrome, Firefox, Edge, Safari)扩展支持了超过 140 种颜色名,例如 AliceBlue, Coral, DarkOrange 等,这为开发者提供了更多便利、直观的颜色选择,使代码更易读写。
      颜色名与精确控制的权衡:颜色名的优势在于语义清晰、便于记忆。但其选择范围有限,且不同颜色名对应的具体色值固定。当需要精确匹配品牌色、实现渐变或使用标准外颜色时,必须使用十六进制(如 #FF4500)或 RGB(如 rgb(255, 69, 0))表示法。

完整HTML颜色名列表与预览

以下列表展示了现代浏览器普遍支持的HTML颜色名、其对应的十六进制值及视觉预览。此列表远超HTML4.0标准定义的16种,提供了丰富的选择。

颜色名列表(部分展示)

为便于查阅,以下表格按字母顺序展示了部分常用颜色名,并提供了颜色预览。完整的140+种颜色名可在W3School等参考手册中找到。

颜色名 (Name) 十六进制值 (HEX) 颜色预览
AliceBlue #F0F8FF
AntiqueWhite #FAEBD7
Aqua / Cyan #00FFFF
Aquamarine #7FFFD4
Azure #F0FFFF
Black #000000
Blue #0000FF
Brown #A52A2A
Coral #FF7F50
CornflowerBlue #6495ED
Crimson #DC143C
DarkBlue #00008B
DarkOrange #FF8C00
DarkRed #8B0000
DeepPink #FF1493
DeepSkyBlue #00BFFF
ForestGreen #228B22
Fuchsia / Magenta #FF00FF
Gold #FFD700
Gray #808080
Green #008000
HotPink #FF69B4
Indigo #4B0082
Lavender #E6E6FA
Lime #00FF00
Maroon #800000
Navy #000080
Olive #808000
Orange #FFA500
OrangeRed #FF4500
Purple #800080
Red #FF0000
RoyalBlue #4169E1
Sienna #A0522D
Silver #C0C0C0
Teal #008080
Tomato #FF6347
Turquoise #40E0D0
Violet #EE82EE
White #FFFFFF
Yellow #FFFF00

重要提示

  1. 某些颜色名指向相同的颜色值,如 AquaCyanFuchsiaMagenta
  2. 颜色名不区分大小写,但惯例是首字母大写,如 DarkOrange
  3. 如需在CSS或HTML的style属性中使用,直接写入颜色名即可,例如:style="color: Tomato; background-color: DarkSlateGray;"

学习资源与参考

在线颜色参考与工具

  • W3School HTML颜色名完整参考:在您提供的【链接内容】中查找“HTML 颜色名”参考手册 在W3School等权威学习网站的参考手册部分,可以找到超过140种颜色名的完整、可交互的列表,包括名称、HEX值和实时预览,是必备的查询工具。
  • 在线颜色选择器与调色板工具:(基于通用知识推荐) 搜索“在线颜色选择器”可以找到大量交互式工具。这些工具不仅允许你从色盘或图片中取色,还能实时显示对应的颜色名(如果存在)、十六进制、RGB、HSL等多种格式的代码,极大提升设计效率。

本教程内容基于您提供的HTML颜色名文档进行整理与摘要。



评论(已关闭)

评论已关闭