Belum tahu tentang apa itu kode hex warna?
Atau sedang mencari contoh daftar kodenya?
Sebagai seorang desainer grafis ataupun desainer web, teman-teman perlu mengetahui kode hex warna ini untuk penerapan di dalam desain, css, ataupun di html.
Ingat, kode hex warna ini tidak wajib dihafal ya. Baca hingga akhir untuk menambah wawasan kita bersama-sama.
Baca juga: Perbedaan antara Model Warna RGB dan CMYK
Apa itu Kode HEX Warna?

Pengertian kode HEX warna adalah suatu nilai warna hexadecimal (heksadesimal) untuk mengidentifikasikan bermacam jenis model warna yang akan ditampilkan.
Warna yang dihasilkan ini hasil dari gabungan antara tiga nilai yaitu:
- Merah, Hijau, dan Biru yang lebih kita kenal dengan sebutan RGB.
Sistem pewarnaan HEX ini sudah menjadi bagian yang sering kita jumpai dalam dokumen CSS, HTML dalam desain web dan untuk merepresentasikan format warna digital.
Baca juga: Mengulas Arti Warna Populer
Bagaimana Kode HEX Warna Digunakan?
Teknologi modern saat ini umumnya menggunakan sistem warna RGB.
Dan mungkin iya atau mungkin juga tidak, bisa menggunakan nilai heksagonal untuk mewakilinya.
Perlu teman-teman ketahui secara umum, bahwa pengguna baru kurang akrab dengan kode warna hex di awal belajar HTML ataupun software desain.
Namun, teknologi terbaru yang masih menggunakan warna digital tetap menangkap nilai heksagonal dan representasi warna.
Alasan paling mudah untuk menggunakan angka heksadesimal adalah representasi nilai dalam kode biner yang ramah untuk manusia.
Maksudnya mudah dipahami oleh kebanyakan manusia.
Kode warna hex sendiri dimulai dengan tanda pound atau hashtag (#) lalu diikuti oleh enam huruf dan/atau angka.
Dua huruf atau angka pertama mengacu pada merah, dua berikutnya mengacu pada hijau, dan dua terakhir mengacu pada biru.
Nilai warna ditentukan dalam nilai antara 00 dan FF (bukan dari 0 hingga 255 dalam RGB).
Angka digunakan jika nilainya 1-9. Huruf digunakan bila nilainya lebih tinggi dari 9.
Sebagai contohnya:
A=10
B=11
C = 12
D = 13
E=14
F = 15
Baca juga: Pengertian Animasi, Sejarah, Fungsi, Jenis, dan 5 Contohnya
Kelebihan dan Kekurangan HEX Color Code
Menurut Kingstone Job, kode hex memiliki kelebihan dalam menciptakan berbagai macam warna ketimbang warna dasar seperti merah.
Selain itu terdapat banyak warna yang kita tidak tahu nama spesifiknya.
Dan cara terbaik untuk menghasilkan warna tersebut adalah dengan menemukan kode hex warna.
Perlu Anda ketahui juga bahwa,
Sebagai sistem warna untuk desain grafis dan desain web, heksadesimal mempunyai kelebihan dan kekurangan, yaitu:
Kelebihan
Berikut adalah sejumlah kelebihannya:
- Penulisan cepat, karena sistem warna HEX menggunakan warna primer (dasar) antara lain: hitam, putih, merah.
- Hampir semua jenis browser (peramban) mampu menangkap warna dengan kode HEX tanpa takut hasilnya tidak tampil.
Kekurangan
Berikut adalah beberapa kekurangannya:
- Memerlukan aplikasi pihak ketiga untuk menemukan kode warna yang tepat.
- Dan karena itu Anda sebagai desainer akan merasa kesulitan dalam menentukan kode warna yang akurat atau sesuai.
Baca juga: Mengenal Apa itu Flat Design dan Contohnya
Perbedaan Warna HEX dengan RGB
Menurut Joshua Rystedt, sebetulnya tidak ada perbedaan informasi antara warna RGB dan HEX.
Keduanya hanyalah cara yang berbeda untuk mengkomunikasikan hal yang sama, yaitu nilai warna merah, hijau, dan biru.
HEX bersama dengan RGB, adalah salah satu “bahasa” warna yang digunakan dalam pengkodean seperti pada HTML, CSS, dan software desain.
Intinya, HEX adalah referensi berbasis karakter numerik dari angka RGB.
Baca juga: Mengenal Resolusi PPI, DPI, dan LPI
Cara Mengetahui Kode HEX Warna dari Sebuah Situs dan Gambar atau Foto

Penasaran kode HEX dari warna yang ada pada situs web hingga pada gambar yang Anda lihat?
Ada cara mudah untuk mengetahuinya lho!
Teman-teman hanya perlu mengunjungi situs imagecolorpicker kemudian unggah gambar, foto, atau hasil screenshot situs web yang ingin Anda ketahui kode warnanya.
Namun, jika Anda mempunyai aplikasi Adobe Photoshop, teman-teman juga bisa menggunakannya untuk mengecek kode warna.
Caranya tinggal gunakan tools color picker di Photoshop, lalu seret kursor ke objek yang ingin Anda cek warnanya.
Selesai, semudah itu!
Baca juga: Perbedaan Vektor vs Bitmap yang Perlu Anda Tahu
Daftar Kode Hex Warna
Sekarang kita masuk ke bagian yang ditunggu-tunggu nih.
Anda ingin tahu apa saja kode warna pada nilai heksadesimal ini? Yuk silahkan cek di bawah.
Kode Hex Warna Hitam
#000000 adalah kode warna untuk warna hitam.
Kode Hex Warna Kuning
#FFFF00 adalah kode warna untuk warna kuning.
Kode Hex Warna Merah
#FF0000 adalah kode untuk warna merah.
Kode Hex Warna Putih
#FFFFFF adalah kode untuk warna putih.
Kode Hex Warna Biru
#0000FF adalah kode untuk warna biru.
Kode Hex Warna Gold (Emas)
#FFD700 adalah kode untuk warna emas.
Kode Hex Warna Hijau
#008000 adalah kode untuk warna hijau.
Kode Hex Warna Coklat
#964B00 adalah kode untuk warna coklat.
Kode Hex Warna Pas Foto
#DB1514 adalah kode warna untuk warna merah pas foto.
#0090FF adalah kode warna untuk warna biru pas foto.
Contoh Kode Hex Lainnya
Ivory = #FFFFF0
Gray / Abu-abu = #808080
Silver = #C0C0C0
Purple / Ungu = #800080
Orange / Jingga = #FFA500
Merah Maroon = #800000
Fuchsia = #FF00F
Baca juga: Pengertian DKV dan Posisi Kerja Lulusan DKV
Adakah Sistem Pengkodean Warna Lainnya?
Penting untuk teman-teman catat bahwa sistem warna RGB bukan satu-satunya sistem warna yang digunakan dalam dunia teknologi.
Sistem warna berbeda yang dikenal sebagai CMYK atau cyan, yellow, magenta dan black, juga digunakan untuk mengelola pencetakan warna.
Namun, sistem RGB ini lebih mendominasi dalam representasi gambar digital.
Penutup
Jadi Kode HEX Warna merupakan bagian dari cara-cara memasukkan warna pada dokumen desain, css, ataupun html.
Selain daripada itu, ada juga istilah lainnya semisal LAB, LUV, HSL, HWB, dan yang lainnya.
Namun akan kami ulas pada tulisan selanjutnya, jadi silahkan berlangganan agar tidak terlewat tulisan terbaru di ApriDesain.
Demikian artikel mengenai pengertian HEX warna dan daftar kode HEX warna ini. Apabila ada pertanyaan atau ingin menambahkan, silakan tuliskan pesan Anda di kolom komentar atau hubungi kami di halaman kontak ini.