Mudah Belajar CSS Part 6 : CSS Color

Assalamu'alaikum W.W

Pada tutorial sebelumnya kita telah mebahas Jenis-jenis Selector CSS selanjutnya rekayasa ternak lele akan memberikan sedikit penjelasan tentang CSS Color. Oke langsung aja ke TEkaPE!!!

Judul
Mudah Belajar  CSS Part 6: CSS Color

Pengertian

Menurut Wikipedia CSS adalah “kode yang digunakan untuk mendefenisikan desain dari bahasa markup”.Salah satu bahasa markup lainnya HTML.

Secara umum CSS (Cascading Style Sheet) adalah kumpulan kode yang digunkanan untuk memformat halaman web yang ditulis dengan HTML maupun XHTML.

Latar Belakang

CSS merupakan salah satu modal dasar jika ingin menjadi web developer. Oleh karena itu, CSS sangat penting untuk dipahami dan dimengerti.

Maksud dan Tujuan
Bisa, mengerti dan memahami sintak-sintak CSS

Alat dan Bahan
Text Editor dan PC

Jangka Waktu
1 Jam

Pembahasan

Ada beberapa format penulisan warna pada CSS, diantaranya menggunakan nama warna yang telah ditentukan, atau RGB, HEX, HSL, RGBA, nilai HSLA.

Nama Warna

Warna dapat dipanggil langsung dengan namanya dalam bahasa inggris. HTML dan CSS sudah mendefinisikan 140 nama warna standar.

RGB

Warna juga dapat ditulis dengan menggunakan format rgb(red, green, blue). Format ini mendukung lebih banyak warna spesifik di luar yang sudah didefinisikan namanya.

Setiap parameter (merah, hijau, dan biru) mendefinisikan intensitas warna antara 0 dan 255.

Misalnya, rgb (255, 0, 0) ditampilkan sebagai warna merah, karena merah diatur ke nilai tertinggi (255) dan yang lainnya diatur ke 0.

Untuk menampilkan warna hitam, semua parameter warna harus diset ke 0, seperti ini: rgb (0, 0, 0).

Untuk menampilkan warna putih, semua parameter warna harus disetel ke 255, seperti ini: rgb (255, 255, 255).
Jika ingin explorasi warnanya bisa kunjungi link ini.

HEXADECIMAL
Format penulisan warne hexadesimal adalah #RRGGBB, dimana RR (red), GG (green) dan BB (blue) adalah nilai untuk intensitas warna dengan rentang nilai 0 - FF dalam sistem bilangan hexadesimal. Contohnya, #00FF00 akan menampilkan warna green, atau setara dengan rgb(0, 255, 0).
Kode warna hexadesimal juga dapat dibuat lebih sederhana lagi, dengan hanya menggunakan satu digit hexadesimal untuk setiap warna dasar, dengan format penulisan #RGB. Masing-masing warna dasar memiliki rentang nilai 0 - F, sehingga variasi warnanya pun lebih terbatas dibanding dengan format sebelumya.
Jika ingin explorasi warnanya bisa kunjungi link ini.

HSL VALUE

Hue adalah tingkat pada roda warna dari 0 sampai 360. 0 berwarna merah, 120 berwarna hijau, dan 240 berwarna biru.

Saturasi adalah nilai persentase, 0% berarti warna abu-abu, dan 100% adalah warna penuh.

Lightness juga persentase, 0% berwarna hitam, 50% tidak ringan atau gelap, 100% berwarna putih

RGBA

Nilai warna RGBA merupakan perpanjangan dari nilai warna RGB dengan saluran alfa - yang menentukan keburaman untuk warna.

Nilai warna RGBA ditentukan dengan: rgba(red, green, blue, alpha).

HSLA

Nilai warna HSLA merupakan perpanjangan dari nilai warna HSL dengan alpha channel - yang menentukan opacity untuk sebuah warna.

Nilai warna HSLA ditentukan dengan: hsla (hue, saturation, lightness, alpha).

Contoh penggunaan warna:

Kesimpulan

CSS memilki banyak variant warna, kita bisa menggunakan salah satu dari atas.

Referensi

https://www.w3schools.com/colors/colors_names.asp
http://www.duniailkom.com/tutorial-belajar-css-penulisan-kode-warna-pada-css/

Share this post