Langkau ke kandungan
Guide Apr 5, 2026 · 6 min read

Bagaimana Komputer Mencipta Warna: RGB, HEX, dan Nombor Binari

#FF0000. #00FF00. #0000FF. Notasi ini pasti pernah anda temui dalam reka bentuk atau kod. Nampak seperti sandi, atau mungkin kod permainan. Sebenarnya, ini adalah nama warna.

#FF0000
#00FF00
#0000FF

Dari atas ke bawah: merah, hijau, biru. Itulah nama yang digunakan komputer untuk merujuk warna. Mari kita urai dari mana notasi ini berasal.

RGB — Tiga Huruf Pembentuk Warna

Red, Green, Blue. Tiga warna primer cahaya. Semua warna yang kita lihat terhasil daripada campuran ketiga-tiganya dalam nisbah tertentu.

Kita Melihat RGB Setiap Hari

Di mana sahaja terdapat skrin, hampir pasti terdapat RGB.

  • Monitor / TV — Setiap piksel terdiri daripada tiga titik: merah, hijau, dan biru
  • Skrin telefon pintar — Struktur yang sama, piksel yang lebih kecil
  • LED papan kekunci gaming — Tiga LED R·G·B pada setiap kekunci
  • Lampu kes PC — Jalur RGB ialah isyarat RGB itu sendiri

Jika anda membesarkan skrin dengan cukup, anda akan melihatnya. Merah, hijau, biru. Itulah sahaja yang ada. Berjuta-juta titik RGB kecil bergabung membentuk satu imej yang kita lihat.

Warna Dihasilkan dengan Mencampur

Setiap saluran RGB mempunyai kekuatan dari 0 hingga 255.

  • RGB(255, 0, 0) — Merah sahaja pada maksimum → merah tulen
  • RGB(0, 255, 0) — Hijau sahaja pada maksimum → hijau tulen
  • RGB(255, 255, 0) — Merah + hijau → kuning
  • RGB(0, 0, 0) — Semua dimatikan → hitam
  • RGB(255, 255, 255) — Semua pada maksimum → putih

Mungkin terasa pelik bahawa merah dicampur hijau menghasilkan kuning, namun ini adalah sintesis cahaya. Ini berbeza daripada mencampur cat semasa pelajaran seni (merah + hijau = perang). Cahaya semakin terang apabila ditambah, dan apabila semua digabungkan, hasilnya putih.

Cuba gerakkan ketiga-tiga peluncur ini sendiri.

#FF5733
RGB · 255 · 87 · 51
R 255 11111111
G 87 01010111
B 51 00110011

Nombor 8 digit di sebelah kanan ialah representasi binari saluran tersebut. Apabila anda menggerakkan peluncur, nombor itu turut berubah. Bagaimana 0 dan 1 menghasilkan 256 nilai — itulah topik seterusnya.

Mengapa 0 hingga 255?

Komputer hanya mengendalikan 0 dan 1. Satu digit yang menyimpan 0 atau 1 dipanggil bit. Semakin banyak bit, semakin dua kali ganda nilai yang boleh direpresentasikan.

0/1
1 bit
= 2 nilai
0/10/1
2 bit
= 4 nilai
0/10/10/10/1
4 bit
= 16 nilai
0/10/10/10/1 0/10/10/10/1
8 bit
= 256 nilai ← satu saluran RGB

8 bit = 1 bait (byte). Satu warna mempunyai tiga saluran RGB, jadi jumlahnya 3 bait = 24 bit. 24 bit boleh mewakili kira-kira 16.7 juta warna. Ini lebih dari cukup untuk mata manusia membezakannya, maka 1 bait menjadi standard untuk setiap saluran.

Membaca Nombor Binari Sendiri

Setiap digit mempunyai nilai yang ditetapkan. Dari kiri ke kanan: 128, 64, 32, 16, 8, 4, 2, 1 — kuasa dua.

1282⁷
642⁶
322⁵
162⁴
8
4
2
12⁰

