Kode Warna di HTML(Hypertext Markup Language) dan CSS(Cascading Style Sheets)
Skema warna adalah salah satu faktor yang menentukan keberhasilan atau kegagalan sebuah website.Pada pemrograman,pewarnaan dilakukan dengan menggunakan kode
Ada beberapa tipe kode warna yang biasanya digunakan digunakan di dalam permograman komputer yaitu bentuk hexadecimal,HSL,HSLA,RGBA DAN RGB.
Hexadesimal tersusun dari kombinasi huruf dan angka dengan diawali dengan tanda ‘#’. Sedangkan RGB terdiri dari 3 bagian angka yang terpisah oleh tanda koma. Kode warna pada HTML menggunakan HTML triplets. Setiap dua digit kode melambangkan warna-warna red (merah), green (hijau), blue (biru) atau #RRGGBB.
Background dari sebuah website juga bagian penting yang perlu diperhatikan.Dengan adanya CSS (Cascading Style Sheets),kita bisa membuat latar belakang halaman web dan entri lainnya.
Daftar Kode Warna HTML dan CSS
Di bawah ini daftar kode warna HTML & CSS yang dapat kita gunakan untuk mempercantik website. Tidak hanya mempercantik,banyak faktor lain yang dipengaruhi oleh warna.
Langsung saja inilah daftar kode warna CSS dan HTML yang bisa kita jadikan referensi untuk color branding atau web design :
Nama Warna :Yellow Green
Kode Heximal :#9ACD32
RGB :RGB (154, 205, 49)
Nama Warna :Yellow
Kode Heximal :#FFFF00
RGB :RGB (255, 255, 0)
Nama Warna :White Smoke
Kode Heximal :#F5F5F5
RGB :RGB (245, 245, 245)
Nama Warna :White
Kode Heximal :#FFFFFF
RGB :RGB (255, 255, 255)
Nama Warna :Wheat
Kode Heximal :#F5DEB3
RGB :RGB (245, 222, 179)
Nama Warna :Violet
Kode Heximal :#EE82EE
RGB :RGB (238, 130, 238)
Nama Warna :Turquoise
Kode Heximal :#40E0D0
RGB :RGB (64, 224, 208)
Nama Warna :Tomato
Kode Heximal :#FF6347
RGB :RGB (250, 99, 71)
Nama Warna :Thistle
Kode Heximal :#D8BFD8
RGB :RGB (216, 191, 216)
Nama Warna :Teal
Kode Heximal :#008080
RGB :RGB (26, 128, 127)
Nama Warna :Tan
Kode Heximal :#D2B48C
RGB :RGB (210, 180, 140)
Nama Warna :Steel Blue
Kode Heximal :#4682B4
RGB :RGB (70, 130, 180)
Nama Warna :Spring Green
Kode Heximal :#00FF7F
RGB :RGB (63, 255, 128)
Nama Warna :Snow
Kode Heximal :#FFFAFA
RGB :RGB (255, 250, 250)
Nama Warna :Slate Gray
Kode Heximal :#708090
RGB :RGB (112, 128, 145)
Nama Warna :Slate Blue
Kode Heximal :#6A5ACD
RGB :RGB (106, 90, 205)
Nama Warna :Sienna
Kode Heximal :#A0522D
RGB :RGB (160, 82, 45)
Nama Warna :Sky Blue
Kode Heximal :#87CEEB
RGB :RGB (135, 206, 235)
Nama Warna :Silver
Kode Heximal :#C0C0C0
RGB :RGB (192, 192, 192)
Nama Warna :Salmon
Kode Heximal :#FA8072
RGB :RGB (250, 128, 114)
Nama Warna :Sea Green
Kode Heximal :#2E8B57
RGB :RGB (46, 139, 87)
Nama Warna :Sea Shell
Kode Heximal :#FFF5EE
RGB :RGB (255, 245, 238)
Nama Warna :Saddle Brown
Kode Heximal :#8B4513
RGB :RGB (139, 69, 19)
Nama Warna :Sandy Brown
Kode Heximal :#F4A460
RGB :RGB (244, 164, 95)
Nama Warna :Royal Blue
Kode Heximal :#4169E1
RGB :RGB (65, 105, 225)
Nama Warna :Rosy Brown
Kode Heximal :#BC8F8F
RGB :RGB (188, 143, 142)
Nama Warna :Red
Kode Heximal :#FF0000
RGB :RGB (255, 0, 0)
Nama Warna :Rebecca Purple
Kode Heximal :#663399
RGB :RGB (102, 51, 153)
Nama Warna :Powder Blue
Kode Heximal :#B0E0E6
RGB :RGB (176, 224, 230)
Nama Warna :Purple
Kode Heximal :#800080
RGB :RGB (128, 0, 128)
Nama Warna :Plum
Kode Heximal :#DDA0DD
RGB :RGB (221, 160, 221)
Nama Warna :Pink
Kode Heximal :#FFC0CB
RGB :RGB (252, 192, 203)
Nama Warna :Peru
Kode Heximal :#CD853F
RGB :RGB (205, 133, 63)
Nama Warna :Papaya Whip
Kode Heximal :#FFEFD5
RGB :RGB (254, 239, 213)
Nama Warna :Peach Puff
Kode Heximal :#FFDAB9
RGB :RGB (253, 218, 185)
Nama Warna :Pale Turquoise
Kode Heximal :#AFEEEE
RGB :RGB (175, 238, 239)
Nama Warna :Pale Violet Red
Kode Heximal :#DB7093
RGB :RGB (219, 112, 147)
Nama Warna :Pale Golden Rod
Kode Heximal :#EEE8AA
RGB :RGB (238, 232, 170)
Nama Warna :Pale Green
Kode Heximal :#98FB98
RGB :RGB (152, 251, 153)
Nama Warna :Orchid
Kode Heximal :#DA70D6
RGB :RGB (218, 112, 214)
Nama Warna :Navy
Kode Heximal :#000080
RGB :RGB (0, 0, 128)
Nama Warna :Orange
Kode Heximal :#FFA500
RGB :RGB (252, 165, 3)
Nama Warna :Orange Red
Kode Heximal :#FF4500
RGB :RGB (250, 69, 1)
Nama Warna :Olive
Kode Heximal :#808000
RGB :RGB (128, 128, 1)
Nama Warna :Olive Drab
Kode Heximal :#6B8E23
RGB :RGB (107, 142, 35)
Nama Warna :Old Lace
Kode Heximal :#FDF5E6
RGB :RGB (253, 245, 230)
Nama Warna :Navajo White
Kode Heximal :#FFDEAD
RGB :RGB (254, 222, 173)
Nama Warna :Moccasin
Kode Heximal :#FFE4B5
RGB :RGB (254, 228, 181)
Nama Warna :Misty Rose
Kode Heximal :#FFE4E1
RGB :RGB (254, 228, 225)
Nama Warna :Midnight Blue
Kode Heximal :#191970
RGB :RGB (25, 25, 112)
Nama Warna :Mint Cream
Kode Heximal :#F5FFFA
RGB :RGB (245, 255, 250)
Nama Warna :Medium Violet Red
Kode Heximal :#C71585
RGB :RGB (199, 21, 133)
Nama Warna :Medium Spring Green
Kode Heximal :#00FA9A
RGB :RGB (62, 250, 153)
Nama Warna :Medium Turquoise
Kode Heximal :#48D1CC
RGB :RGB (72, 209, 204)
Nama Warna :Medium Blue
Kode Heximal :#0000CD
RGB :RGB (0, 0, 205)
Nama Warna :Medium Orchid
Kode Heximal :#BA55D3
RGB :RGB (186, 85, 211)
Nama Warna :Medium Slate Blue
Kode Heximal :#7B68EE
RGB :RGB (123, 103, 238)
Nama Warna :Medium Sea Green
Kode Heximal :#3CB371
RGB :RGB (60, 179, 113)
Nama Warna :Medium Purple
Kode Heximal :#9370DB
RGB :RGB (147, 112, 219)
Nama Warna :Medium Aqua Marine
Kode Heximal :#66CDAA
RGB :RGB (102, 205, 170)
Nama Warna :Maroon
Kode Heximal :#800000
RGB :RGB (128, 4, 0)
Nama Warna :Magenta
Kode Heximal :#FF00FF
RGB :RGB (249, 0, 255)
Nama Warna :Linen
Kode Heximal :#FAF0E6
RGB :RGB (250, 240, 230)
Nama Warna :Lime Green
Kode Heximal :#32CD32
RGB :RGB (50, 205, 50
Nama Warna :Lime
Kode Heximal :#00FF00
RGB :RGB (63, 255, 0)
Nama Warna :Light Sea Green
Kode Heximal :#20B2AA
RGB :RGB (40, 178, 170)
Nama Warna :Light Steel Blue
Kode Heximal :#B0C4DE
RGB :RGB (176, 196, 222)
Nama Warna :Light Yellow
Kode Heximal :#FFFFE0
RGB :RGB (255, 255, 224)
Nama Warna :Light Slate Gray
Kode Heximal :#778899
RGB :RGB (119, 136, 153)
Nama Warna :Light Sky Blue
Kode Heximal :#87CEFA
RGB :RGB (135, 206, 250)
Nama Warna :Light Salmon
Kode Heximal :#FFA07A
RGB :RGB (251, 160, 122)
Nama Warna :Light Pink
Kode Heximal :#FFB6C1
RGB :RGB (252, 182, 193)
Nama Warna :Light Green
Kode Heximal :#90EE90
RGB :RGB (144, 238, 144)
Nama Warna :Light Gray
Kode Heximal :#D3D3D3
RGB :RGB (211, 211, 211)
Nama Warna :Light Goldenrod Yellow
Kode Heximal :#FAFAD2
RGB :RGB (250, 250, 210)
Nama Warna :Light Cyan
Kode Heximal :#E0FFFF
RGB :RGB (224, 255, 255)
Nama Warna :Light Coral
Kode Heximal :#F08080
RGB :RGB (240, 128, 128)
Nama Warna :Light Blue
Kode Heximal :#ADD8E6
RGB :RGB (173, 216, 230)
Nama Warna :Lawn Green
Kode Heximal :#7CFC00
RGB :RGB (124, 252, 2)
Nama Warna :Lemon Chiffon
Kode Heximal :#FFFACD
RGB :RGB (255, 250, 205)
Nama Warna :Lavender
Kode Heximal :#E6E6FA
RGB :RGB (230, 230, 250)
Nama Warna :Lavender Blush
Kode Heximal :#FFF0F5
RGB :RGB (254, 240, 245)
Nama Warna :Indigo
Kode Heximal :#4B0082
RGB :RGB (75, 0, 130)
Nama Warna :Indian Red
Kode Heximal :#CD5C5C
RGB :RGB (205, 92, 92)
Nama Warna :Khaki
Kode Heximal :#F0E68C
RGB :RGB (240, 230, 140)
Nama Warna :Ivory
Kode Heximal :#FFFFF0
RGB :RGB (255, 255, 239)
Nama Warna :Hot Pink
Kode Heximal :#FF69B4
RGB :RGB (240, 255, 240)
Nama Warna :Honey Dew
Kode Heximal :#F0FFF0
RGB :RGB (240, 255, 240)
Nama Warna :Green Yellow
Kode Heximal :#ADFF2F
RGB :RGB (173, 255, 48)
Nama Warna :Green
Kode Heximal :#008000
RGB :RGB (27, 128, 1)
Nama Warna :Gray
Kode Heximal :#808080
RGB :RGB (128, 128, 128)
Nama Warna :Gold
Kode Heximal :#FFD700
RGB :RGB (253, 215, 3)
Nama Warna :Golden Rod
Kode Heximal :#DAA520
RGB :RGB (218, 165, 32)
Nama Warna :Gainsboro
Kode Heximal :#DCDCDC
RGB :RGB (220, 220, 220)
Nama Warna :Ghost White
Kode Heximal :#F8F8FF
RGB :RGB (248, 248, 255)
Nama Warna :Dim Gray
Kode Heximal :#696969
RGB :RGB (105, 105, 105)
Nama Warna :Fuchsia
Kode Heximal :#FF00FF
RGB :RGB (249, 0, 255)
Nama Warna :Forest Green
Kode Heximal :#228B22
RGB :RGB (34, 139, 35)
Nama Warna :Fire Brick
Kode Heximal :#B22222
RGB :RGB (178, 34, 33)
Nama Warna :Floral White
Kode Heximal :#FFFAF0
RGB :RGB (255, 250, 240)
Nama Warna :Dodger Blue
Kode Heximal :#1E90FF
RGB :RGB (30, 144, 255)
Nama Warna :Deep Pink
Kode Heximal :#FF1493
RGB :RGB (249, 19, 147)
Nama Warna :Deep Sky Blue
Kode Heximal :#00BFFF
RGB :RGB (43, 191, 254)
Nama Warna :Dark Violet
Kode Heximal :#9400D3
RGB :RGB (148, 0, 211)
Nama Warna :Dark Turquoise
Kode Heximal :#00CED1
RGB :RGB (48, 206, 209)
Nama Warna :Dark Slate Gray
Kode Heximal :#2F4F4F
RGB :RGB (47, 79, 79)
Nama Warna :Dark Slate Blue
Kode Heximal :#483D8B
RGB :RGB (72, 61, 139)
Nama Warna :Dark Sea Green
Kode Heximal :#8FBC8F
RGB :RGB (143, 188, 144)
Nama Warna :Dark Salmon
Kode Heximal :#E9967A
RGB :RGB (233, 150, 122)
Nama Warna :Dark Red
Kode Heximal :#8B0000
RGB :RGB (139, 5, 0)
Nama Warna :Dark Orchid
Kode Heximal :#9932CC
RGB :RGB (153, 50, 204)
Nama Warna :Dark Orange
Kode Heximal :#FF8C00
RGB :RGB (251, 140, 1)
Nama Warna :Dark Olive Green
Kode Heximal :#556B2F
RGB :RGB (85, 107, 47)
Nama Warna :Dark Magenta
Kode Heximal :#8B008B
RGB :RGB (139, 0, 140)
Nama Warna :Dark Khaki
Kode Heximal :#BDB76B
RGB :RGB (189, 183, 107)
Nama Warna :Dark Green
Kode Heximal :#006400
RGB :RGB (19, 100, 0)
Nama Warna :Dark Gray
Kode Heximal :#A9A9A9
RGB :RGB (169, 169, 169)
Nama Warna :Dark Golden Rod
Kode Heximal :#B8860B
RGB :RGB (184, 134, 11)
Nama Warna :Dark Cyan
Kode Heximal :#008B8B
RGB :RGB (29, 139, 139)
Nama Warna :Dark Blue
Kode Heximal :#00008B
RGB :RGB (0, 0, 139)
Nama Warna :Cyan
Kode Heximal :#00FFFF
RGB :RGB (62, 254, 255)
Nama Warna :Crimson
Kode Heximal :#DC143C
RGB :RGB (220, 20, 60)
Nama Warna :Cornsilk
Kode Heximal :#FFF8DC
RGB :RGB (225, 248, 220)
Nama Warna :Cornflower Blue
Kode Heximal :#6495ED
RGB :RGB (100, 149, 237)
Nama Warna :Coral
Kode Heximal :#FF7F50
RGB :RGB (251, 127, 80)
Nama Warna :Chartreuse
Kode Heximal :#7FFF00
RGB :RGB (127, 255, 1)
Nama Warna :Chocolate
Kode Heximal :#D2691E
RGB :RGB (210, 105, 30)
Nama Warna :Cadet Blue
Kode Heximal :#5F9EA0
RGB :RGB (95, 158, 160)
Nama Warna :Burly Wood
Kode Heximal :#DEB887
RGB :RGB (222, 184, 135)
Nama Warna :Brown
Kode Heximal :#A52A2A
RGB :RGB(165, 42, 42)
Nama Warna :Blue Violet
Kode Heximal :#8A2BE2
RGB :RGB (138, 43, 226)
Nama Warna :Blue
Kode Heximal :#0000FF
RGB :RGB (0, 0, 255)
Nama Warna :Black
Kode Heximal :#000000
RGB :RGB (0, 0, 0)
Nama Warna :Aquamarine
Kode Heximal :#7FFFD4
RGB :RGB (115, 255, 216
Nama Warna :Beige
Kode Heximal :#F5F5DC
RGB :RGB (245, 245, 223)
Nama Warna :Bisque
Kode Heximal :#FFE4C4
RGB :RGB (255, 227, 200)
Nama Warna :Blanched Almond
Kode Heximal :#FFEBCD
RGB :RGB (255, 234, 208)
Nama Warna Azure
Kode Heximal :#F0FFFF
RGB :RGB (239, 255, 255)
Nama Warna :Aqua
Kode Heximal :#00FFFF
RGB :RGB (0, 255, 254)
Nama Warna :Alice Blue
Kode Heximal :#F0F8FF
RGB :RGB (240, 248, 254)
Nama Warna :Antique White
Kode Heximal :#FAEBD7
RGB :RGB (251, 235, 217)
Daftar kode warna diatas setidaknya membantu kita untuk memahami cara mewarnai website dan menerapkannya agar pengunjung nyaman dan betah untuk mengunjungi website kita.
Selain menggunakan kode warna,kita dapat menggunakan generator untuk menentukan kode warna apa saja yang bisa digunakan.Kita dapat menggunakan generator warna yang disediakan oleh beberapa website di bawah ini.
W3School HTML Color Picker
Situs ini dapat digunakan untuk memilih warna berdasarkan warna dasar. Kita dapat memilih tingkat saturasi dan melihat langsung (preview) hasilnya,terdapat juga pilihan untuk memasukkan warna berdasarkan kode dan juga memunculkan jendela HTML 5 untuk pemilihan warna.
HTML Color Code
Situs ini menyediakan tampilan pemilihan warna.Kita tinggal mengarahkan kursor ke dalam tabel warna atau menggeser slider untuk mendapatkan warna yang sesuai dengan kode warna dalam bentuk hexadecimal.
Colors and Skillshare
Situs ini digunakan sebagai alat schema generator. Jika kita seorang desainer,situs ini memberikan saran schema yang sesuai dengan kebutuhan & tersedia juga kode hexadecimal yang bisa digunakan ke dalam website.
Cara Penggunaan Kode Warna
Penggunaan kode warna untuk HTML BACKGROUND
Kita bisa menerapkan kode warna HEX langsung pada elemen HTML <body> menggunakan atribut style seperti di bawah ini.
<body style=”background-color:#9ACD32;”>
</body>
Namun, perlu diingat bahwa langkah-langkahnya mungkin berbeda, tergantung pada elemen-elemen tersebut sebaris atau bertingkat.Metode ini digunakan untuk menata hampir semua elemen HTML.
Penggunaan kode warna untuk HTML FONT
untuk mengubah warna pada satu atau sebagian kecil teks, kamu bisa menggunakan tag font yang lama dengan format:
<font color = “#9ACD32”> text </font>
Atau bisa juga seperti ini
<font color = “green”> text </font>
Sejumlah browser baru memungkinkan kita untuk memberi nama warna, seperti yang dicontohkan di atas, tetapi opsi yang kita punya lebih terbatas.
Memilih warna untuk website bukan berarti memilih warna yang kita suka.Kita harus bisa memastikan juga warna yang kita pilih bisa memperkuat website atau merek bisnis yang kita jalankan.
Warna dapat mempengaruhi website kita,karena warna mampu menciptakan ide,pesan,dan memicu minat klien atau pengunjung.
Sekian artikel kali ini,semoga bisa membantu anda dalam memilih kode warna untuk website anda 🙂
selamat mencoba ya
BACA JUGA :
PENGERTIAN DAN CARA ENABLE SFTP FILEZILLA DI CPANEL HOSTING
TOOLS YANG DIGUNAKAN UNTUK MENINGKATKAN CRM (CUSTOMER RELATIONSHIP MANAGEMENT)
MENGENAL PERBEDAAN TENTANG REGISTRY, REGISTRAR DAN REGISTRANT
SWOT : PENGERTIAN, UNSUR, DAN CONTOH
PENGERTIAN DAN PERBEDAAN COPYRIGHT, TRANDEMARK DAN HAK PATEN PRODUK
BERIKUT REKOMENDASI APLIKASI KASIR TERBAIK UNTUK ANDA
