Cara Menulis Kode Warna Dalam CSS

CSS adalah gerbang menuju website yang menarik dan penuh warna. Oleh karena itu sebagai web developer pemula, Anda perlu memperlajari terlebih dahulu tentang kode warna yang ada dalam CSS.

Setelah sebelumnya kita mempelajari tentang cara mengatur font dengan CSS, maka pada tutorial berikut kita akan mempelajari tentang cara membuat menulis kode warna dengan CSS

Bila dalam dunia televisi atau mungkin printing Anda mengenal dengan istilah RGB atau CMYK, maka dalam dunia CSS kalian kode Heximal. Nah, kode Heximal ini lah yang akhirnya CSS convert ke dalam tampilan website Anda di Front End dengan warna yang sesuai Anda harapkan.

Kode warna CSS perlu Anda pelajari karena:

1. CSS mendukung hingga 16.777.216 kombinasi warna. Warna ini berasal dari perpaduan warna RGB, atau CMYK yang sebelumnya telah disebutkan.
2. Masing-masing warna dasar bernilai 0 sampai 255, dimana 0 adalah tanpa warna, 255 adalah warna maksimal.
3. Perpaduan ketiga warna tadi akan memberi 256 kombinasi merah x 256 kombinasi hijau x 256 kombinasi biru = 16.777.216 kombinasi warna.

Rumit bukan? Yah kurang-lebih nya seperti itu.

Sebagai contoh bila Anda ingin menggunakan warna kuning dalam tampilan website Anda, maka Anda harus mencampurkan merah sebanyak 255, hijau sebanyak 255, dan biru sebanyak 0. Karena kuning adalah perpaduan antara warna merah dan hijau.

Oke selanjutnya adalah format penulisan warna dalam CSS. Terdapa 4 (empat) cara, apa saja? Yakni:

1. Format #RRGGBB
2. Format #RGB
3. Desimal
4. Keyword

Mari kita bahas dari yang paling pertama dahulu yakni Format #RRGGBB:

1. Format #RRGGBB

Format penulisan warna #RRGGBB ini adalah yang paling populer digunakan untuk CSS. Tentunya sudah bukan asing lagi ya, bahwa RR adalah nilai untuk warna merah, GG untuk hijau, dan BB untuk warna biru.

Masing-masing nilai ini berisi angka 00 sampai dengan FF. Nah apa itu FF? FF adalah nilai maksimal, karena CSS menggunakan angka hexadecimal dan FF equivalen dengan 255 dalam nilai decimal.

Oke langsung ke contohnya :

#FF0000 adalah warna merah murni, #00FF00 adalah warna hijau murni, sedangkan #777777 adalah kode untuk warna silver.

1. Format #RGB

Format ini juga cukup populer dan hanya secara sederhana saja. Sebagai contoh: #RGB merupakan penulisan singkat dari #RRGGBB, lalu #F0F adalah singkatan dari #FF00FF, dan #09A sama dengan #0099AA.

Dengan estimasi warna: merah=00, hijau=99, biru=AA

• Desimal

Sejujurnya, format penulisan ini tidak terlalu banyak digunakan. Namun tidak rugi juga untuk dipelajari. Format penulisan decimal adalah sebagai berikut:

RGB(0, 160, 255) atau RGB(0%, 63%, 100%)

Nah, keduanya sama saja, apakah Anda mau menggunakan format angka 0 – 255 atau 0% – 100% . Lalu apabila ternyata Anda menuliskan angka di luar kedua angka tadi, maka CSS secara otomatis akan menyamakannya dengan nilai yang terdekat.

• Keyword

Untuk pemula, mungkin keyword adalah favorit. Pasalnya ini yang cukup mudah untuk digunakan, walaupun hanya terdapat kurang lebih 17 warna saja. Yaitu: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, dan yellow.

Nah itu dia tadi, bagaimana Anda belajar warna dalam CSS. Semoga tutorial ini bermanfaat dalam proses belajar CSS Anda, sampai jumpa pada tutorial yang lainnya ya!