Tambahkan semua nilai pada digit yang bernilai 1, dan anda akan mendapat nombor perpuluhan.

Contoh 1
0128
064
032
016
18
04
12
01
8 + 2 = 10
Contoh 2
1128
164
132
116
08
04
02
01
128 + 64 + 32 + 16 = 240
Contoh 3 — semua 8 digit bernilai 1
1128
164
132
116
18
14
12
11
128 + 64 + 32 + 16 + 8 + 4 + 2 + 1 = 255

Itulah sebabnya nilai maksimum 8-bit ialah 255. Inilah sebab tepat julat representasi satu saluran RGB adalah 0 hingga 255.

HEX — Nombor yang Sama, Lebih Pendek

RGB(255, 255, 255). Itu 16 aksara. Terlalu panjang untuk ditulis berulang kali dalam satu baris CSS atau medan alat reka bentuk. Maka muncullah cara yang lebih ringkas untuk menulis nombor yang sama.

Apa Itu Heksadesimal

Heksadesimal ialah sistem nombor yang menggunakan satu aksara untuk mewakili nilai 0 hingga 15. Namun, digit biasa yang kita gunakan hanya ada 10 (0–9). Enam lagi dipinjam daripada abjad.

00
11
22
33
44
55
66
77
88
99
10A
11B
12C
13D
14E
15F

Terdapat tiga peraturan mudah:

  • 0–9 kekal seperti biasa
  • Mulai 10, gunakan A
  • F ialah nilai maksimum satu aksara (= 15)

Mengapa Heksadesimal?

4 digit binari (0000 ~ 1111) mewakili tepat 16 nilai.

00000
00011
00102
00113
01004
01015
01106
01117
10008
10019
1010A
1011B
1100C
1101D
1110E
1111F

4 digit binari = 1 aksara heksadesimal. Empat digit menjadi satu. Oleh kerana setiap saluran RGB adalah 8-bit, ia jatuh tepat sebagai dua aksara heksadesimal.

Cara Menukar RGB kepada HEX

Mari kita tukar RGB(255, 87, 51).

01
Tukar nilai R kepada heksadesimal
255FF
02
Tukar nilai G kepada heksadesimal
8757
03
Tukar nilai B kepada heksadesimal
5133
04
Tambah # di hadapan, susun mengikut urutan R·G·B
#FF5733

Notasi yang tadinya 14 aksara kini menjadi 7 aksara.

Menebak Warna dari HEX

Sebaliknya, melihat HEX pun boleh memberi gambaran warnanya.

  • #FF5733 — R maksimum (FF), G separuh (57), B rendah (33) → oren kemerahan
  • #3576E0 — R rendah (35), G sederhana (76), B kuat (E0) → biru keungguan
  • #29A85A — R rendah (29), G kuat (A8), B rendah (5A) → hijau segar

Hanya dengan melihat tiga bahagian, anda boleh membezakan “adakah ini oren atau biru” — membolehkan pereka dan pembangun berkomunikasi menggunakan bahasa yang sama.

Ringkasan Satu Baris

  • RGB — Tiga saluran: merah, hijau, biru; masing-masing 0–255
  • Binari 8-bit — Mengapa satu saluran mewakili 256 nilai
  • HEX — Notasi yang menulis nombor yang sama dalam dua aksara yang lebih pendek

Apabila ketiga-tiga konsep ini disambungkan, kod warna bukan lagi bahasa asing. Tiga nombor RGB adalah tepat enam aksara HEX.

Langkah seterusnya ialah menukar nombor-nombor ini kepada bahasa pereka bentuk. Permintaan seperti “sedikit lebih cerah,” “kurang tepu,” atau “sama pada kertas” sukar dikendalikan dengan RGB dan HEX sahaja. Bagaimana HSL, CMYK, dan OKLCH menyelesaikannya diteruskan di RGB sahaja tidak mencukupi: notasi warna HSL, CMYK, dan OKLCH.