Warna Dalam CSS

Jika kita mendesain web dengan memanfaatkan CSS,maka kita bisa mengatakan  bahwa penggunaan warna dalam CSS bisa menghadirkan 16.777.216 kombinasi warna.Jumlah warna ini wajar,sebab CSS mendukung penggunaan warna dengan sistem RGB.


RGB merupakan singkatan dari Red Green dan Blue/Merah Hijau dan Biru.Dimana ketiga warna ini dikombinasikan/dipadukan sehingga bisa menghasilkan 16.777.216 warna dengan masing-masing warna (merah,hijau dan biru) memiliki nilai 0 sampai dengan 255.Dengan demikian kita bisa membuat 256 kombinasi merah x 256 kombinasi hijau x 256 kombinasi biru sehingga didapat 16.777.216 warna.

FORMAT WARNA HEXADECIMAL

Saat bekerja dengan CSS,kita bisa menghadirkan warna dengan memanfaatkan format penulisan warna #RRGGBB atau yang disebut dengan istilah format hexadecimal.RR adalah nilai untuk warna merah,GG hijau dan BB biru.Masing-masing nilai dapat berisi angka 00 sampai dengan FF.

Sebagai contoh #FF0000 akan menghasilkan warna merah,sementara #00FF00 menghasilkan warna hijau dan begitu pula dengan #0000FF akan menghasilkan warna biru.

FORMAT #RGB

Format lain yang didukung oleh CSS adalah format RGB,atau sering disebut  format 3 digit RGB.Format ini sebenarnya merupakan versi singkat dari format hexadecimal.#RGB sendiri merupakan penulisan singkat dari #RRGGBB sehingga jika kita menemukan kode #FOF maka kode tersebut merupakan singkatan dari #FF00FF.

FORMAT PENULISAN DESIMAL

Selain hexadecimal,CSS juga mendukung penulisan warna yang menggunakan sistem angka desimal.Cara penulisannya adalah : rgb(0,15,200) atau rgb(4%,5%,100%).Urutan warnanya sama yaitu angkat pertama untuk merah,dan selanjutnya untuk hijau dan biru.

FORMAT NAMA WARNA

Jika kita pusing menggunakan penulisan-penulisan sebelumnya,kita dapat menuliskan langsung nama warna yang ingin kita gunakan.Hanya,kekurangannya adalah CSS tidak mendukung banyak warna untuk format penulisan nama warna.Setidaknya kira-kira ada 17 nama warna yang bisa digunakan yaitu: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white dan yellow.

MENGENAL NILAI PROPERTY TRANSPARENT

Selain warna,mungkin seringkali kita membutuhkan transparan.Untuk keperluan ini ,CSS menyediakan keyword transparent  yang diatur sebagai nilai.Dengan memberi nilai transparan,maka sebuah tag akan mengabaikan warna dari tag lain.Sebagai contoh :

<!DOCTYPE HTML>

<html>
<head>
<title>Latihan Warna</title>

<style text="text/css">

p.biru {color: blue;}
p.transparan {color: transparent;}

</style>

</head>

<body>

<p class="biru"> Teks ini berwarna biru</p>
<p class="transparan">Teks ini tembus pandang</p>

</body>
</html>

Hasilnya akan menjadi teks pertama akan berwarna biru sedangkan teks kedua tidak terlihat.Jika ingin melihat hasil teks kedua,blok/sortir teks di bawah teks pertama agar terlihat.

Sekian pembahasan mengenai format penulisan warna dalam CSS.Terima kasih !

Comments