HTML RGB Colors

Bab 1: Dasar Teori Cahaya Digital

Dalam dunia digital, warna ditampilkan menggunakan model cahaya aditif. Artinya, warna dihasilkan dari pencampuran tiga sumber cahaya utama: Red (Merah), Green (Hijau), dan Blue (Biru).

Inilah yang disebut dengan format RGB. Setiap piksel di layar monitor Anda sebenarnya terdiri dari tiga lampu kecil ini.

Bab 2: Intensitas dan Pencampuran

Nilai 0 berarti cahaya dimatikan (gelap), sedangkan nilai 255 berarti cahaya dinyalakan maksimal (terang).

<h2 style="background-color:rgb(255, 0, 0);">Merah</h2>
<h2 style="background-color:rgb(0, 255, 0);">Hijau</h2>
<h2 style="background-color:rgb(0, 0, 255);">Biru</h2>

Bab 3: Shades of Grey (Abu-abu)

Warna abu-abu dihasilkan ketika ketiga nilai (Merah, Hijau, Biru) diset sama. Semakin rendah angkanya, semakin gelap abu-abunya.

• rgb(50, 50, 50): Abu-abu Gelap (Dark Grey)
• rgb(128, 128, 128): Abu-abu Sedang (Grey)
• rgb(200, 200, 200): Abu-abu Terang (Light Grey)

Bab 4: RGBA (Alpha Channel)

HTML5 memperluas model RGB dengan menambahkan parameter keempat: Alpha. Parameter ini menentukan tingkat Opasitas (Ketebalan/Transparansi) sebuah warna.

Syntax-nya adalah: rgba(red, green, blue, alpha).

<p style="background-color:rgba(255, 0, 0, 1);">Merah Solid</p>
<p style="background-color:rgba(255, 0, 0, 0.5);">Merah 50%</p>
<p style="background-color:rgba(255, 0, 0, 0.1);">Merah 10%</p>

⚡ Proyek Kilat: Desain Kartu Gradasi

Misi Anda adalah membuat tampilan kartu dengan efek transparansi modern. Gunakan RGBA untuk membuat latar belakang teks menjadi semi-transparan sehingga menyatu dengan latar belakang halaman.

Pusat Dokumentasi Developer

Jangan hafalkan kodenya, cukup pahami logikanya. Kalau kamu butuh jawaban cepat saat lagi ngoding, kamu bisa intip dokumentasi teknis di bawah ini: