Pada kesempatan kali ini saya akan menjabarkan tentang kode-kode warna html yang biasa kita kenal dengan warna web.. Bagi yang terbiasa utak-atik website, blog, terutama para desainer template tentu tak asing dengan apa yang namanya, Kode Warna HTML. Saya sendiri sering kali mengotak atik warna html pada blog ini.. terkadang suka tidak puas dengan warna dari template bawaan.. maka saya rubah sendiri.. naah.. pas saya googling, nyari kode warna.. saya nemu ini.. langsung dari wikipedia.. okelah berikut Kode Warna HTML dan penjelasanya..
Warna web adalah warna-warna yang digunakan dalam perancangan halaman-halaman web, dan juga cara mendeskripsikan dan melakukan spesifikasi dari warna-warna tersebut.
Seorang penulis halaman web memiliki banyak kebebasan dalam memilih warna yang akan digunakan bagi elemen-elemen dokumen webnya. Warna-warna yang dimaksud dapat dispesifikasikan menggunakan triplet RGB dalam format heksadesimal (disebut juga sebagai triplet heksadesimal). Cara lain adalah dengan mereferensikan warna-warna tersebut dengan namanya dalam bahasa Inggris, akan tetapi cara ini berlaku terbatas pada hanya warna-warna yang telah dikenal atau dirumuskan. Untuk variasi-variasi warna lain umumnya digunakan piranti lunak grafik atau perkakas warna untuk membuatnya. Di samping adalah contoh sebuah palet warna yang terdiri dari 2048 macam warna.
Pemakaian Dalam HTML
Dalam suatu halaman web yang berformat HTML warna-warna web dapat digunakan melalui definisi stil (style) suatu entitas. Hampir setiap entitas HTML dewasa ini mendukung penggunaan stil.
<b style="color:#FF9329;">Contoh penggunaan warna #FF9329 pada tag b dalam HTML.</b>
akan memberikan hasil
- Contoh penggunaan warna #FF9329 pada tag b dalam HTML.
atau apabila digunakan referensi nama, misalnya 'Tomato'
<b style="color:Tomato;">Contoh penggunaan warna 'Tomato' pada tag b dalam HTML.</b>
akan diperoleh hasil
- Contoh penggunaan warna 'Tomato' pada tag b dalam HTML.
Cara yang sama juga berlaku untuk tag-tag HTML lainnya. Dapat pula implementasi warna web ini dilakukan melalui penggunaan CSS.
Triplet RGB
Triplet RGB terdiri dari enam buah karakter heksadesimal yang tiap dua-dua karakter masing-masing menyatakan entitas dari Red (merah), Green (hijau) dan Blue (biru). Nilai-nilai yang dapat diisikan untuk tiap-tiap entitas RBG ini adalah dari 00 sampai FF. Atau dalam angka desimal 0 sampai 255.
Warna | Triplet Heksadesimal | Heksadesimal | Desimal | ||||
---|---|---|---|---|---|---|---|
R | G | B | R | G | B | ||
#000000 | 00 | 00 | 00 | 0 | 0 | 0 | |
#FFFFFF | FF | FF | FF | 255 | 255 | 255 | |
#0000FF | 00 | 00 | FF | 0 | 0 | 255 | |
#00FF00 | 00 | FF | 00 | 0 | 255 | 0 | |
#FF0000 | FF | 00 | 00 | 255 | 0 | 0 | |
#F0F8FF | F0 | F8 | FF | 240 | 248 | 255 | |
#F5DEBB3 | F5 | DE | B3 | 245 | 222 | 179 | |
#DB7093 | DB | 70 | 93 | 219 | 112 | 147 |
Nama Nama Warna HTML
Warna | Nomor VGA | Nama VGA | Heksadesimal | Nama HTML | |||
---|---|---|---|---|---|---|---|
0 | black | #000000 | black | ||||
1 | dark blue | #000080 | navy | ||||
2 | dark green | #008000 | green | ||||
3 | cyan | #008080 | teal | ||||
4 | dark red | #800000 | maroon | ||||
5 | magenta | #800080 | purple | ||||
6 | brown | #808000 | olive | ||||
7 | light gray | #C0C0C0 | silver | ||||
8 | dark gray | #808080 | gray | ||||
9 | light blue | #0000FF | blue | ||||
10 | light green | #00FF00 | lime | ||||
11 | light cyan | #00FFFF | aqua | ||||
12 | light red | #FF0000 | red | ||||
13 | light magenta | #FF00FF | fuchsia | ||||
14 | yellow | #FFFF00 | yellow | ||||
15 | intensive white | #FFFFFF | white |
Warna-warna merah (9)
Warna | Nama HTML | Heksadesimal |
---|---|---|
IndianRed | #CD5C5C | |
LightCoral | #F08080 | |
Salmon | #FA8072 | |
DarkSalmon | #E9967A | |
LightSalmon | #FFA07A | |
Crimson | #DC143C | |
Red | #FF0000 | |
FireBrick | #B22222 | |
DarkRed | #8B0000 |
Warna-warna pink (6)
Warna | Nama HTML | Heksadesimal |
---|---|---|
Pink | #FFC0CB | |
LightPink | #FFB6C1 | |
HotPink | #FF69B4 | |
DeepPink | #FF1493 | |
MediumVioletRed | #C71585 | |
PaleVioletRed | #DB7093 |
Warna-warna jingga (6)
Warna | Nama HTML | Heksadesimal |
---|---|---|
LightSalmon | #FFA07A | |
Coral | #FF7F50 | |
Tomato | #FF6347 | |
OrangeRed | #FF4500 | |
DarkOrange | #FF8C00 | |
Orange | #FFA500 |
Warna-warna kuning (11)
Warna | Nama HTML | Heksadesimal |
---|---|---|
Gold | #FFD700 | |
Yellow | #FFFF00 | |
LightYellow | #FFFFE0 | |
LemonChiffon | #FFFACD | |
LightGoldenrodYellow | #FAFAD2 | |
PapayaWhip | #FFEFD5 | |
Moccasin | #FFE4B5 | |
PeachPuff | #FFDAB9 | |
PaleGoldenrod | #EEE8AA | |
Khaki | #F0E68C | |
DarkKhaki | #BDB76B |
Warna-warna ungu (17)
Warna | Nama HTML | Heksadesimal |
---|---|---|
Lavender | #E6E6FA | |
Thistle | #D8BFD8 | |
Plum | #DDA0DD | |
Violet | #EE82EE | |
Orchid | #DA70D6 | |
Fuchsia | #FF00FF | |
Magenta | #FF00FF | |
MediumOrchid | #BA55D3 | |
MediumPurple | #9370DB | |
BlueViolet | #8A2BE2 | |
DarkViolet | #9400D3 | |
DarkOrchid | #9932CC | |
DarkMagenta | #8B008B | |
Purple | #800080 | |
Indigo | #4B0082 | |
SlateBlue | #6A5ACD | |
DarkSlateBlue | #483D8B |
Warna-warna hijau (23)
Warna | Nama HTML | Heksadesimal |
---|---|---|
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 | |
Olive | #808000 | |
DarkOliveGreen | #556B2F | |
MediumAquamarine | #66CDAA | |
DarkSeaGreen | #8FBC8F | |
LightSeaGreen | #20B2AA | |
DarkCyan | #008B8B | |
Teal | #008080 |
Warna-warna biru (25)
Warna | Nama HTML | Heksadesimal |
---|---|---|
Aqua | #00FFFF | |
Cyan | #00FFFF | |
LightCyan | #E0FFFF | |
PaleTurquoise | #AFEEEE | |
Aquamarine | #7FFFD4 | |
Turquoise | #40E0D0 | |
MediumTurquoise | #48D1CC | |
DarkTurquoise | #00CED1 | |
CadetBlue | #5F9EA0 | |
SteelBlue | #4682B4 | |
LightSteelBlue | #B0C4DE | |
PowderBlue | #B0E0E6 | |
LightBlue | #ADD8E6 | |
SkyBlue | #87CEEB | |
LightSkyBlue | #87CEFA | |
DeepSkyBlue | #00BFFF | |
DodgerBlue | #1E90FF | |
CornflowerBlue | #6495ED | |
MediumSlateBlue | #7B68EE | |
RoyalBlue | #4169E1 | |
Blue | #0000FF | |
MediumBlue | #0000CD | |
DarkBlue | #00008B | |
Navy | #000080 | |
MidnightBlue | #191970 |
Warna-warna coklat (17)
Warna | Nama HTML | Heksadesimal |
---|---|---|
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 | |
SaddleBrown | #8B4513 | |
Sienna | #A0522D | |
Brown | #A52A2A | |
Maroon | #800000 |
Warna-warna putih (17)
Warna | Nama HTML | Heksadesimal |
---|---|---|
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 | |
Warna-warna abu-abu (10)
Warna | Nama HTML | Heksadesimal |
---|---|---|
Gainsboro | #DCDCDC | |
LightGrey | #D3D3D3 | |
Silver | #C0C0C0 | |
DarkGray | #A9A9A9 | |
Gray | #808080 | |
DimGray | #696969 | |
LightSlateGray | #778899 | |
SlateGray | #708090 | |
DarkSlateGray | #2F4F4F | |
Black | #000000 |
Warna Aman Untuk Web
Terdapat suatu kumpulan dari 216 warna yang dinyatakan sebagai palet warna "web-aman".
digit | heksadesimal | desimal |
---|---|---|
0 | 00 | 0 |
3 | 33 | 51 |
6 | 66 | 102 |
9 | 99 | 153 |
C or (12) | CC | 204 |
F or (15) | FF | 255 |
Dalam tabel berikut ini disajikan warna-warna "aman-web" yang tersusun atas tiga digit nilai seperti dituliskan dalam tabel sebelumnya.
000 | 300 | 600 | 900 | C00 | F00 | 003 | 303 | 603 | 903 | C03 | F03 |
006 | 306 | 606 | 906 | C06 | F06 | 009 | 309 | 609 | 909 | C09 | F09 |
00C | 30C | 60C | 90C | C0C | F0C | 00F | 30F | 60F | 90F | C0F | F0F |
030 | 330 | 630 | 930 | C30 | F30 | 033 | 333 | 633 | 933 | C33 | F33 |
036 | 336 | 636 | 936 | C36 | F36 | 039 | 339 | 639 | 939 | C39 | F39 |
03C | 33C | 63C | 93C | C3C | F3C | 03F | 33F | 63F | 93F | C3F | F3F |
060 | 360 | 660 | 960 | C60 | F60 | 063 | 363 | 663 | 963 | C63 | F63 |
066 | 366 | 666 | 966 | C66 | F66 | 069 | 369 | 669 | 969 | C69 | F69 |
06C | 36C | 66C | 96C | C6C | F6C | 06F | 36F | 66F | 96F | C6F | F6F |
090 | 390 | 690 | 990 | C90 | F90 | 093 | 393 | 693 | 993 | C93 | F93 |
096 | 396 | 696 | 996 | C96 | F96 | 099 | 399 | 699 | 999 | C99 | F99 |
09C | 39C | 69C | 99C | C9C | F9C | 09F | 39F | 69F | 99F | C9F | F9F |
0C0 | 3C0 | 6C0 | 9C0 | CC0 | FC0 | 0C3 | 3C3 | 6C3 | 9C3 | CC3 | FC3 |
0C6 | 3C6 | 6C6 | 9C6 | CC6 | FC6 | 0C9 | 3C9 | 6C9 | 9C9 | CC9 | FC9 |
0CC | 3CC | 6CC | 9CC | CCC | FCC | 0CF | 3CF | 6CF | 9CF | CCF | FCF |
0F0 | 3F0 | 6F0 | 9F0 | CF0 | FF0 | 0F3 | 3F3 | 6F3 | 9F3 | CF3 | FF3 |
0F6 | 3F6 | 6F6 | 9F6 | CF6 | FF6 | 0F9 | 3F9 | 6F9 | 9F9 | CF9 | FF9 |
0FC | 3FC | 6FC | 9FC | CFC | FFC | 0FF | 3FF | 6FF | 9FF | CFF | FFF |
- Warna Yang Benar-Benar Aman Untuk Web
Perancang web umumnya disarankan untuk tetap pada penggunaan warna-warna "aman-web" dalam situs web mereka; akan tetapi warna dengan kedalaman 8-bit jauh lebih umum saat palet 216-warna dikembangkan dibandingkan dengan saat ini. David Lehn dan Hadley Stern sejak saat itu menemukan bahwa hanya 22 warna dari 216 warna dalam palet warna aman-web yang dapat dipercaya untuk ditampilkan tanpa ketidak-konsistenan pada pemetaan-ulang pada tampilan computer dengan kedalaman warna 16-bit. Mereka menamakan 22 macam warna ini sebagai palet "benar-benar aman": palet tersebut terdiri sebagian besar atas tingkatan warna hijau dan kuning. Warna-warna yang dimaksud ditabelkan berikut ini.
000 | F00 | 003 | F03 | 00F | F0F | 0F0 | 6F0 | FF0 | 3F3 | 6F3 |
FF3 | 0F6 | 3F6 | CF6 | FF6 | 0FC | 3FC | 0FF | 3FF | 6FF | FFF |
Warna Warna CSS
Warna | Heksadesimal | Nama |
---|---|---|
#FFA500 | orange | |
#000000 | black | |
#000080 | navy | |
#008000 | green | |
#008080 | teal | |
#800000 | maroon | |
#800080 | purple | |
#808000 | olive | |
#C0C0C0 | silver | |
#808080 | gray | |
#0000FF | blue | |
#00FF00 | lime | |
#00FFFF | aqua | |
#FF0000 | red | |
#FF00FF | fuchsia | |
#FFFF00 | yellow | |
#FFFFFF | white |
sumber: Wikipedia