Pada pemrograman, pewarnaan dilakukan dengan menggunakan kode. Bagi Anda yang sudah terbiasa dengan desain komputer pasti tidak asing dengan beberapa kode seperti # 92a8d1 dan # ff0000 . Kedua kode tersebut merupakan kode warna heksadesimal.
Ada beberapa jenis kode warna yang biasanya digunakan dalam pemrograman komputer, yaitu bentuk hexadecimal, RGB, RGBA, HSL, dan HSLA.
Heksadesimal tersusun dari kombinasi huruf dan angka dengan diawali dengan tanda '#'. Sementara RGB terdiri dari 3 bagian angka yang dipisahkan oleh tanda koma. Kode warna pada HTML menggunakan HTML kembar tiga. Setiap dua digit kode melambangkan warna-warna merah (merah), hijau (hijau), biru (biru) atau #RRGGBB.
Di bawah ini adalah daftar kode warna HTML yang dapat Anda gunakan sebagai panduan untuk membuat kode warna.
Daftar Kode Warna HTML Lengkap
Warna merupakan hal yang penting dan unik dalam dunia desain visual. Warna tidak memiliki bentuk, ukuran juga simbol untuk menyampaikan pesan langsung. Diperlukan untuk mengetahui warna apa saja yang cocok digunakan di dalam situs web.
Di bawah ini tabel kode warna HTML & CSS yang dapat Anda gunakan untuk memperindah situs web. Tidak hanya memperindah, banyak faktor lain yang didukung oleh warna. Lebih jelasnya Anda dapat membaca tinjauan kami tentang Menentukan Warna Efektif untuk Desain Website Anda . Tentang bagaimana warna itu sangat penting.
| Nama Warna | HEX | RGB | |
|---|---|---|---|
. | Alice Blue | # F0F8FF | rgb (240, 248, 254) |
. | Putih Antik | # FAEBD7 | rgb (251, 235, 217) |
. | Aqua | # 00FFFF | rgb (0, 255, 254) |
. | Aquamarine | # 7FFFD4 | rgb (115, 255, 216) |
. | Biru langit | # F0FFFF | rgb (239, 255, 255) |
. | Krem | # F5F5DC | rgb (245, 245, 223) |
. | Bisque | # FFE4C4 | rgb (255, 227, 200) |
. | Hitam | # 000000 | rgb (0, 0, 0) |
. | Almond pucat | #FFEBCD | rgb (255, 234, 208) |
. | Biru | # 0000FF | rgb (0, 0, 255) |
. | Blue Violet | # 8A2BE2 | rgb (138, 43, 226) |
. | Coklat | # A52A2A | rgb (165, 42, 42) |
. | Burly Wood | # DEB887 | rgb (222, 184, 135) |
. | Kadet Biru | # 5F9EA0 | rgb (95, 158, 160) |
. | Minuman keras manis | # 7FFF00 | rgb (127, 255, 1) |
. | Cokelat | # D2691E | rgb (210, 105, 30) |
. | Karang | # FF7F50 | rgb (251, 127, 80) |
. | Cornflower Blue | # 6495ED | rgb (100, 149, 237) |
. | Rambut jagung | # FFF8DC | rgb (225, 248, 220) |
. | Merah tua | # DC143C | rgb (220, 20, 60) |
. | Cyan | # 00FFFF | rgb (62, 254, 255) |
. | Biru tua | # 00008B | rgb (0, 0, 139) |
. | Dark Cyan | # 008B8B | rgb (29, 139, 139) |
. | Batang Emas Gelap | # B8860B | rgb (184, 134, 11) |
. | Abu-abu gelap | # A9A9A9 | rgb (169, 169, 169) |
. | Hijau tua | # 006400 | rgb (19, 100, 0) |
. | Khaki gelap | # BDB76B | rgb (189, 183, 107) |
. | Magenta gelap | # 8B008B | rgb (139, 0, 140) |
. | Zaitun Hijau Gelap | # 556B2F | rgb (85, 107, 47) |
. | Oren tua | # FF8C00 | rgb (251, 140, 1) |
. | Anggrek gelap | # 9932CC | rgb (153, 50, 204) |
. | Merah gelap | # 8B0000 | rgb (139, 5, 0) |
. | Salmon gelap | # E9967A | rgb (233, 150, 122) |
. | Laut Hijau Gelap | # 8FBC8F | rgb (143, 188, 144) |
. | Dark Slate Blue | # 483D8B | rgb (72, 61, 139) |
. | Dark Slate Grey | # 2F4F4F | rgb (47, 79, 79) |
. | Pirus Hitam | # 00CED1 | rgb (48, 206, 209) |
. | Dark Violet | # 9400D3 | rgb (148, 0, 211) |
. | Pink tua | # FF1493 | rgb (249, 19, 147) |
. | Langit Biru Tua | # 00BFFF | rgb (43, 191, 254) |
. | Redup Gray | # 696969 | rgb (105, 105, 105) |
. | Dodger Blue | # 1E90FF | rgb (30, 144, 255) |
. | Bata Api | # B22222 | rgb (178, 34, 33) |
. | Bunga putih | # FFFAF0 | rgb (255, 250, 240) |
. | Hutan hijau | # 228B22 | rgb (34, 139, 35) |
. | Fuchsia | # FF00FF | rgb (249, 0, 255) |
. | Gainsboro | #DCDCDC | rgb (220, 220, 220) |
. | Hantu Putih | # F8F8FF | rgb (248, 248, 255) |
. | Emas | # FFD700 | rgb (253, 215, 3) |
. | Batang Emas | # DAA520 | rgb (218, 165, 32) |
. | Abu-abu | # 808080 | rgb (128, 128, 128) |
. | hijau | # 008000 | rgb (27, 128, 1) |
. | Hijau kuning | # ADFF2F | rgb (173, 255, 48) |
. | Honey Dew | # F0FFF0 | rgb (240, 255, 240) |
. | Hot Pink | # FF69B4 | rgb (240, 255, 240) |
. | Indian Red | # CD5C5C | rgb (205, 92, 92) |
. | Nila | # 4B0082 | rgb (75, 0, 130) |
. | Gading | # FFFFF0 | rgb (255, 255, 239) |
. | Dril | # F0E68C | rgb (240, 230, 140) |
. | Lavender | # E6E6FA | rgb (230, 230, 250) |
. | Lavender Blush | # FFF0F5 | rgb (254, 240, 245) |
. | Rumput Hijau | # 7CFC00 | rgb (124, 252, 2) |
. | Sifon Lemon | #FFFACD | rgb (255, 250, 205) |
. | Biru muda | # ADD8E6 | rgb (173, 216, 230) |
. | Coral Light | # F08080 | rgb (240, 128, 128) |
. | Cyan ringan | # E0FFFF | rgb (224, 255, 255) |
. | Batang Emas Kuning Muda | # FAFAD2 | rgb (250, 250, 210) |
. | Abu-abu muda | # D3D3D3 | rgb (211, 211, 211) |
. | Hijau muda | # 90EE90 | rgb (144, 238, 144) |
. | Pink muda | # FFB6C1 | rgb (252, 182, 193) |
. | Salmon ringan | # FFA07A | rgb (251, 160, 122) |
. | Hijau laut muda | # 20B2AA | rgb (40, 178, 170) |
. | Langit Biru Muda | # 87CEFA | rgb (135, 206, 250) |
. | Light Slate Grey | # 778899 | rgb (119, 136, 153) |
. | Biru Muda Baja | # B0C4DE | rgb (176, 196, 222) |
. | Kuning muda | # FFFFE0 | rgb (255, 255, 224) |
. | jeruk nipis | # 00FF00 | rgb (63, 255, 0) |
. | Hijau limau | # 32CD32 | rgb (50, 205, 50) |
. | Linen | # FAF0E6 | rgb (250, 240, 230) |
. | Magenta | # FF00FF | rgb (249, 0, 255) |
. | Merah tua | # 800000 | rgb (128, 4, 0) |
. | Sedang Aqua Marine | # 66CDAA | rgb (102, 205, 170) |
. | Biru Sedang | # 0000CD | rgb (0, 0, 205) |
. | Anggrek sedang | # BA55D3 | rgb (186, 85, 211) |
. | Ungu Sedang | # 9370DB | rgb (147, 112, 219) |
. | Hijau Laut Sedang | # 3CB371 | rgb (60, 179, 113) |
. | Biru Tulisan Sedang | # 7B68EE | rgb (123, 103, 238) |
. | Medium Spring Green | # 00FA9A | rgb (62, 250, 153) |
. | Pirus Menengah | # 48D1CC | rgb (72, 209, 204) |
. | Medium Violet Red | # C71585 | rgb (199, 21, 133) |
. | Midnight Blue | # 191970 | rgb (25, 25, 112) |
. | Krim mint | # F5FFFA | rgb (245, 255, 250) |
. | Rose berkabut | # FFE4E1 | rgb (254, 228, 225) |
. | Sepatu sandal | # FFE4B5 | rgb (254, 228, 181) |
. | Navajo White | #FFDEAD | rgb (254, 222, 173) |
. | Angkatan laut | # 000080 | rgb (0, 0, 128) |
. | Renda Tua | # FDF5E6 | rgb (253, 245, 230) |
. | Zaitun | # 808000 | rgb (128, 128, 1) |
. | Minyak zaitun | # 6B8E23 | rgb (107, 142, 35) |
. | Jeruk | # FFA500 | rgb (252, 165, 3) |
. | Merah oranye | # FF4500 | rgb (250, 69, 1) |
. | Anggrek | # DA70D6 | rgb (218, 112, 214) |
. | Batang Emas Pucat | # EEE8AA | rgb (238, 232, 170) |
. | Hijau pucat | # 98FB98 | rgb (152, 251, 153) |
. | Pirus Pucat | #AFEEEE | rgb (175, 238, 239) |
. | Merah Pucat Merah | # DB7093 | rgb (219, 112, 147) |
. | Cambuk Pepaya | # FFEFD5 | rgb (254, 239, 213) |
. | Persik Puff | # FFDAB9 | rgb (253, 218, 185) |
. | Peru | # CD853F | rgb (205, 133, 63) |
. | Berwarna merah muda | # FFC0CB | rgb (252, 192, 203) |
. | Prem | # DDA0DD | rgb (221, 160, 221) |
. | Bubuk biru | # B0E0E6 | rgb (176, 224, 230) |
. | Ungu | # 800080 | rgb (128, 0, 128) |
. | Rebecca Purple | # 663399 | rgb (102, 51, 153) |
. | Merah | # FF0000 | rgb (255, 0, 0) |
. | Rosy Brown | # BC8F8F | rgb (188, 143, 142) |
. | Royal Blue | # 4169E1 | rgb (65, 105, 225) |
. | Pelana Brown | # 8B4513 | rgb (139, 69, 19) |
. | Ikan salmon | # FA8072 | rgb (250, 128, 114) |
. | Sandy Brown | # F4A460 | rgb (244, 164, 95) |
. | Laut hijau | # 2E8B57 | rgb (46, 139, 87) |
. | Kerang Laut | # FFF5EE | rgb (255, 245, 238) |
. | Sienna | # A0522D | rgb (160, 82, 45) |
. | Perak | # C0C0C0 | rgb (192, 192, 192) |
. | Langit biru | # 87CEEB | rgb (135, 206, 235) |
. | Slate Blue | # 6A5ACD | rgb (106, 90, 205) |
. | Slate Grey | # 708090 | rgb (112, 128, 145) |
. | Salju | #FFFAFA | rgb (255, 250, 250) |
. | Spring Green | # 00FF7F | rgb (63, 255, 128) |
. | Baja Biru | # 4682B4 | rgb (70, 130, 180) |
. | Berjemur | # D2B48C | rgb (210, 180, 140) |
. | Teal | # 008080 | rgb (26, 128, 127) |
. | Thistle | # D8BFD8 | rgb (216, 191, 216) |
. | Tomat | # FF6347 | rgb (250, 99, 71) |
. | Pirus | # 40E0D0 | rgb (64, 224, 208) |
. | Violet | # EE82EE | rgb (238, 130, 238) |
. | Gandum | # F5DEB3 | rgb (245, 222, 179) |
. | putih | #FFFFFF | rgb (255, 255, 255) |
. | Asap putih | # F5F5F5 | rgb (245, 245, 245) |
. | Kuning | # FFFF00 | rgb (255, 255, 0) |
. | Kuning hijau | # 9ACD32 | rgb (154, 205, 49) |
Anda dapat melihat perbedaan mengenai hexadecimal dan RGB.
| Color | HTML / CSS Color Name | Hex Code #RRGGBB | Decimal Code (R,G,B) |
|---|---|---|---|
| lightsalmon | #FFA07A | rgb(255,160,122) | |
| salmon | #FA8072 | rgb(250,128,114) | |
| darksalmon | #E9967A | rgb(233,150,122) | |
| lightcoral | #F08080 | rgb(240,128,128) | |
| indianred | #CD5C5C | rgb(205,92,92) | |
| crimson | #DC143C | rgb(220,20,60) | |
| firebrick | #B22222 | rgb(178,34,34) | |
| red | #FF0000 | rgb(255,0,0) | |
| darkred | #8B0000 | rgb(139,0,0) |
Selain menggunakan kode warna, Anda juga dapat menggunakan generator untuk menentukan kode warna apa saja yang bisa digunakan. Anda dapat menggunakan generator warna yang disediakan oleh beberapa website di bawah ini.
- W3School HTML Color Picker
Situs ini dapat Anda gunakan untuk memilih warna berdasarkan warna. Anda dapat memilih tingkat saturasi dan melihat langsung (preview) hasil. Selain itu, tersedia juga pilihan untuk memasukkan warna berdasarkan kode dan juga memunculkan jendela HTML 5 untuk pemilihan warna. - Colors & SkillshareColors merupakan situs yang digunakan sebagai alat schema generator. Jika Anda seorang desainer, situs ini dapat memberikan skema saran yang sesuai dengan kebutuhan dan juga tersedia kode hexadecimal yang dapat digunakan dalam situs web.
- Kode Warna HTML Kode Warna
HTML merupakan situs web sederhana yang menyediakan tampilan pemilihan warna. Anda tinggal mengarahkan kursor ke dalam tabel warna atau menggeser slider untuk mendapatkan warna yang sesuai dengan kode warna dalam bentuk hexadecimal.
Cara Menggunakan Kode Warna HTML & CSS
Penggunaan kode warna pada HTML & CSS kompilasi diterapkan ke dalam situs web. Kode warna dapat Anda gunakan di semua bagian, seperti karakter, latar belakang, dan perbatasan.
Berikut beberapa cara menggunakan kode warna HTML dan CSS:
Cara Menggunakan Kode Warna HTML di Karakter
| <! DOCTYPE html> Daftar Kode Warna Pada HTML & CSS " Daftar Kode Warna Pada HTML & CSS Daftar Kode Warna Pada HTML & CSS < / font> Catatan: Elemen font hanya mendukung pada HTML 5. Gunakan CSS sebagai ganti |
Skrip di atas akan menghasilkan tampilan seperti di bawah ini:
Daftar Kode Warna Pada HTML & CSS
Daftar Kode Warna Pada HTML & CSS
Daftar Kode Warna Pada HTML & CSS
Catatan: Elemen font hanya mendukung pada HTML 5. Menggunakan CSS sebagai ganti
Cara Menggunakan Kode Warna HTML di Background
| <! DOCTYPE html> |
Warna HEX:
Hijau
Biru
Kuning
Cerise
Kode di atas hasil tampilan seperti ini:
Warna HEX:
Merah
hijau
Biru
Kuning
Cerise
- Cara Menggunakan Kode Warna HTML di Border
| <! DOCTYPE html> |
Daftar Kode Warna Pada HTML & CSS
Nilai dari border-color dapat Menggunakan angka kode hexadecimal.
Catatan: border-color tidak dapat digunakan jika digunakan sendiri. Gunakan properti border-style terlebih dahulu untuk perbatasan.
Skrip di atas akan menampilkan tampilan seperti di bawah ini:
Daftar Kode Warna Pada HTML & CSS
Nilai dari border-color dapat diatur menggunakan kode hexadecimal.
Catatan: border-color tidak dapat digunakan jika digunakan sendiri. Gunakan properti border-style terlebih dahulu untuk perbatasan.
Kesimpulan
Penting untuk mengetahui daftar kode warna pada HTML dan CSS. Penggunaan kode warna Mudah digunakan di berbagai bagian di situs web pengembangan. Warna juga dapat mempengaruhi sisi psikologis seseorang. Menyesuaikan pilihan warna yang tepat dan menarik bagaimana pengalaman pengguna pengunjung.
Situs web yang menarik dapat membuat pengunjung betah dan tertarik untuk dikunjungi kembali. Salah satunya adalah dengan mengombinasikan beberapa warna di dalam satu halaman situs web.
Daftar kode warna pada HTML dan CSS di bagian paling bawah dapat membantu Anda untuk menentukan bagaimana cara memperbaiki situs web dan menerapkannya meminta pengunjung lebih betah dan tertarik untuk mengunjunginya lagi.
Di bawah ini ada beberapa artikel terkait dengan pengembangan situs web yang dapat Anda kunjungi untuk mendapatkan informasi lain:
- 15 Cara Desain Blog Agar Tampil Keren dan Menarik
- Situs web Hierarki Visual dalam Desain
- Situs web Makin Gesit Pakai LiteSpeed
Anda juga dapat berlangganan untuk mendapatkan informasi terbaru dari kami.