WEB标准颜色
<style>.table { width: 100%; margin: 20px auto; border-collapse: collapse; box-shadow: 0 0 10px rgba(0,0,0,0.1); font-family: Arial, sans-serif; }
.table tr, .table th, .table td { border: 1px solid #000; }
.table th, .table td { padding: 12px 15px; text-align: left; vertical-align: middle; }
.table th { background-color: #336699; color: white; font-weight: bold; text-align: center; letter-spacing: 6px; }
.table tr:hover { color: #ff0000; }
.table td:nth-of-type(1) { text-align: center; }
</style>
<div id="papa"></div>
<script>
const colorData = [
['Black','黑色','#000000','0,0,0','-'],
['Navy','藏青','#000080','0,0,128','美国海军军服的颜色,Navy意为海军'],
['DarkBlue','深蓝','#00008B','0,0,139','-'],
['MediumBlue','中蓝','#0000CD','0,0,205','-'],
['Blue','蓝色','#0000FF','0,0,255','-'],
['DarkGreen','深绿','#006400','0,100,0','-'],
['Green','调和绿','#008000','0,128,0','视觉上的正绿色'],
['Teal','鸭翅绿','#008080','0,128,128','Teal意为绿翅鸭,一种水鸭'],
['DarkCyan','深青','#008B8B','0,139,139','-'],
['DeepSkyBlue','深天蓝','#00BFFF','0,191,255','-'],
['DarkTurquoise','深松石绿','#00CED1','0,206,209','见“Turquoise”'],
['MediumSpringGreen','中嫩绿','#00FA9A','0,250,154','-'],
['Lime','绿色','#00FF00','0,255,0','RGB颜色空间的正绿色'],
['SpringGreen','春绿','#00FF7F','0,255,127','-'],
['Cyan/Aqua','青色','#00FFFF','0,255,255','-'],
['MidNightBlue','午夜蓝','#191970','25,25,112','-'],
['DodgerBlue','湖蓝','#1E90FF','30,144,255','洛杉矶道奇棒球队队标的颜色'],
['LightSeaGreen','浅海藻绿','#20B2AA','32,178,170','-'],
['ForestGreen','森林绿','#228B22','34,139,34','-'],
['SeaGreen','海藻绿','#2E8B57','46,139,87','-'],
['DarkSlateGray','深岩灰','#2F4F4F','47,79,79','-'],
['LimeGreen','青柠绿','#32CD32','50,205,50','Lime是青柠,Lemon才是柠檬'],
['MediumSeaGreen','中海藻绿','#3CB371','60,179,113','-'],
['Turquoise','松石绿','#40E0D0','64,224,208','本意为土耳其石即绿松石,一种宝石'],
['RoyalBlue','品蓝','#4169E1','65,105,225','直译为“皇家蓝”'],
['SteelBlue','钢青','#4682B4','70,130,180','-'],
['DarkSlateBlue','深岩蓝','#483D8B','72,61,139','-'],
['MediumTurquoise','中松石绿','#48D1CC','72,209,204','见“Turquoise”'],
['Indigo','靛蓝','#4B0082','75,0,130','-'],
['DarkOliveGreen','深橄榄绿','#556B2F','85,107,47','-'],
['CadetBlue','军服蓝','#5F9EA0','95,158,160','-'],
['CornFlowerBlue','矢车菊蓝','#6495ED','100,149,237','矢车菊是德国和马其顿的国花'],
['MediumAquaMarine','中碧绿','#66CDAA','102,205,170','-'],
['DimGray','昏灰','#696969','105,105,105','是命名颜色中最深的一种灰色'],
['SlateBlue','岩蓝','#6A5ACD','106,90,205','Slate本意为“板岩”'],
['OliveDrab','橄榄绿','#6B8E23','107,142,35','-'],
['SlateGray','岩灰','#708090','112,128,144','-'],
['LightSlateGray','浅岩灰','#778899','119,136,153','-'],
['MediumSlateBlue','中岩蓝','#7B68EE','123,104,238','-'],
['LawnGreen','草坪绿','#7CFC00','124,252,0','-'],
['ChartReuse','查特酒绿','#7FFF00','127,255,0','一种药酒,诞生于17世纪的法国'],
['AquaMarine','碧绿','#7FFFD4','127,255,212','亦作“碧蓝”,但其主色调为绿色'],
['Maroon','栗色','#800000','128,0,0','-'],
['Purple','紫色','#800080','128,0,128','-'],
['Olive','橄榄色','#808000','128,128,0','-'],
['Gray','灰色','#808080','128,128,128','-'],
['SkyBlue','天蓝','#87CEEB','135,206,235','-'],
['LightSkyBlue','浅天蓝','#87CEFA','135,206,250','-'],
['BlueViolet','蓝紫色','#8A2BE2','138,43,226','即“蓝紫罗兰色”,直译名称过长'],
['DarkRed','深红','#8B0000','139,0,0','-'],
['DarkMagenta','深品红','#8B008B','139,0,139','-'],
['SaddleBrown','鞍褐','#8B4513','139,69,19','亦作“马鞍棕”,马鞍常见的颜色'],
['DarkSeaGreen','深海藻绿','#8FBC8F','143,188,143','-'],
['LightGreen','浅绿','#90EE90','144,238,144','-'],
['MediumPurple','中紫','#9370D8','147,112,219','-'],
['DarkViolet','深紫','#9400d3','148,0,211','即“深紫罗兰色”,直译名称过长'],
['PaleGreen','白绿色','#98FB98','152,251,152','-'],
['DarkOrchid','深洋兰紫','#9932CC','153,50,204','见“Orchid”'],
['YellowGreen','暗黄绿色','#9ACD32','154,205,50','注意与GreenYellow区分'],
['Sienna','土黄赭','#A0522D','160,82,45','-'],
['Brown','褐色','#A52A2A','165,42,42','亦作“棕色”'],
['DarkGray','暗灰','#A9A9A9','169,169,169','-'],
['LightBlue','浅蓝','#ADD8E6','173,216,230','-'],
['GreenYellow','黄绿色','#ADFF2F','173,255,47','请注意与YellowGreen区分'],
['PaleTurquoise','白松石绿','#AFEEEE','175,238,238','见“Turquoise”'],
['LightSteelBlue','浅钢青','#B0C4DE','176,196,222','-'],
['PowderBlue','粉末蓝','#B0E0E6','176,224,230','得名自洗衣店用来漂染衣物的物质大青'],
['FireBrick','火砖红','#B22222','178,34,34','耐火砖的颜色比普通红砖要深'],
['DarkGoldenRod','深金菊黄','#B8860B','184,134,11','见“GoldenRod”'],
['MediumOrchid','中洋兰紫','#BA55D3','186,85,211','见“Orchid”'],
['RosyBrown','玫瑰褐','#BC8F8F','188,143,143','-'],
['DarkKhaki','深卡其色','#BDB76B','189,183,107','见“Khaki”'],
['Silver','银色','#C0C0C0','192,192,192','-'],
['MediumVioletRed','中紫红','#C71585','199,21,133','“中紫罗兰红”,直译名称过长'],
['IndianRed','印度红','#CD5C5C','205,92,92','-'],
['Peru','秘鲁红','#CD853F','205,133,63','从秘鲁国树金鸡纳树中提炼的一种颜料'],
['Chocolate','巧克力色','#D2691E','210,105,30','-'],
['Tan','日晒褐','#D2B48C','210,180,140','-'],
['LightGray','亮灰','#D3D3D3','211,211,211','-'],
['PaleVioletRed','白紫红','#D87093','219,112,147','“白紫罗兰红色”的简略'],
['Thistle','蓟紫','#D8BFD8','216,191,216','菊科蓟属,多刺花卉,旧时苏格兰国花'],
['Orchid','洋兰紫','#DA70D6','218,112,214','西洋兰花某品种的颜色'],
['GoldenRod','金菊黄','#DAA520','218,165,32','一枝黄花,一种菊科花卉'],
['Crimson','绯红','#DC143C','220,20,60','较之猩红(Scarlet)蓝色分量要多些'],
['GainsBoro','庚氏灰','#DCDCDC','220,220,220','托马斯·庚斯博罗,18世纪英国画家'],
['Plum','李紫','#DDA0DD','221,160,221','Plum意为李子、梅子'],
['BurlyWood','硬木褐','#DEB887','222,184,135','-'],
['LightCyan','浅青','#E0FFFF','224,255,255','-'],
['Lavender','薰衣草紫','#E6E6FA','230,230,250','-'],
['DarkSalmon','深鲑红','#E9967A','233,150,122','见“Salmon”'],
['Violet','紫罗兰色','#EE82EE','238,130,238','-'],
['PaleGoldenRod','白金菊黄','#EEE8AA','238,232,170','见“GoldenRod”'],
['LightCoral','浅珊瑚红','#F08080','240,128,128','-'],
['Khaki','卡其色','#F0E68C','240,230,140','Khaki是一种布料的名称'],
['AliceBlue','爱丽丝蓝','#F0F8FF','240,248,255','西奥多·罗斯福长女爱丽丝·罗斯福·朗沃斯创造的时尚色'],
['HoneyDew','蜜瓜绿','#F0FFF0','240,255,240','Honeydew即白兰瓜、蜜瓜'],
['Azure','青白色','#F0FFFF','240,255,255','本为湛蓝,但在Web色中是一种浅色'],
['SandyBrown','沙褐','#F4A460','244,164,96','-'],
['Wheat','麦色','#F5DEB3','245,222,179','-'],
['Beige','米色','#F5F5DC','245,245,220','-'],
['WhiteSmoke','烟雾白','#F5F5F5','245,245,245','-'],
['MintCream','薄荷乳白','#F5FFFA','245,255,250','-'],
['GhostWhite','幽灵白','#F8F8FF','248,248,255','-'],
['Salmon','鲑红','#FA8072','250,128,114','本意为三文鱼,一种鲑科冷水鱼类'],
['AntiqueWhite','古董白','#FAEBD7','250,235,215','-'],
['Linen','亚麻色','#FAF0E6','250,240,230','-'],
['LightGoldenRodYellow','浅金菊黄','#FAFAD2','250,250,210','见“GoldenRod”'],
['OldLace','旧蕾丝白','#FDF5E6','253,245,230','-'],
['Red','红色','#FF0000','255,0,0','-'],
['Magenta/Fuchsia','洋红','#FF00FF','255,0,255','-'],
['DeepPink','深粉','#FF1493','255,20,147','-'],
['OrangeRed','橘红','#FF4500','255,69,0','-'],
['Tomato','番茄红','#FF6347','255,99,71','-'],
['HotPink','艳粉','#FF69B4','255,105,180','不是暖粉,后者应是偏黄的粉色'],
['Coral','珊瑚红','#FF7F50','255,127,80','-'],
['DarkOrange','深橙','#FF8C00','255,140,0','-'],
['LightSalmon','浅鲑红','#FFA07A','255,160,122','见“Salmon”'],
['Orange','橙色','#FFA500','255,165,0','-'],
['LightPink','浅粉','#FFB6C1','255,182,193','-'],
['Pink','粉色','#FFC0CB','255,192,203','-'],
['Gold','金色','#FFD700','255,215,0','-'],
['PeachPuff','粉扑桃色','#FFDAB9','255,218,185','Peach是桃,Puff是化妆用的粉扑'],
['NavajoWhite','土著白','#FFDEAD','255,222,173','纳瓦霍(Navajo)是北美印第安人的一支'],
['Moccasin','鹿皮色','#FFE4B5','255,228,181','Moccasin本意为鹿皮鞋'],
['Bisque','陶坯黄','#FFE4C4','255,228,196','-'],
['MistyRose','雾玫瑰红','#FFE4E1','255,228,225','薄雾玫瑰,玫瑰品种之一'],
['BlanchedAlmond','杏仁白','#FFEBCD','255,235,205','-'],
['PapayaWhip','番木瓜橙','#FFEFD5','255,239,213','本意为番木瓜(一种热带水果)汁'],
['LavenderBlush','薰衣草红','#FFF0F5','255,240,245','“薰衣草紫红色”的简略'],
['SeaShell','贝壳白','#FFF5EE','255,245,238','-'],
['CornSilk','玉米穗黄','#FFF8DC','255,248,220','-'],
['LemonChiffon','柠檬绸黄','#FFFACD','255,250,205','-'],
['FloralWhite','花卉白','#FFFAF0','255,250,240','不可简称“花白”(后者与斑白同义)'],
['Snow','雪白','#FFFAFA','255,250,250','-'],
['Yellow','黄色','#FFFF00','255,255,0','-'],
['LightYellow','浅黄','#FFFFE0','255,255,224','-'],
['Ivory','象牙白','#FFFFF0','255,255,240','-'],
['White','白色','#FFFFFF','255,255,255','-']
];
let res = `<table class="table"><tr>
<th style="width: 60px;">序号</th>
<th style="width: 120px;">颜色效果</th>
<th style="width: 120px;">英文名称</th>
<th style="width: 120px;">中文名称</th>
<th style="width: 100px;">十六进制</th>
<th style="width: 100px;">RGB</th>
<th>备注</th>
</tr>`;
colorData.forEach( (c,k) => {
res += `<tr>
<td>${k + 1}</td>
<td style="background: ${c}"></td>
<td>${c}</td>
<td>${c}</td>
<td>${c}</td>
<td>${c}</td>
<td>${c}</td>
</tr>`;
});
res += '</table>'
papa.innerHTML = res;
</script>
富有实用性的宝贵资源,谢谢醉美管理员精彩分享 klxf 发表于 2025-7-27 18:04
富有实用性的宝贵资源,谢谢醉美管理员精彩分享
谢谢友友光临! 分享超棒呢,点赞支持哈 学习了!!!! 支持!!!!前排!!!! 分享超棒呀,点赞支持啦 支持佳作,期待更多分享 分享超给力,点赞大拇指 支持分享,内容超有想法