Sở hữu bảng mã màu CSS chuẩn, bạn sẽ tự tin hơn lúc thiết kế, lập trình web, bởi màu sắc là một phần ko thể thiếu trong thế giới Internet. Ở bài viết này, Quantrimang.com xin giới thiệu cho bạn những bảng mã màu đẹp và thông dụng nhất, tất nhiên mã hex để những bạn tiện tiêu dùng.
Công cụ lđó mã màu trên Quantrimang.com
Bạn chỉ cần thay đổi thanh trượt và chấm màu để đạt được màu như ý và nhấn vào Sao chép để lđó mã màu mình cần.
Bảng màu CSS sở hữu tên
Danh sách dưới đây sở hữu khoảng hơn 140 màu sắc sở hữu tên được tất cả những trình duyệt tư vấn trong thiết kế website. Chúng tôi chia nhóm theo sắc để bạn dễ dàng tìm kiếm màu mình muốn.
Màu sắc sắp màu Hồng (Pink)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Pink |
#FFC0CB |
|
LightPink |
#FFB6C1 |
|
HotPink |
#FF69B4 |
|
DeepPink |
#FF1493 |
|
PaleVioletRed |
#DB7093 |
|
MediumVioletRed |
#C71585 |
|
Màu sắc sắp màu Tím (Purple)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Lavender |
#E6E6FA |
|
Thistle |
#D8BFD8 |
|
Plum |
#DDA0DD |
|
Orchid |
#DA70D6 |
|
Violet |
#EE82EE |
|
Fuchsia/Magenta |
#FF00FF |
|
MediumOrchid |
#BA55D3 |
|
DarkOrchid |
#9932CC |
|
DarkViolet |
#9400D3 |
|
BlueViolet |
#8A2BE2 |
|
DarkMagenta |
#8B008B |
|
Purple |
#800080 |
|
MediumPurple |
#9370DB |
|
MediumSlateBlue |
#7B68EE |
|
SlateBlue |
#6A5ACD |
|
DarkSlateBlue |
#483D8B |
|
RebeccaPurple |
#663399 |
|
Indigo |
#4B0082 |
|
Màu sắc sắp màu Đỏ (Red)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
LightSalmon |
#FFA07A |
|
Salmon |
#FA8072 |
|
DarkSalmon |
#E9967A |
|
LightCoral |
#F08080 |
|
IndianRed |
#CD5C5C |
|
Crimson |
#DC143C |
|
Red |
#FF0000 |
|
FireBrick |
#B22222 |
|
DarkRed |
#8B0000 |
|
Màu sắc sắp màu Cam (Orange)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Orange |
#FFA500 |
|
DarkOrange |
#FF8C00 |
|
Coral |
#FF7F50 |
|
Tomato |
#FF6347 |
|
OrangeRed |
#FF4500 |
|
Màu sắc sắp màu Vàng (Yellow)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Gold |
#FFD700 |
|
Yellow |
#FFFF00 |
|
LightYellow |
#FFFFE0 |
|
LemonChiffon |
#FFFACD |
|
LightGoldenRodYellow |
#FAFAD2 |
|
PapayaWhip |
#FFEFD5 |
|
Moccasin |
#FFE4B5 |
|
PeachPuff |
#FFDAB9 |
|
PaleGoldenRod |
#EEE8AA |
|
Khaki |
#F0E68C |
|
DarkKhaki |
#BDB76B |
|
Màu sắc sắp màu Xanh lá cây (Green)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
GreenYellow |
#ADFF2F |
|
Chartreuse |
#7FFF00 |
|
LawnGreen |
#7CFC00 |
|
Lime |
#00FF00 |
|
LimeGreen |
#32CD32 |
|
PaleGreen |
#98FB98 |
|
LightGreen |
#90EE90 |
|
MediumSpringGreen |
#00FA9A |
|
SpringGreen |
#00FF7F |
|
MediumSeaGreen |
#3CB371 |
|
SeaGreen |
#2E8B57 |
|
ForestGreen |
#228B22 |
|
Green |
#008000 |
|
DarkGreen |
#006400 |
|
YellowGreen |
#9ACD32 |
|
OliveDrab |
#6B8E23 |
|
DarkOliveGreen |
#556B2F |
|
MediumAquaMarine |
#66CDAA |
|
DarkSeaGreen |
#8FBC8F |
|
LightSeaGreen |
#20B2AA |
|
DarkCyan |
#008B8B |
|
Teal |
#008080 |
|
Màu sắc sắp màu Xanh Cyan (Cyan)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Aqua |
#00FFFF |
|
Cyan |
#00FFFF |
|
LightCyan |
#E0FFFF |
|
PaleTurquoise |
#AFEEEE |
|
Aquamarine |
#7FFFD4 |
|
Turquoise |
#40E0D0 |
|
MediumTurquoise |
#48D1CC |
|
DarkTurquoise |
#00CED1 |
|
Màu sắc sắp màu Xanh da trời (Blue)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
CadetBlue |
#5F9EA0 |
|
SteelBlue |
#4682B4 |
|
LightSteelBlue |
#B0C4DE |
|
LightBlue |
#ADD8E6 |
|
PowderBlue |
#B0E0E6 |
|
LightSkyBlue |
#87CEFA |
|
SkyBlue |
#87CEEB |
|
CornflowerBlue |
#6495ED |
|
DeepSkyBlue |
#00BFFF |
|
DodgerBlue |
#1E90FF |
|
RoyalBlue |
#4169E1 |
|
Blue |
#0000FF |
|
MediumBlue |
#0000CD |
|
DarkBlue |
#00008B |
|
Navy |
#000080 |
|
MidnightBlue |
#191970 |
|
Màu sắc sắp màu Nâu (Brown)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Cornsilk |
#FFF8DC |
|
BlanchedAlmond |
#FFEBCD |
|
Bisque |
#FFE4C4 |
|
NavajoWhite |
#FFDEAD |
|
Wheat |
#F5DEB3 |
|
BurlyWood |
#DEB887 |
|
Tan |
#D2B48C |
|
RosyBrown |
#BC8F8F |
|
SandyBrown |
#F4A460 |
|
GoldenRod |
#DAA520 |
|
DarkGoldenRod |
#B8860B |
|
Peru |
#CD853F |
|
Chocolate |
#D2691E |
|
Olive |
#808000 |
|
SaddleBrown |
#8B4513 |
|
Sienna |
#A0522D |
|
Brown |
#A52A2A |
|
Maroon |
#800000 |
|
Màu sắc sắp màu Trắng (White)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
White |
#FFFFFF |
|
Snow |
#FFFAFA |
|
HoneyDew |
#F0FFF0 |
|
MintCream |
#F5FFFA |
|
Azure |
#F0FFFF |
|
AliceBlue |
#F0F8FF |
|
GhostWhite |
#F8F8FF |
|
WhiteSmoke |
#F5F5F5 |
|
SeaShell |
#FFF5EE |
|
Beige |
#F5F5DC |
|
OldLace |
#FDF5E6 |
|
FloralWhite |
#FFFAF0 |
|
Ivory |
#FFFFF0 |
|
AntiqueWhite |
#FAEBD7 |
|
Linen |
#FAF0E6 |
|
LavenderBlush |
#FFF0F5 |
|
MistyRose |
#FFE4E1 |
|
Màu sắc sắp màu Xám (Grey)
TÊN MÀU |
MÃ HEX |
MÀU HIỂN THỊ |
Gainsboro |
#DCDCDC |
|
LightGray |
#D3D3D3 |
|
Silver |
#C0C0C0 |
|
DarkGray |
#A9A9A9 |
|
DimGray |
#696969 |
|
Gray |
#808080 |
|
LightSlateGray |
#778899 |
|
SlateGray |
#708090 |
|
DarkSlateGray |
#2F4F4F |
|
Black |
#000000 |
|
Bảng màu theo sắc thái
Sắc Đen – Xám
Gray Shades |
HEX |
RGB |
HTML Black |
#000000 |
rgb(0,0,0) |
|
#080808 |
rgb(8,8,8) |
|
#101010 |
rgb(16,16,16) |
|
#181818 |
rgb(24,24,24) |
|
#202020 |
rgb(32,32,32) |
|
#282828 |
rgb(40,40,40) |
|
#303030 |
rgb(48,48,48) |
|
#383838 |
rgb(56,56,56) |
|
#404040 |
rgb(64,64,64) |
|
#484848 |
rgb(72,72,72) |
|
#505050 |
rgb(80,80,80) |
|
#585858 |
rgb(88,88,88) |
|
#606060 |
rgb(96,96,96) |
|
#686868 |
rgb(104,104,104) |
|
#696969 |
rgb(105,105,105) |
|
#707070 |
rgb(112,112,112) |
|
#787878 |
rgb(120,120,120) |
HTML Gray |
#808080 |
rgb(128,128,128) |
|
#888888 |
rgb(136,136,136) |
|
#909090 |
rgb(144,144,144) |
|
#989898 |
rgb(152,152,152) |
|
#A0A0A0 |
rgb(160,160,160) |
|
#A8A8A8 |
rgb(168,168,168) |
HTML DarkGray !!! |
#A9A9A9 |
rgb(169,169,169) |
|
#B0B0B0 |
rgb(176,176,176) |
|
#B8B8B8 |
rgb(184,184,184) |
X11 Gray |
#BEBEBE |
rgb(190,190,190) |
HTML Silver |
#C0C0C0 |
rgb(192,192,192) |
|
#C8C8C8 |
rgb(200,200,200) |
|
#D0D0D0 |
rgb(208,208,208) |
HTML LightGray |
#D3D3D3 |
rgb(211,211,211) |
|
#D8D8D8 |
rgb(216,216,216) |
HTML Gainsboro |
#DCDCDC |
rgb(220,220,220) |
|
#E0E0E0 |
rgb(224,224,224) |
|
#E8E8E8 |
rgb(232,232,232) |
|
#F0F0F0 |
rgb(240,240,240) |
HTML WhiteSmoke |
#F5F5F5 |
rgb(245,245,245) |
|
#F8F8F8 |
rgb(248,248,248) |
HTML White |
#FFFFFF |
rgb(255,255,255) |
Có một điều bất thường trong bảng trên là HTML Gray tối hơn DarkGray.
Lý do của việc này là do tên màu của HTML/CSS được kế thừa từ tiêu chuẩn X11. Tuy nhiên, HTML/CSS thì xác định màu xám (gray) nằm ở thang (128,128,128) còn X11 thì xác định ở vị trí (190,190,190), sắp với màu bạc hơn. Bạn chỉ cần lưu ý việc này nếu sử dụng tên của màu sắc vào thiết kế của mình.
Sắc Đỏ
Red Light |
HEX |
RGB |
|
#000000 |
rgb(0,0,0) |
|
#080000 |
rgb(8,0,0) |
|
#100000 |
rgb(16,0,0) |
|
#180000 |
rgb(24,0,0) |
|
#200000 |
rgb(32,0,0) |
|
#280000 |
rgb(40,0,0) |
|
#300000 |
rgb(48,0,0) |
|
#380000 |
rgb(56,0,0) |
|
#400000 |
rgb(64,0,0) |
|
#480000 |
rgb(72,0,0) |
|
#500000 |
rgb(80,0,0) |
|
#580000 |
rgb(88,0,0) |
|
#600000 |
rgb(96,0,0) |
|
#680000 |
rgb(104,0,0) |
|
#700000 |
rgb(112,0,0) |
|
#780000 |
rgb(120,0,0) |
|
#800000 |
rgb(128,0,0) |
|
#880000 |
rgb(136,0,0) |
|
#900000 |
rgb(144,0,0) |
|
#980000 |
rgb(152,0,0) |
|
#A00000 |
rgb(160,0,0) |
|
#A80000 |
rgb(168,0,0) |
|
#B00000 |
rgb(176,0,0) |
|
#B80000 |
rgb(184,0,0) |
|
#C00000 |
rgb(192,0,0) |
|
#C80000 |
rgb(200,0,0) |
|
#D00000 |
rgb(208,0,0) |
|
#D80000 |
rgb(216,0,0) |
|
#E00000 |
rgb(224,0,0) |
|
#E80000 |
rgb(232,0,0) |
|
#F00000 |
rgb(240,0,0) |
|
#F80000 |
rgb(248,0,0) |
|
#FF0000 |
rgb(255,0,0) |
Web Safe Colors – Bảng màu “an toàn” dành cho Website
Nhiều năm trước đây, những máy tính chỉ tư vấn được tối đa 256 màu khác nhau, vì vậy danh sách 216 “Màu an toàn cho web” – Web Safe Colors được đề xuất làm tiêu chuẩn cho mọi thiết kế web lúc bđó giờ.
Nhưng hiện nay điều này ko còn trọng yếu, vì hầu hết những máy tính đều sở hữu thể hiển thị hàng triệu màu khác nhau.
Quantrimang vẫn sẽ giới thiệu ở đây để bạn biết thêm nhé.
000000 |
000033 |
000066 |
000099 |
0000CC |
0000FF |
003300 |
003333 |
003366 |
003399 |
0033CC |
0033FF |
006600 |
006633 |
006666 |
006699 |
0066CC |
0066FF |
009900 |
009933 |
009966 |
009999 |
0099CC |
0099FF |
00CC00 |
00CC33 |
00CC66 |
00CC99 |
00CCCC |
00CCFF |
00FF00 |
00FF33 |
00FF66 |
00FF99 |
00FFCC |
00FFFF |
330000 |
330033 |
330066 |
330099 |
3300CC |
3300FF |
333300 |
333333 |
333366 |
333399 |
3333CC |
3333FF |
336600 |
336633 |
336666 |
336699 |
3366CC |
3366FF |
339900 |
339933 |
339966 |
339999 |
3399CC |
3399FF |
33CC00 |
33CC33 |
33CC66 |
33CC99 |
33CCCC |
33CCFF |
33FF00 |
33FF33 |
33FF66 |
33FF99 |
33FFCC |
33FFFF |
660000 |
660033 |
660066 |
660099 |
6600CC |
6600FF |
663300 |
663333 |
663366 |
663399 |
6633CC |
6633FF |
666600 |
666633 |
666666 |
666699 |
6666CC |
6666FF |
669900 |
669933 |
669966 |
669999 |
6699CC |
6699FF |
66CC00 |
66CC33 |
66CC66 |
66CC99 |
66CCCC |
66CCFF |
66FF00 |
66FF33 |
66FF66 |
66FF99 |
66FFCC |
66FFFF |
990000 |
990033 |
990066 |
990099 |
9900CC |
9900FF |
993300 |
993333 |
993366 |
993399 |
9933CC |
9933FF |
996600 |
996633 |
996666 |
996699 |
9966CC |
9966FF |
999900 |
999933 |
999966 |
999999 |
9999CC |
9999FF |
99CC00 |
99CC33 |
99CC66 |
99CC99 |
99CCCC |
99CCFF |
99FF00 |
99FF33 |
99FF66 |
99FF99 |
99FFCC |
99FFFF |
CC0000 |
CC0033 |
CC0066 |
CC0099 |
CC00CC |
CC00FF |
CC3300 |
CC3333 |
CC3366 |
CC3399 |
CC33CC |
CC33FF |
CC6600 |
CC6633 |
CC6666 |
CC6699 |
CC66CC |
CC66FF |
CC9900 |
CC9933 |
CC9966 |
CC9999 |
CC99CC |
CC99FF |
CCCC00 |
CCCC33 |
CCCC66 |
CCCC99 |
CCCCCC |
CCCCFF |
CCFF00 |
CCFF33 |
CCFF66 |
CCFF99 |
CCFFCC |
CCFFFF |
FF0000 |
FF0033 |
FF0066 |
FF0099 |
FF00CC |
FF00FF |
FF3300 |
FF3333 |
FF3366 |
FF3399 |
FF33CC |
FF33FF |
FF6600 |
FF6633 |
FF6666 |
FF6699 |
FF66CC |
FF66FF |
FF9900 |
FF9933 |
FF9966 |
FF9999 |
FF99CC |
FF99FF |
FFCC00 |
FFCC33 |
FFCC66 |
FFCC99 |
FFCCCC |
FFCCFF |
FFFF00 |
FFFF33 |
FFFF66 |
FFFF99 |
FFFFCC |
FFFFFF |
Hi vọng bảng tổng hợp mã màu này sẽ giúp ích cho bạn trong quá trình làm việc và học tập.
Các bạn đang xem tin tức tại Tin 24h 24h – Chúc những bạn một ngày vui vẻ
Từ khóa: Bảng mã màu CSS, code color chuẩn trong thiết kế website