Tutorial Pewarnaan di CSS: Pewarnaan dengan RGB dan RGBA Color

Metode RGB Color merupakan metode pewarnaan berdasarkan penambahan kuat cahaya warna primer, yaitu Red, Green dan Blue.

Kuat cahaya ketiga warna tersebut direpresentasikan/dinilaikan dengan angka.

rgb dan rgba color


Nilai kuat cahaya yang diberikan pada warna Red, Green dan Blue berkisar antara 0 hingga 255 dengan 0 adalah nilai minimum dan 255 adalah nilai maksimum.

Nilai kuat cahaya juga dapat dinilaikan dengan presentase, 100% senilai dengan 255 dan 0% senilai dengan 0.
The RGB color model is an additive color model in which red, green, and blue light are added together in various ways to reproduce a broad array of colors. The name of the model comes from the initials of the three additive primary colors, red, green, and blue. -Wikipedia
Bila kita memberi nilai red, green dan blue 0, maka yang tercipta adalah warna hitam karena nilai kuat cahayanya minimum.

Sebaliknya bila kita beri nilai 255, maka yang tercipta adalah warna putih karena nilai kuat cahanya maksimum.

Misalnya kita ingin memberi warna elemen p dengan warna merah, kode CSSnya seperti ini:
p {
  color: rgb(255,0,0);
}

RGBA Color hampir serupa dengan RGB Color, bedanya adalah pada huruf A singkatan dari Alpha yang berfungsi untuk mengatur ketajaman dari suatu warna. Dinilaikan dengan angka 0 hingga 1.

Bila diberi nilai 1, ketajaman warna serupa dengan warna aslinya. Semakin rendah angkanya, warna akan lebih transparan.

Penulisan kode cssnya, hampir serupa pula. Hanya menambahkan huruf a dibelakang rgb dan nilai yang ingin diberi diletakkan setelah nilai warna biru.
p {
  color: rgba(255,0,0,0.5);
}

Ketiga warna primer tersebut memiliki 256 tingkat (nilai 0 hingga 255) sehingga warna yang dapat dibentuk dari ketiga warna tersebut berjumlah 16.777.216 warna.

Tag : Tutorial CSS
0 Komentar untuk "Tutorial Pewarnaan di CSS: Pewarnaan dengan RGB dan RGBA Color"