
前端领域创作者】😜英文代码使用实例:<p style="color: red"> This is my font </p>HEX格式使用实例: <p style="color: #FFB6C1"> This is my font </p>RGB格式使用实例: <p style="color: rgb(219,112,147)"> This is my font </p>根据业务需求,我们可以使用三种格式的代码颜色;
注意:如果想要寻找你的设计稿上的颜色,可用取色器吸取颜色,在本页面ctrl+f 搜索设计稿的颜色,寻找对应的两种格式;
| 颜色样例 | 英文代码 | 中文颜色名称 | HEX格式 | RGB格式 | 十进制 |
|---|---|---|---|---|---|
| 颜色样例 | Crimson | 猩红 | #DC143C | 220,20,60 | 3943132 |
| 颜色样例 | PaleGodenrod | 灰秋麒麟 | #EEE8AA | 238,232,170 | 1510816 |
| 颜色样例 | Cornislk | 玉米色 | #FFF8DC | 255,248,220 | 2693312 |
| 颜色样例 | BrulyWood | 结实的树 | #DEB887 | 222,184,135 | 4194480 |
| 颜色样例 | Red | 纯红 | #FF0000 | 255,0,0 | 16711 680 |
| 颜色样例 | Brown | 棕色 | #A52A2A | 165,42,42 | 2763437 |
| 颜色样例 | FireBrick | 耐火砖 | #B22222 | 178,34,34 | 2237106 |
| 颜色样例 | DarkRed | 深红色 | #8B0000 | 139,0,0 | 4194443 |
| 颜色样例 | Maroon | 栗色 | #800000 | 128,0,0 | 144 |
| 颜色样例 | LightPink | 浅粉红 | #FFB6C1 | 255,182,193 | 12695295 |
| 颜色样例 | Pink | 粉红 | #FFC0CB | 255,192,203 | 13484287 |
| 颜色样例 | LavenderBlush | 脸红的淡紫色 | #FFF0F5 | 255,240,245 | 16118015 |
| 颜色样例 | PaleVioletRed | 苍白的紫罗兰红色 | #DB7093 | 219,112,147 | 9662690 |
| 颜色样例 | HotPink | 热情的粉红 | #FF69B4 | 255,105,180 | 11823615 |
| 颜色样例 | DeepPink | 深粉色 | #FF1493 | 255,20,147 | 9639167 |
| 颜色样例 | MediumVioletRed | 适中的紫罗兰红色 | #C71585 | 199,21,133 | 8721863 |
| 颜色样例 | 牡丹红 | #FE00FF | 16711935 |
| 颜色样例 | 英文代码 | 中文颜色名称 | HEX格式 | RGB格式 | 十进制 |
|---|---|---|---|---|---|
| 颜色样例 | Orchid | 兰花的紫色 | #DA70D6 | 218,112,214 | 14381274 |
| 颜色样例 | Thistle | 蓟 | #D8BFD8 | 216,191,216 | 14270424 |
| 颜色样例 | plum | 李子 | #DDA0DD | 221,160,221 | 14524644 |
| 颜色样例 | Violet | 紫罗兰 | #EE82EE | 238,130,238 | 15631086 |
| 颜色样例 | Magenta | 洋红 | #FF00FF | 255,0,255 | 16711935 |
| 颜色样例 | Fuchsia | 灯笼海棠(紫红色) | #FF00FF | 255,0,255 | 16732925 |
| 颜色样例 | DarkMagenta | 深洋红色 | #8B008B | 139,0,139 | 10813579 |
| 颜色样例 | Purple | 紫色 | #800080 | 128,0,128 | 8388751 |
| 颜色样例 | MediumOrchid | 适中的兰花紫 | #BA55D3 | 186,85,211 | 14979258 |
| 颜色样例 | DarkVoilet | 深紫罗兰色 | #9400D3 | 148,0,211 | 14680282 |
| 颜色样例 | DarkOrchid | 深兰花紫 | #9932CC | 153,50,204 | 13513369 |
| 颜色样例 | Indigo | 靛青 | #4B0082 | 75,0,130 | 8978507 |
| 颜色样例 | BlueViolet | 深紫罗兰的蓝色 | #8A2BE2 | 138,43,226 | 14822282 |
| 颜色样例 | MediumPurple | 适中的紫色 | #9370DB | 147,112,219 | 14381203 |
| 颜色样例 | MediumSlateBlue | 适中的板岩暗蓝灰色 | #7B68EE | 123,104,238 | 15689851 |
| 颜色样例 | SlateBlue | 板岩暗蓝灰色 | #6A5ACD | 106,90,205 | 13525354 |
| 颜色样例 | DarkSlateBlue | 深岩暗蓝灰色 | #483D8B | 72,61,139 | 9594208 |
| 颜色样例 | Lavender | 熏衣草花的淡紫色 | #E6E6FA | 230,230,250 | 16443110 |
| 颜色样例 | GhostWhite | 幽灵的白色 | #F8F8FF | 248,248,255 | 16775416 |
| 颜色样例 | 英文代码 | 中文颜色名称 | HEX格式 | RGB格式 | 十进制 |
|---|---|---|---|---|---|
| 颜色样例 | Blue | 纯蓝 | #0000FF | 0,0,255 | 255 |
| 颜色样例 | MediumBlue | 适中的蓝色 | #0000CD | 0,0,205 | 13434880 |
| 颜色样例 | MidnightBlue | 午夜的蓝色 | #191970 | 25,25,112 | 7346457 |
| 颜色样例 | DarkBlue | 深蓝色 | #00008B | 0,0,139 | 9585472 |
| 颜色样例 | Navy | 海军蓝 | #000080 | 0,0,128 | 9708544 |
| 颜色样例 | RoyalBlue | 皇军蓝 | #4169E1 | 65,105,225 | 14842201 |
| 颜色样例 | CornflowerBlue | 矢车菊的蓝色 | #6495ED | 100,149,237 | 15636324 |
| 颜色样例 | LightSteelBlue | 淡钢蓝 | #B0C4DE | 176,196,222 | 14665396 |
| 颜色样例 | LightSlateGray | 浅石板灰 | #778899 | 119,136,153 | 10259063 |
| 颜色样例 | SlateGray | 石板灰 | #708090 | 112,128,144 | 9863280 |
| 颜色样例 | DoderBlue | 道奇蓝 | #1E90FF | 30,144,255 | 2744528 |
| 颜色样例 | AliceBlue | 爱丽丝蓝 | #F0F8FF | 240,248,255 | 16775408 |
| 颜色样例 | SteelBlue | 钢蓝 | #4682B4 | 70,130,180 | 12616262 |
| 颜色样例 | LightSkyBlue | 淡蓝色 | #87CEFA | 135,206,250 | 16437390 |
| 颜色样例 | SkyBlue | 天蓝色 | #87CEEB | 135,206,235 | 15519623 |
| 颜色样例 | DeepSkyBlue | 深天蓝 | #00BFFF | 0,191,255 | 16630528 |
| 颜色样例 | LightBLue | 淡蓝 | #ADD8E6 | 173,216,230 | 15194802 |
| 颜色样例 | PowDerBlue | 火药蓝 | #B0E0E6 | 176,224,230 | 15196596 |
| 颜色样例 | CadetBlue | 军校蓝 | #5F9EA0 | 95,158,160 | 10919519 |
| 颜色样例 | Azure | 蔚蓝色 | #F0FFFF | 240,255,255 | 16514545 |
| 颜色样例 | LightCyan | 淡青色 | #E1FFFF | 225,255,255 | 16777185 |
| 颜色样例 | PaleTurquoise | 苍白的绿宝石 | #AFEEEE | 175,238,238 | 15658676 |
| 颜色样例 | Cyan | 青色 | #00FFFF | 82,255,255 | 65535 |
| 颜色样例 | Aqua | 水绿色 | #00FFFF | 0,255,255 | 16580096 |
| 颜色样例 | DarkTurquoise | 深绿宝石 | #00CED1 | 0,206,209 | 13815874 |
| 颜色样例 | DarkSlateGray | 深石板灰 | #2F4F4F | 47,79,79 | 6645589 |
| 颜色样例 | DarkCyan | 深青色 | #008B8B | 0,139,139 | 9603840 |
| 颜色样例 | Teal | 水鸭色 | #008080 | 0,128,128 | 8684032 |
| 颜色样例 | MediumTurquoise | 适中的绿宝石 | #48D1CC | 72,209,204 | 13554528 |
| 颜色样例 | LightSeaGreen | 浅海洋绿 | #20B2AA | 32,178,170 | 11973671 |
| 颜色样例 | Turquoise | 绿宝石 | #40E0D0 | 64,224,208 | 13754432 |
| 颜色样例 | 海蓝 | #40E0D0 | 155,218,145 | 7396243 | |
| 颜色样例 | 蓝紫色 | #9D5F9D | 157,95,157 | 10313629 |
| 颜色样例 | 英文代码 | 中文颜色名称 | HEX格式 | RGB格式 | 十进制 |
|---|---|---|---|---|---|
| 颜色样例 | Auqamarin | 绿玉\碧绿色 | #7FFFAA | 127,255,170 | 41135 |
| 颜色样例 | MediumAquamarine | 适中的碧绿色 | #00FA9A | 0,250,154 | 11521908 |
| 颜色样例 | MediumSpringGreen | 适中的春天的绿色 | #F5FFFA | 245,255,250 | 10156544 |
| 颜色样例 | MintCream | 薄荷奶油 | #00FF7F | 0,255,127 | 16449525 |
| 颜色样例 | SpringGreen | 春天的绿色 | #3CB371 | 60,179,113 | 10288896 |
| 颜色样例 | SeaGreen | 海洋绿 | #2E8B57 | 46,139,87 | 6393134 |
| 颜色样例 | Honeydew | 蜂蜜 | #F0FFF0 | 240,255,240 | 15794160 |
| 颜色样例 | LightGreen | 淡绿色 | #90EE90 | 144,238,144 | 11005584 |
| 颜色样例 | PaleGreen | 苍白的绿色 | #98FB98 | 152,251,152 | 11533208 |
| 颜色样例 | DarkSeaGreen | 深海洋绿 | #8FBC8F | 143,188,143 | 9879183 |
| 颜色样例 | LimeGreen | 酸橙绿 | #32CD32 | 50,205,50 | 65280 |
| 颜色样例 | Lime | 酸橙色 | #00FF00 | 0,255,0 | 65359 |
| 颜色样例 | ForestGreen | 森林绿 | #228B22 | 34,139,34 | 8817442 |
| 颜色样例 | Green | 纯绿 | #008000 | 0,128,0 | 4229440 |
| 颜色样例 | DarkGreen | 深绿色 | #006400 | 0,100,0 | 2713088 |
| 颜色样例 | Chartreuse | 查特酒绿 | #7FFF00 | 127,255,0 | 4259722 |
| 颜色样例 | LawnGreen | 草坪绿 | #7CFC00 | 124,252,0 | 64636 |
| 颜色样例 | GreenYellow | 绿黄色 | #ADFF2F | 173,255,47 | 4390829 |
| 颜色样例 | OliveDrab | 橄榄土褐色 | #556B2F | 85,107,47 | 8359531 |
| 颜色样例 | Beige | 米色(浅褐色) | #6B8E23 | 107,142,35 | 14480886 |
| 颜色样例 | LightGoldenrodYellow | 浅秋麒麟黄 | #FAFAD2 | 250,250,210 | 13827068 |
| 颜色样例 | Ivory | 象牙 | #FFFFF0 | 255,255,240 | 15794175 |
| 颜色样例 | 英文代码 | 中文颜色名称 | HEX格式 | RGB格式 | 十进制 |
|---|---|---|---|---|---|
| 颜色样例 | LightYellow | 浅黄色 | #FFFFE0 | 255,255,224 | 14811135 |
| 颜色样例 | Yellow | 纯黄 | #FFFF00 | 255,255,0 | 16776960 |
| 颜色样例 | Olive | 橄榄 | #808000 | 128,128,0 | 7569536 |
| 颜色样例 | DarkKhaki | 深卡其布 | #BDB76B | 189,183,107 | 7059389 |
| 颜色样例 | LemonChiffon | 柠檬薄纱 | #FFFACD | 255,250,205 | 13630207 |
| 颜色样例 | Khaki | 卡其布 | #F0E68C | 240,230,140 | 9234160 |
| 颜色样例 | Gold | 金 | #FFD700 | 255,215,0 | 4381183 |
| 颜色样例 | GoldEnrod | 秋麒麟 | #DAA520 | 218,165,32 | 2139610 |
| 颜色样例 | GoldEnrod | 黄铜色 | #DAA520 | 218,165,32 | 6007480 |
| 颜色样例 | FloralWhite | 花的白色 | #FFFAF0 | 255,250,240 | 15989503 |
| 颜色样例 | OldLace | 老饰带 | #FDF5E6 | 253,245,230 | 15201789 |
| 颜色样例 | Wheat | 小麦色 | #F5DEB3 | 245,222,179 | 12050421 |
| 颜色样例 | Moccasin | 鹿皮鞋 | #FFE4B5 | 255,228,181 | 11920639 |
| 颜色样例 | Orange | 橙色 | #FFA500 | 255,165,0 | 42494 |
| 颜色样例 | PapayaWhip | 番木瓜 | #FFEFD5 | 255,239,213 | 14086399 |
| 颜色样例 | BlanchedAlmond | 漂白的杏仁 | #FFEBCD | 255,235,205 | 13561086 |
| 颜色样例 | NavajoWhite | Navajo白 | #FFDEAD | 255,222,173 | 11394815 |
| 颜色样例 | AntiqueWhite | 古代的白色 | #FAEBD7 | 250,235,215 | 14216442 |
| 颜色样例 | Tan | 晒黑 | #D2B48C | 210,180,140 | 9221330 |
| 颜色样例 | Bisque | (浓汤)乳脂,番茄等 | #FFE4C4 | 255,228,196 | 12903679 |
| 颜色样例 | DarkOrange | 深橙色 | #FF8C00 | 255,140,0 | 36607 |
| 颜色样例 | Linen | 亚麻布 | #FAF0E6 | 250,240,230 | 15134970 |
| 颜色样例 | Peru | 秘鲁 | #CD853F | 205,133,63 | 6587853 |
| 颜色样例 | PeachPuff | 桃色 | #FFDAB9 | 255,218,185 | 12442367 |
| 颜色样例 | SandyBrown | 沙棕色 | #F4A460 | 244,164,96 | 6333686 |
| 颜色样例 | Chocolate | 巧克力 | #D2691E | 210,105,30 | 6042391 |
| 颜色样例 | SaddleBrown | 马鞍棕色 | #8B4513 | 139,69,19 | 2704779 |
| 颜色样例 | SeaShell | 海贝壳 | #FFF5EE | 255,245,238 | 15660543 |
| 颜色样例 | Sienna | 黄土赭色 | #A0522D | 160,82,45 | 3822240 |
| 颜色样例 | LightSalmon | 浅鲜肉(鲑鱼)色 | #FFA07A | 255,160,122 | 8824318 |
| 颜色样例 | Coral | 珊瑚 | #FF7F50 | 255,127,80 | 5275647 |
| 颜色样例 | OrangeRed | 橙红色 | #FF4500 | 255,69,0 | 4212223 |
| 颜色样例 | DarkSalmon | 深鲜肉(鲑鱼)色 | #E9967A | 233,150,122 | 8034025 |
| 颜色样例 | Tomato | 番茄 | #FF6347 | 255,99,71 | 5071871 |
| 颜色样例 | MistyRose | 薄雾玫瑰 | #FFE4E1 | 255,228,225 | 14870015 |
| 颜色样例 | Salmon | 鲜肉(鲑鱼)色 | #FA8072 | 250,128,114 | 7766778 |
| 颜色样例 | Snow | 雪 | #FFFAFA | 255,250,250 | 16448255 |
| 颜色样例 | LightCoral | 淡珊瑚色 | #F08080 | 240,128,128 | 8421616 |
| 颜色样例 | RosyBrown | 玫瑰棕色 | #BC8F8F | 188,143,143 | 9869502 |
| 颜色样例 | IndianRed | 印度红 | #CD5C5C | 205,92,92 | 6053069 |
| 颜色样例 | 英文代码 | 中文颜色名称 | HEX格式 | RGB格式 | 十进制 |
|---|---|---|---|---|---|
| 颜色样例 | White | 纯白 | #FFFFFF | 255,255,255 | 16777215 |
| 颜色样例 | WhiteSmoke | 白烟 | #F5F5F5 | 245,245,245 | 16119285 |
| 颜色样例 | Gainsboro | Gainsboro | #DCDCDC | 220,220,220 | 14474460 |
| 颜色样例 | LightGrey | 浅灰色 | #D3D3D3 | 211,211,211 | 14341588 |
| 颜色样例 | Silver | 银白色 | #C0C0C0 | 192,192,192 | 13026242 |
| 颜色样例 | DarkGray | 深灰色 | #A9A9A9 | 169,169,169 | 11119017 |
| 颜色样例 | Gray | 灰色 | #808080 | 128,128,128 | 8422536 |
| DimGray | DimGray | 暗淡的灰色 | #696969 | 105,105,105 | 7764342 |
| 颜色样例 | Black | 纯黑 | #000000 | 0,0,0 | 0 |
感谢大家阅读到结尾,本次的文章就分享到这里,总结了【前端开发:颜色代码速查表【英文颜色、HEX格式、RGB格式】】,希望可以帮到大家,谢谢。
如果您觉得这篇文章有帮助到您的的话不妨【关注+点赞+收藏+评论+转发 】支持一下哟~~😛您的支持就是我更新的最大动力。👇👇👇👇👇👇

