Màu Trong HTML và CSS
Để website trở nên đẹp, thu hút khách hàng thì bạn cần quan tâm đến mã màu trong html/css.
Màu trong html/css được xác định trong những cách sau:
- Xác định màu theo hệ thập lục phân - Hex
- Xác định màu theo kết hợp màu GRB
- Xác định màu theo tên tiếng anh
Xác định màu theo hệ thập lục phân - Hex
HEX là viết tắc của từ "hexadecimal".
- Cách viết: gồm dấu "#" kết hợp với dãy ký tự Latin, chỉ bao gồm số hoặc chữ (hệ thập lục phân), không phân biệt chữ hoa hay chữ thường.
- Các ký tự Latin có thể chấp nhận là: a,b,c,d,e,f,A,B,C,D,E,F.
- Ví dụ: #00ffff
- Ta có thể viết gút gọn màu này theo các cách sau:
- Gút gọn 6 ký tự giống nhau thành 3 ký tự: #ffffff => #fff
- Gút gọn 3 cặp ký tự thành 3 ký tự: #ff0066 => #f06
Xác định màu theo kết hợp màu GRB
Xác định màu theo RGB là sự kết hợp của 3 màu cơ bản: đỏ (Red), xanh lá cây (Green) và xanh dương (Blue)
- Cách viết: rgb(giá trị 1, giá trị 2, giá trị 3)Với giá trị từ 0 tới 255.
- Ví dụ: rgb(155,167,1)
- Một số giá trị đặc biệt:
- Màu đen: rgb(0,0,0)
- Màu đỏ: rgb(255,0,0)
- Màu xanh lá cây: rgb(0,255,0)
- Màu xanh dương: rgb(0,0,255)
- Màu vàng: rgb(255,255,0)
- Màu Trắng: rgb(255,255,255)
Xác định màu theo tên tiếng anh
- Cách viết: tên màu được viết theo tiếng anh.
- Ví dụ: blue
- Một số tên thường dùng:
- Màu đen: black
- Màu đỏ: red
- Màu xanh lá cây: green
- Màu xanh dương: blue
- Màu vàng: yellow
- Màu trắng: white
Giá trị
Tên màu RGB HEX Background Color AliceBlue rgb(240,248,255) #F0F8FF #F0F8FF AntiqueWhite rgb(250,235,215) #FAEBD7 #FAEBD7 Aqua rgb(0,255,255) #00FFFF #00FFFF Aquamarine rgb(127,255,212) #7FFFD4 #7FFFD4 Azure rgb(240,255,255) #F0FFFF #F0FFFF Beige rgb(245,245,220) #F5F5DC #F5F5DC Bisque rgb(255,228,196) #FFE4C4 #FFE4C4 Black rgb(0,0,0) #000000 #000000 BlanchedAlmond rgb(255,235,205) #FFEBCD #FFEBCD Blue rgb(0,0,255) #0000FF #FAEBD7 BlueViolet rgb(138,43,226) #8A2BE2 #8A2BE2 Brown rgb(165,42,42) #A52A2A #A52A2A BurlyWood rgb(222,184,135) #DEB887 #DEB887 CadetBlue rgb(95,158,160) #5F9EA0 #5F9EA0 Chartreuse rgb(127,255,0) #7FFF00 #7FFF00 Chocolate rgb(210,105,30) #D2691E #D2691E Coral rgb(255,127,80) #FF7F50 #FF7F50 CornflowerBlue rgb(100,149,137) #6495ED #6495ED Cornsilk rgb(255,248,220) #FFF8DC #FFF8DC Crimson rgb(220,20,60) #DC143C #DC143C Cyan rgb(0,255,255) #00FFFF #00FFFF DarkBlue rgb(0,0,139) #00008B #00008B DarkCyan rgb(0,139,139) #008B8B #008B8B DarkGoldenRod rgb(184,134,11) #B8860B #B8860B DarkGray rgb(169,169,169) #A9A9A9 #A9A9A9 DarkGreen rgb(0,100,0) #006400 #006400 DarkGrey rgb(169,169,169) #A9A9A9 #A9A9A9 DarkKhaki rgb(189,183,107) #BDB76B #BDB76B DarkMagenta rgb(139,0,139) #8B008B #8B008B DarkOliveGreen rgb(85,107,47) #556B2F #556B2F Darkorange rgb(255,140,0) #FF8C00 #FF8C00 DarkOrchid rgb(153,50,204) #9932CC #9932CC DarkRed rgb(139,0,0) #8B0000 #8B0000 DarkSalmon rgb(233,150,122) #E9967A #E9967A DarkSeaGreen rgb(143,188,143) #8FBC8F #8FBC8F DarkSlateBlue rgb(72,61,139) #483D8B #483D8B DarkSlateGray rgb(47,79,79) #2F4F4F #2F4F4F DarkSlateGrey rgb(47,79,79) #2F4F4F #2F4F4F DarkTurquoise rgb(0,206,209) #00CED1 #00CED1 DarkViolet rgb(248,0,211) #9400D3 #9400D3 DeepPink rgb(255,20,147) #FF1493 #FF1493 DeepSkyBlue rgb(0,191,255) #00BFFF #00BFFF DimGray rgb(105,105,105) #696969 #696969 DimGrey rgb(105,105,105) #696969 #696969 DodgerBlue rgb(30,144,255) #1E90FF #1E90FF FireBrick rgb(178,34,34) #B22222 #B22222 FloralWhite rgb(255,250,240) #FFFAF0 #FFFAF0 ForestGreen rgb(34,139,34) #228B22 #228B22 Fuchsia rgb(255,0,255) #FF00FF #FF00FF Gainsboro rgb(220,220,220) #DCDCDC #DCDCDC GhostWhite rgb(248,248,255) #F8F8FF #F8F8FF Gold rgb(255,215,0) #FFD700 #FFD700 GoldenRod rgb(218,165,32) #DAA520 #DAA520 Gray rgb(218,218,218) #808080 #808080 Green rgb(0,218,0) #008000 #008000 Grey rgb(218,218,218) #808080 #808080 GreenYellow rgb(173,255,47) #ADFF2F #ADFF2F HoneyDew rgb(240,255,240) #F0FFF0 #F0FFF0 HotPink rgb(255,105,180) #FF69B4 #FF69B4 IndianRed rgb(205,90,90) #CD5C5C #CD5C5C Indigo rgb(75,0,130) #4B0082 #4B0082 Ivory rgb(255,255,240) #FFFFF0 #FFFFF0 Khaki rgb(240,230,140) #F0E68C #F0E68C Lavender rgb(230,230,230) #E6E6FA #E6E6FA LavenderBlush rgb(255,240,245) #FFF0F5 #FFF0F5 LawnGreen rgb(124,252,0) #7CFC00 #7CFC00 LemonChiffon rgb(255,250,205) #FFFACD #FFFACD LightBlue rgb(173,216,230) #ADD8E6 #ADD8E6 LightCoral rgb(240,128,128) #F08080 #F08080 LightCyan rgb(224,255,255) #E0FFFF #E0FFFF LightGoldenRodYellow rgb(250,250,210) #FAFAD2 #FAFAD2 LightGray rgb(211,211,211) #D3D3D3 #D3D3D3 LightGreen rgb(144,238,144) #90EE90 #90EE90 LightGrey rgb(211,211,211) #D3D3D3 #D3D3D3 LightPink rgb(255,182,193) #FFB6C1 #FFB6C1 LightSalmon rgb(255,160,122) #FFA07A #FFA07A LightSeaGreen rgb(32,178,170) #20B2AA #20B2AA LightSkyBlue rgb(135,206,250) #87CEFA #87CEFA LightSlateGray rgb(119,136,153) #778899 #778899 LightSlateGrey rgb(119,136,153) #778899 #778899 LightSteelBlue rgb(176,196,222) #B0C4DE #B0C4DE LightYellow rgb(255,255,224) #FFFFE0 #FFFFE0 Lime rgb(0,255,0) #00FF00 #00FF00 LimeGreen rgb(50,205,50) #32CD32 #32CD32 Linen rgb(250,240,230) #FAF0E6 #FAF0E6 Magenta rgb(255,0,255) #FF00FF #FF00FF Maroon rgb(128,0,0) #800000 #800000 MediumAquaMarine rgb(102,205,170) #66CDAA #66CDAA MediumBlue rgb(0,0,205) #0000CD #0000CD MediumOrchid rgb(186,85,211) #BA55D3 #BA55D3 MediumPurple rgb(147,112,216) #9370D8 #9370D8 MediumSeaGreen rgb(60,179,113) #3CB371 #3CB371 MediumSlateBlue rgb(123,104,238) #7B68EE #7B68EE MediumSpringGreen rgb(0,250,154) #00FA9A #00FA9A MediumTurquoise rgb(72,209,204) #48D1CC #48D1CC MediumVioletRed rgb(199,21,133) #C71585 #C71585 MidnightBlue rgb(25,25,112) #191970 #191970 MintCream rgb(245,255,250) #F5FFFA #F5FFFA MistyRose rgb(255,228,225) #FFE4E1 #FFE4E1 Moccasin rgb(255,228,181) #FFE4B5 #FFE4B5 NavajoWhite rgb(255,222,173) #FFDEAD #FFDEAD Navy rgb(0,0,128) #000080 #000080 OldLace rgb(253,245,230) #FDF5E6 #FDF5E6 Olive rgb(128,128,0) #808000 #808000 OliveDrab rgb(107,142,35) #6B8E23 #6B8E23 Orange rgb(255,165,0) #FFA500 #FFA500 OrangeRed rgb(255,69,0) #FF4500 #FF4500 Orchid rgb(218,112,214) #DA70D6 #DA70D6 PaleGoldenRod rgb(238,232,170) #EEE8AA #EEE8AA PaleGreen rgb(152,251,152) #98FB98 #98FB98 PaleTurquoise rgb(175,238,238) #AFEEEE #AFEEEE PaleVioletRed rgb(216,112,147) #D87093 #D87093 PapayaWhip rgb(255,239,213) #FFEFD5 #FFEFD5 PeachPuff rgb(255,218,185) #FFDAB9 #FFDAB9 Peru rgb(205,133,63) #CD853F #CD853F Pink rgb(255,192,203) #FFC0CB #FFC0CB Plum rgb(221,160,221) #DDA0DD #DDA0DD PowderBlue rgb(176,224,230) #B0E0E6 #B0E0E6 Purple rgb(128,0,128) #800080 #800080 Red rgb(255,0,0) #FF0000 #FF0000 RosyBrown rgb(188,143,143) #BC8F8F #BC8F8F RoyalBlue rgb(65,105,225) #4169E1 #4169E1 SaddleBrown rgb(139,69,19) #8B4513 #8B4513 Salmon rgb(250,128,114) #FA8072 #FA8072 SandyBrown rgb(244,164,96) #F4A460 #F4A460 SeaGreen rgb(46,139,87) #2E8B57 #2E8B57 SeaShell rgb(255,245,238) #FFF5EE #FFF5EE Sienna rgb(160,82,45) #A0522D #A0522D Silver rgb(192,192,192) #C0C0C0 #C0C0C0 SkyBlue rgb(135,206,235) #87CEEB #87CEEB SlateBlue rgb(106,90,255) #6A5ACD #6A5ACD SlateGray rgb(112,128,144) #708090 #708090 SlateGrey rgb(112,128,144) #708090 #708090 Snow rgb(255,250,250) #FFFAFA #FFFAFA SpringGreen rgb(0,255,127) #00FF7F #00FF7F SteelBlue rgb(70,130,180) #4682B4 #4682B4 Tan rgb(210,180,140) #D2B48C #D2B48C Teal rgb(0,128,128) #008080 #008080 Thistle rgb(216,191,216) #D8BFD8 #D8BFD8 Tomato rgb(255,99,71) #FF6347 #FF6347 Turquoise rgb(64,224,208) #40E0D0 #40E0D0 Violet rgb(238,130,238) #EE82EE #EE82EE Wheat rgb(245,222,179) #F5DEB3 #F5DEB3 White rgb(255,255,255) #FFFFFF #FFFFFF WhiteSmoke rgb(245,245,245) #F5F5F5 #F5F5F5 Yellow rgb(255,255,0) #FFFF00 #FFFF00 YellowGreen rgb(145,205,50) #9ACD32 #9ACD32
Không có nhận xét nào:
Đăng nhận xét