Bảng mã màu HTML
Như các bạn đã biết, trong thiết kế website mã màu rất quan trọng. Chọn đúng mã màu là đã thành công một nửa rồi. Và trong bài viết này BlogIT sẽ giới thiệu cho bạn các bảng mã màu trong HTML, đã được sắp xếp theo từng mục đích và nhóm màu khác nhau.
Bảng màu thường dùng
#EEEEEE | #DDDDDD | #CCCCCC | #BBBBBB | #AAAAAA | #999999 |
#888888 | #777777 | #666666 | #555555 | #444444 | #333333 |
#222222 | #111111 | #000000 | #FF0000 | #EE0000 | #DD0000 |
#CC0000 | #BB0000 | #AA0000 | #990000 | #880000 | #770000 |
#660000 | #550000 | #440000 | #330000 | #220000 | #110000 |
#FFFFFF | #FFFFCC | #FFFF99 | #FFFF66 | #FFFF33 | #FFFF00 |
#CCFFFF | #CCFFCC | #CCFF99 | #CCFF66 | #CCFF33 | #CCFF00 |
#99FFFF | #99FFCC | #99FF99 | #99FF66 | #99FF33 | #99FF00 |
#66FFFF | #66FFCC | #66FF99 | #66FF66 | #66FF33 | #66FF00 |
#33FFFF | #33FFCC | #33FF99 | #33FF66 | #33FF33 | #33FF00 |
#00FFFF | #00FFCC | #00FF99 | #00FF66 | #00FF33 | #00FF00 |
#FFCCFF | #FFCCCC | #FFCC99 | #FFCC66 | #FFCC33 | #FFCC00 |
#CCCCFF | #CCCCCC | #CCCC99 | #CCCC66 | #CCCC33 | #CCCC00 |
#99CCFF | #99CCCC | #99CC99 | #99CC66 | #99CC33 | #99CC00 |
#66CCFF | #66CCCC | #66CC99 | #66CC66 | #66CC33 | #66CC00 |
#33CCFF | #33CCCC | #33CC99 | #33CC66 | #33CC33 | #33CC00 |
#00CCFF | #00CCCC | #33CC66 | #33CC33 | #00CC99 | #00CC66 |
#00CC33 | #00CC00 | #FF99FF | #FF99CC | #FF9999 | #FF9966 |
#FF9933 | #FF9900 | #CC99FF | #CC99CC | #CC9999 | #CC9966 |
#CC9933 | #CC9900 | #9999FF | #9999CC | #999999 | #999966 |
#999933 | #999900 | #6699FF | #6699CC | #669999 | #669966 |
#669933 | #669900 | #3399FF | #3399CC | #339999 | #339966 |
#339933 | #339900 | #0099FF | #0099CC | #009999 | #009966 |
#009933 | #009900 | #FF66FF | #FF66CC | #FF6699 | #FF6666 |
#FF6633 | #FF6600 | #CC66FF | #CC66CC | #CC6699 | #CC6666 |
#CC6633 | #CC6600 | #9966FF | #9966CC | #996699 | #996666 |
#996633 | #996600 | #6666FF | #6666CC | #666699 | #666666 |
#666633 | #666600 | #3366FF | #3366CC | #336699 | #336666 |
#336633 | #336600 | #0066FF | #0066CC | #006699 | #006666 |
#006633 | #006600 | #FF33FF | #FF33CC | #FF3399 | #FF3366 |
#FF3333 | #FF3300 | #CC33FF | #CC33CC | #CC3399 | #CC3366 |
#CC3333 | #CC3300 | #9933FF | #9933CC | #993399 | #993366 |
#993333 | #993300 | #6633FF | #6633CC | #663399 | #663366 |
#663333 | #663300 | #3333FF | #3333CC | #333399 | #333366 |
#333333 | #333300 | #0033FF | #FF3333 | #0033CC | #003399 |
#003366 | #003333 | #003300 | #FF00FF | #FF00CC | #FF0099 |
#FF0066 | #FF0033 | #FF0000 | #CC00FF | #CC00CC | #CC0099 |
#CC0066 | #CC0033 | #CC0000 | #9900FF | #9900CC | #990099 |
#990066 | #990033 | #990000 | #6600FF | #6600CC | #660099 |
#660066 | #660033 | #660000 | #3300FF | #3300CC | #330099 |
#330066 | #330033 | #330000 | #0000FF | #0000CC | #000099 |
#000066 | #000033 | #00FF00 | #00EE00 | #00DD00 | #00CC00 |
#00BB00 | #00AA00 | #009900 | #008800 | #007700 | #006600 |
#005500 | #004400 | #003300 | #002200 | #001100 | #0000FF |
#0000EE | #0000DD | #0000CC | #0000BB | #0000AA | #000099 |
#000088 | #000077 | #000055 | #000044 | #000022 | #000011 |
Màu sắc gần 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 gần 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 gần 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 gần 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 gần 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 gần 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 gần 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 gần 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 gần 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 gần 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 gần 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) |
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
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 HTML này của BlogIT sẽ giúp ích cho bạn trong quá trình làm việc và học tập.
Cách lấy mã màu bất kỳ trên trang sử dụng trình duyệt
Đôi khi các bạn lướt web hoặc tham khảo màu sắc thiết kế đâu đó ngoài kia. Và nhận ra à cái màu họ dùng thật đẹp và muốn áp dụng vào trong thiết kế của mình. Nhưng các bạn lại không biết mã màu của nó thì làm sao.
Các đơn giản nhất là bạn hãy sử Chrome và bật chế độ Develop (F12). Hoặc cũng có thể chuột phải vào phần tử màu muốn lấy. ở tab style các bạn chấn vào bất kỳ mục nào có định dạng màu (color). Nó sẽ hiện lên bảng mã màu cho bạn lựa chọn. Bạn có thể pick vào bất kỳ màu nào trên trang web là có thể lấy được.
Chúc bạn lựa chọn được đúng mã màu yêu thích của mình.