🛩往期精彩:
我想将html转换为纯文本。不过,我不想只删除标签,我想智能地保留尽可能多的格式。为插入换行符标签,检测段落并格式化它们等。输入非常简单,通常是格式良好的html(不是整个文档,只是一堆内容,通常没有anchor或图像)。我可以将几个正则表达式放在一起,让我达到80%,但我认为可能有一些现有的解决方案更智能。 最佳答案 首先,不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案,它会随着HTML的变化而崩溃,或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h
如何在buildr项目中使用Ruby?我在很多不同的项目中使用过Ruby、JRuby、Java和Clojure。我目前正在使用我的标准Ruby开发一个模拟应用程序,我想尝试使用Clojure后端(我确实喜欢功能代码)以及JRubygui和测试套件。我还可以看到在未来的不同项目中使用Scala作为后端。我想我要为我的项目尝试一下buildr(http://buildr.apache.org/),但我注意到buildr似乎没有设置为在项目中使用JRuby代码本身!这看起来有点傻,因为该工具旨在统一通用的JVM语言并且是在ruby中构建的。除了将输出的jar包含在一个独特的、仅限ruby
在rails源中:https://github.com/rails/rails/blob/master/activesupport/lib/active_support/lazy_load_hooks.rb可以看到以下内容@load_hooks=Hash.new{|h,k|h[k]=[]}在IRB中,它只是初始化一个空哈希。和做有什么区别@load_hooks=Hash.new 最佳答案 查看rubydocumentationforHashnew→new_hashclicktotogglesourcenew(obj)→new_has
我正在编写一个包含C扩展的gem。通常当我写一个gem时,我会遵循TDD的过程,我会写一个失败的规范,然后处理代码直到它通过,等等......在“ext/mygem/mygem.c”中我的C扩展和在gemspec的“扩展”中配置的有效extconf.rb,如何运行我的规范并仍然加载我的C扩展?当我更改C代码时,我需要采取哪些步骤来重新编译代码?这可能是个愚蠢的问题,但是从我的gem的开发源代码树中输入“bundleinstall”不会构建任何native扩展。当我手动运行rubyext/mygem/extconf.rb时,我确实得到了一个Makefile(在整个项目的根目录中),然后当
我想在一个没有Sass引擎的类中使用Sass颜色函数。我已经在项目中使用了sassgem,所以我认为搭载会像以下一样简单:classRectangleincludeSass::Script::FunctionsdefcolorSass::Script::Color.new([0x82,0x39,0x06])enddefrender#hamlengineexecutedwithcontextofself#sothatwithintemlateicouldcall#%stop{offset:'0%',stop:{color:lighten(color)}}endend更新:参见上面的#re
我已经在Sinatra上创建了应用程序,它代表了一个简单的API。我想在生产和开发上进行部署。我想在部署时选择,是开发还是生产,一些方法的逻辑应该改变,这取决于部署类型。是否有任何想法,如何完成以及解决此问题的一些示例。例子:我有代码get'/api/test'doreturn"Itisdev"end但是在部署到生产环境之后我想在运行/api/test之后看到ItisPROD如何实现? 最佳答案 根据SinatraDocumentation:EnvironmentscanbesetthroughtheRACK_ENVenvironm
我的主要目标是能够完全理解我正在使用的库/gem。我尝试在Github上从头到尾阅读源代码,但这真的很难。我认为更有趣、更温和的踏脚石就是在使用时阅读每个库/gem方法的源代码。例如,我想知道RubyonRails中的redirect_to方法是如何工作的:如何查找redirect_to方法的源代码?我知道在pry中我可以执行类似show-methodmethod的操作,但我如何才能对Rails框架中的方法执行此操作?您对我如何更好地理解Gem及其API有什么建议吗?仅仅阅读源代码似乎真的很难,尤其是对于框架。谢谢! 最佳答案 Ru
我们的git存储库中目前有一个Gemfile。但是,有一个gem我只在我的环境中本地使用(我的团队不使用它)。为了使用它,我必须将它添加到我们的Gemfile中,但每次我checkout到我们的master/dev主分支时,由于与跟踪的gemfile冲突,我必须删除它。我想要的是类似Gemfile.local的东西,它将继承从Gemfile导入的gems,但也允许在那里导入新的gems以供使用只有我的机器。此文件将在.gitignore中被忽略。这可能吗? 最佳答案 设置BUNDLE_GEMFILE环境变量:BUNDLE_GEMFI
我的假设是moduleAmoduleBendend和moduleA::Bend是一样的。我能够从thisblog找到解决方案,thisSOthread和andthisSOthread.为什么以及什么时候应该更喜欢紧凑语法A::B而不是另一个,因为它显然有一个缺点?我有一种直觉,它可能与性能有关,因为在更多命名空间中查找常量需要更多计算。但是我无法通过对普通类进行基准测试来验证这一点。 最佳答案 这两种写作方法经常被混淆。首先要说的是,据我所知,没有可衡量的性能差异。(在下面的书面示例中不断查找)最明显的区别,可能也是最著名的,是你的
这个问题在这里已经有了答案:Railsformattingdate(4个答案)关闭4年前。我想格式化Time.Now函数以显示YYYY-MM-DDHH:MM:SS而不是:“2018-03-0909:47:19+0000”该函数需要放在时间中.现在功能。require‘roo’require‘roo-xls’require‘byebug’file_name=ARGV.first||“Template.xlsx”excel_file=Roo::Spreadsheet.open(“./#{file_name}“,extension::xlsx)xml=Nokogiri::XML::Build