HTML Warna

Penggunaan Warna dalam HTML

Dalam HTML terdapat 4 jenis warna berdasarkan cara ekstraksinya* termasuk warna aslinya antara lain :

1. Nama warna
2. HEX (Hexadesimal)
3. RGB (Red Green Blue)
4. HSL (Hue, Saturasi, Lightness)
5. HWB (Hue, Whitness, Blackness)

*Ekstraksi yang dimaksud adalah metode untuk menghasilkan warna turunan dari warna asli.

Metode ekstraksi RGB, HSL, HWB umumnya ditambahkan huruf A dibelakang menjadi RGBA, HSLA, HWBA.
Dimana A berasal dari Alpha channel atau terkait Opacity (kadar kegelapan warna).

Diantara 4 metode diatas, yang paling umum digunakan adalah nama warna (color name) dan HEX.
Pada dasarnya nama warna dan HEX menghasilkan jenis warna yang sama, hanya saja untuk HEX memiliki lebih banyak jenis warna karena menggunakan metode pencampuran warna berdasarkan nomor warna dengan metode HEXADECIMAL, oleh karena itu disebut kode warna HEX (HEX color codes)

Setelah nama warna dan HEX, diantara yang paling umum digunakan adalah RGB / RGBA karena terdapat unsur transparasinya.

Disini kita akan membahas 3 jenis warna tersebut. Karena dari ke 3 jenis warna ini, sudah lebih dari cukup untuk memenuhi kebutuhan penggunaan warna dalam HTML.

Color Name

Sebelum perkembangannya, HTML hanya mengenali 16 warna yaitu :

Black Gray Silver White

Yellow Lime Aqua Fuchsia

Red Green Blue Purple

Maroon Olive Navy Teal

Saat ini pada browser modern, terdapat 140 nama warna yang dapat digunakan dalam HTML.

Warna HTML, Kode HEX, Kode RGB(A)

Berikut ini tabel warna dasar yang biasa digunakan beserta kode HEX & RGB(A)

Nama/HEX RGB(A)

White #FFFFFF rgb(255, 255, 255)

Silver #C0C0C0 rgb(192, 192, 192)

Gray #808080 rgb(128, 128, 128)

Black #000000 rgb(0, 0, 0)

Red #FF0000 rgb(255, 0, 0)

Maroon #800000 rgb(128, 0, 0)

Yellow #FFFF00 rgb(255, 255, 0)

Olive #808000 rgb(128, 128, 0)

Nama/HEX RGB(A)

Lime #00FF00 rgb(0, 255, 0)

Green #008000 rgb(0, 128, 0)

Aqua #00FFFF rgb(0, 255, 255)

Teal #008080 rgb(0, 128, 128)

Blue #0000FF rgb(0, 0, 255)

Navy #000080 rgb(0, 0, 128)

Fuchsia #FF00FF rgb(255, 0, 255)

Purple #800080 rgb(128, 0, 128)