Warna merupakan hal yang sangat diperlukan dan unik dalam dunia desain visual. Warna tidak memiliki bentuk, ukuran maupun simbol untuk menyampaikan pesan secara langsung. Sehingga Kita perlu untuk mengetahui warna apa saja yang pas dan cocok digunakan di dalam desain website. Berikut kode HTML & CSS Lengkap berdasarkan berdasarkan kode hexadecimal dan kode RGB yang dapat Anda gunakan untuk memperindah website. Tidak hanya memperindah, banyak faktor lain yang dipengaruhi oleh warna.
| WARNA HITAM DAN ABU-ABU (BLACK AND GRAY) | ||
|---|---|---|
| Warna | Nama | Kode |
| Black | #000000 | |
| Dark Slate Gray | #2F4F4F | |
| Slate Gray | #708090 | |
| Light Slate Gray | #778899 | |
| Dim Gray | #696969 | |
| Gray | #808080 | |
| Dark Gray | #A9A9A9 | |
| Silver | #C0C0C0 | |
| Light Gray | #D3D3D3 | |
| Gainsboro | #DCDCDC | |
| WARNA MERAH (RED) | ||
|---|---|---|
| Warna | Nama | Kode |
| Dark Red | #8B0000 | |
| Fire Brick | #B22222 | |
| Red | #FF0000 | |
| Crimson | #DC143C | |
| Light Salmon | #FFA07A | |
| Dark Salmon | #E9967A | |
| Salmon | #FA8072 | |
| Light Coral | #F08080 | |
| Indian Red | #CD5C5C | |
| WARNA MERAH MUDA(PINK) | ||
|---|---|---|
| Warna | Nama | Kode |
| Pale Violet Red | #DB7093 | |
| Medium Violet Red | #C71585 | |
| Deep Pink | #FF1493 | |
| Hot Pink | #FF69B4 | |
| Light Pink | #FFB6C1 | |
| Pink | #FFC0CB | |
| WARNA ORANGE | ||
|---|---|---|
| Warna | Nama | Kode |
| Orange | #FFA500 | |
| Dark Orange | #FF8C00 | |
| Orange Red | #FF4500 | |
| Tomato | #FF6347 | |
| Coral | #FF7F50 | |
| WARNA KUNING (YELLOW) | ||
|---|---|---|
| Warna | Nama | Kode |
| Dark Khaki | #BDB76B | |
| Khaki | #F0E68C | |
| Pale Goldenrod | #EEE8AA | |
| Peach Puff | #FFDAB9 | |
| Moccasin | #FFE4B5 | |
| Papaya Whip | #FFEFD5 | |
| Light Goldenrod Yellow | #FAFAD2 | |
| Lemon Chiffon | #FFFACD | |
| Light Yellow | #FFFFE0 | |
| Yellow | #FFFF00 | |
| Gold | #FFD700 | |
| WARNA HIJAU (GREEN) | ||
|---|---|---|
| Warna | Nama | Kode |
| Teal | #008080 | |
| Dark Cyan | #008B8B | |
| Light Sea Green | #20B2AA | |
| Dark Sea Green | #8FBC8F | |
| Medium Aquamarine | #66CDAA | |
| Dark Olive Green | #556B2F | |
| Olive | #808000 | |
| Olive Drab | #6B8E23 | |
| Yellow Green | #9ACD32 | |
| Dark Green | #006400 | |
| Green | #008000 | |
| Forest Green | #228B22 | |
| Sea Green | #2E8B57 | |
| Medium Sea Green | #3CB371 | |
| Spring Green | #00FF7F | |
| Medium Spring Green | #00FA9A | |
| Light Green | #90EE90 | |
| Pale Green | #98FB98 | |
| Lime Green | #32CD32 | |
| Lime | #00FF00 | |
| Lawn Green | #7CFC00 | |
| Chartreuse | #7FFF00 | |
| Green Yellow | #ADFF2F | |
| WARNA BIRU (BLUE) | ||
|---|---|---|
| Warna | Nama | Kode |
| Midnight Blue | #191970 | |
| Navy | #000080 | |
| Dark Blue | #00008B | |
| Medium Blue | #0000CD | |
| Blue | #0000FF | |
| RoyalBlue | #4169E1 | |
| Medium Slate Blue | #7B68EE | |
| Cornflower Blue | #6495ED | |
| Dodger Blue | #1E90FF | |
| Deep Sky Blue | #00BFFF | |
| Light Sky Blue | #87CEFA | |
| Sky Blue | #87CEEB | |
| Light Blue | #ADD8E6 | |
| Powder Blue | #B0E0E6 | |
| Light Steel Blue | #B0C4DE | |
| Steel Blue | #4682B4 | |
| Cadet Blue | #5F9EA0 | |
| Dark Turquoise | #00CED1 | |
| Medium Turquoise | #48D1CC | |
| Turquoise | #40E0D0 | |
| Aquamarine | #7FFFD4 | |
| Pale Turquoise | #AFEEEE | |
| Light Cyan | #E0FFFF | |
| Cyan | #00FFFF | |
| Aqua | #00FFFF | |
| WARNA UNGU (PURPLE) | ||
|---|---|---|
| Warna | Nama | Kode |
| Medium Slate Blue | #7B68EE | |
| Dark Slate Blue | #483D8B | |
| Slate Blue | #6A5ACD | |
| Indigo | #4B0082 | |
| Purple | #800080 | |
| Dark Magenta | #8B008B | |
| Dark Orchid | #9932CC | |
| Dark Violet | #9400D3 | |
| Blue Violet | #8A2BE2 | |
| Amethyst | #9966CC | |
| Medium Purple | #9370DB | |
| Medium Orchid | #BA55D3 | |
| Magenta / Fuchsia | #FF00FF | |
| Orchid | #DA70D6 | |
| Violet | #EE82EE | |
| Plum | #DDA0DD | |
| Thistle | #D8BFD8 | |
| Lavender | #E6E6FA | |
| WARNA COKLAT (BROWN) | ||
|---|---|---|
| Warna | Nama | Kode |
| Maroon | #800000 | |
| Brown | #A52A2A | |
| Sienna | #A0522D | |
| Saddle Brown | #8B4513 | |
| Chocolate | #D2691E | |
| Peru | #CD853F | |
| Dark Goldenrod | #B8860B | |
| Goldenrod | #DAA520 | |
| Sandy Brown | #F4A460 | |
| Rosy Brown | #BC8F8F | |
| Tan | #D2B48C | |
| Burly Wood | #DEB887 | |
| Wheat | #F5DEB3 | |
| Navajo White | #FFDEAD | |
| Bisque | #FFE4C4 | |
| Blanched Almond | #FFEBCD | |
| Cornsilk | #FFF8DC | |
| WARNA PUTIH (WHITE) | ||
|---|---|---|
| Warna | Nama | Kode |
| Misty Rose | #FFE4E1 | |
| Lavender Blush | #FFF0F5 | |
| Linen | #FAF0E6 | |
| Antique White | #FAEBD7 | |
| Ivory | #FFFFF0 | |
| Floral White | #FFFAF0 | |
| Old Lace | #FDF5E6 | |
| Beige | #F5F5DC | |
| Seashell | #FFF5EE | |
| White Smoke | #F5F5F5 | |
| Ghost White | #F8F8FF | |
| Alice Blue | #F0F8FF | |
| Azure | #F0FFFF | |
| Mint Cream | #F5FFFA | |
| Honeydew | #F0FFF0 | |
| Snow | #FFFAFA | |
| White | #FFFFFF | |
Cara Menggunakan Kode HTML di Karakter
<!DOCTYPE html>
<html>
<body>
<p><font size=”3″ color=”#ff0000″>Hasilnya ini</font></p>
<p><font size=”2″ color=”#00ff00″>Hasilnya ini</font></p>
<p><font face=”verdana” color=”#0000ff”>Hasilnya ini</font></p>
</body>
</html>
Skrip di atas akan menghasilkan tampilan seperti di bawah ini:
Hasilnya ini
Hasilnya ini
Hasilnya ini
Cara Menggunakan Kode Warna HTML di Background
<!DOCTYPE html>
<html>
<head>
<style>
#p1 {background-color:#ff0000;}
#p2 {background-color:#00ff00;}
#p3 {background-color:#0000ff;}
#p4 {background-color:#ffff00;}
#p5 {background-color:#ff00ff;}
</style>
</head>
<body>
<p>HEX colors:</p>
<p id=”p1″>Red</p>
<p id=”p2″>Green</p>
<p id=”p3″>Blue</p>
<p id=”p4″>Yellow</p>
<p id=”p5″>Cerise</p>
</body>
</html>
Skrip di atas akan menghasilkan tampilan seperti di bawah ini:
Red
Green
Blue
Yellow
Cerise
No comments:
Post a Comment