CSS sendiri memiliki berbagai variasi warna yang dapat digunakan untuk mengubah warna pada website (teks, latar belakang, dll.) dengan menggunakan berbagai format penulisan warna. Berikut akan dibahas penggunaannya menggunakan kata warna dan RGB.
Kata Warna
Ini merupakan yang paling mudah untuk digunakan, karena hanya perlu langsung menyebut warna yang ingin digunakan (dalam Bahasa Inggris). Terdapat 17 kata warna dasar dari VGA pada dasar windows yang disebut classic internet color. Berikut tabel ke-17 kata warna tersebut.
| Kata Warna | Nilai RGB | Contoh Warna |
|---|---|---|
| aqua | #00ffff | |
| black | #000000 | |
| blue | #0000ff | |
| fuchsia | #ff00ff | |
| gray | #808080 | |
| green | #008000 | |
| lime | #00ff00 | |
| maroon | #800000 | |
| navy | #000080 | |
| olive | #808000 | |
| orange | #ffa500 | |
| purple | #800080 | |
| red | #ff0000 | |
| silver | #c0c0c0 | |
| teal | #008080 | |
| white | #ffffff | |
| yellow | #ffff00 |
Selain warna dasar diatas, terdapat keyword warna-warna lainnya yang didukung oleh berbagai web browser modern, warna ini disebut sebagai 147 SVG color (atau x11 colors) untuk list lengkapnya dapat diakses di https://developer.mozilla.org/en-US/docs/CSS/color_value.
Model Warna RGB
RGB (Red, Green, Blue) merupakan 3 warna dasar (merah, hijau, biru) yang dapat dipadukan ketiganya untuk menghasilkan warna lainnya. Masing-masing warna bernilai dari 0 (tanpa warna) hingga 255 ( warna maksimal). Perpaduan dari ketiga warna ini dapat menghasilkan sebanyak 16.777.216 kombinasi warna yang berasal dari 256 kombinasi warna merah x 256 kombinasi warna hijau x 256 kombinasi warna biru.
Misalnya untuk warna kuning, sebenarnya merupakan penggabungan antara warna merah dan hijau. Untuk mendapatkan warna kuning terang, digunakan penggabungan warna merah sebesar 255, hijau sebesar 255, dan biru sebesar 0.
Penulisan Kode Warna #RRGGBB dan #RGB
Kedua format penulisan kode warna ini merupakan cara penulisan warna menggunakan heksadesimal. Dimana RR merupakan warna merah (Red), GG merupakan warna hijau (Green) dan BB merupakan warna biru (Blue). Masing-masing warna bernilai dari 00 (tanpa warna) hingga FF (nilai maksimal ekuivalen dengan 255 pada format warna RGB). Format penulisan kode warna ini sering digunakan dalam CSS.
Terdapat juga penulisan kode warna #RGB, bedanya penulisan ini merupakan versi singkat dari #RRGGBB. Misalnya #0F0 (hijau murni) yang sama dengan #00FF00 (merah 00, hijau FF, biru 00) dalam penulisan ##RRGGBB.
Script HTML
<!DOCTYPE html>
<html>
<head>
<title>Judul Halaman</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>Paragraf</p>
<p>Hello World!</p>
</body>
</html>
Script CSS
body {
background-color: #0f0;
}
Hasil di browser
Penulisan Kode Warna RGB Menggunakan Desimal
Selain menulis kode warna RGB menggunakan heksadesimal, CSS juga menyediakan penulisan kode warna RGB menggunakan desimal. Masing-masing warna bernilai dari 0 hingga 255 atau 0% hingga 100%. Format penulisannya adalah sebagai berikut.
rgb(50%, 50%, 0%)
atau
rgb(128, 128, 0)
Hasil di browser
Kesimpulan
Penggunaan kode warna pada CSS menggunakan RGB merupakan yang paling populer, terutama #RRGGBB. Adapun penggunaan kata warna lebih simpel karena hanya perlu menyebutkan nama warnanya secara langsung dalam Bahasa Inggris, namun tidak sebanyak kombinasi warna menggunakan kode warna RGB.
0 Komentar