Ba kênh đỏ, xanh lá và xanh dương
RGB viết theo thứ tự R (red), G (green), B (blue). Trong cách biểu diễn **mỗi kênh là một số nguyên 8 bit**, giá trị đi từ 0 đến 255, nên có 256 lựa chọn cho mỗi kênh. Tổng số bộ ba là 256 × 256 × 256 = **16 777 216**, chưa xét độ trong suốt.
rgb(0, 0, 255) giữ kênh đỏ và xanh lá bằng 0, kênh xanh dương ở mức 255. rgb(255, 255, 255) là trắng; rgb(0, 0, 0) là đen. Ba kênh bằng nhau cho sắc xám: x chạy từ 0 đến 255 trong rgb(x, x, x), tạo 256 mức, kể cả đen và trắng.
Một màu có nhiều cách viết
```css
p { color: rgb(0, 0, 255); }
/* Ba cách thay giá trị, vẫn cùng màu xanh dương: */
/* #0000ff; rgb(0%, 0%, 100%); blue; */
```
Mã hex dạng #rrggbb gồm hai chữ số hệ 16 cho mỗi kênh, vẫn theo thứ tự đỏ–xanh lá–xanh dương. Hệ 16 dùng 0–9 và A–F; 00 tương ứng 0, 80 tương ứng 128, FF tương ứng 255. Vì thế #0000ff cùng màu với rgb(0, 0, 255).
Trong rgb(0%, 0%, 100%), phần trăm tính theo mức 255 của từng kênh. 0% là 0 và 100% là 255. Tên blue cũng chỉ màu xanh dương ấy. Chữ hoa hay thường trong tên màu và các chữ số A–F của mã hex không làm đổi màu.
Đối chiếu nhóm 17 tên màu
| Tên | Hex | RGB |
|---|---|---|
|black|#000000|0, 0, 0|
|silver|#C0C0C0|192, 192, 192|
|white|#FFFFFF|255, 255, 255|
|maroon|#800000|128, 0, 0|
|red|#FF0000|255, 0, 0|
|purple|#800080|128, 0, 128|
|fuchsia|#FF00FF|255, 0, 255|
|green|#008000|0, 128, 0|
|lime|#00FF00|0, 255, 0|
|olive|#808000|128, 128, 0|
|yellow|#FFFF00|255, 255, 0|
|navy|#000080|0, 0, 128|
|blue|#0000FF|0, 0, 255|
|teal|#008080|0, 128, 128|
|aqua|#00FFFF|0, 255, 255|
|orange|#FFA500|255, 165, 0|
|gray|#808080|128, 128, 128|
Đây là nhóm tên dùng trong bài thực hành; CSS còn hỗ trợ các tên khác. Đặc biệt, từ khóa **green** tương ứng rgb(0, 128, 0), còn màu xanh lá với kênh G đạt 255 là **lime**, tương ứng rgb(0, 255, 0). Cần đọc đúng tên và con số, tránh coi hai giá trị này là một.
Bài luyện
Cách viết nào cùng màu với rgb(0, 0, 255)?
Kênh đỏ đạt 255.
Đúng. Hai kênh đầu 00, kênh cuối ff.
Kênh xanh lá đạt 255.
Cả ba kênh đều bằng 0.
Lời giải
#0000ff gồm R=00=0, G=00=0, B=ff=255. Vì vậy nó cùng màu với rgb(0, 0, 255); ba mã còn lại lần lượt là đỏ, lime và đen.
Bài luyện
Màu rgb(0%, 100%, 0%) trùng với từ khóa nào?
green có kênh G bằng 128.
blue có kênh B bằng 255.
Đúng. G bằng 255, hai kênh kia bằng 0.
gray có ba kênh đều bằng 128.
Lời giải
100% của kênh G là 255, hai kênh còn lại bằng 0. Bộ ba (0, 255, 0) tương ứng lime; green tương ứng (0, 128, 0).
Bài luyện
Với RGB ba số nguyên 8 bit, kể cả đen và trắng, có bao nhiêu mức xám rgb(x,x,x)?
Đúng. x có 256 giá trị từ 0 đến 255.
Ba là số kênh, không phải số mức xám.
Cần tính cả giá trị 0.
Đó là số bộ ba RGB, gồm cả các màu không xám.
Lời giải
Một mức xám có cả ba kênh cùng bằng x. Chọn x từ 0 đến 255 được 255 − 0 + 1 = 256 mức. Không chọn ba kênh độc lập khi đếm riêng các mức xám.
Bài luyện
Con số 16 777 216 trong bài được tính cho trường hợp nào?
Khi đó chỉ có 2 × 2 × 2 bộ ba.
Con số đang tính có phạm vi cụ thể về ba kênh 8 bit.
0–255 gồm 256 giá trị.
Đúng. Nhân số lựa chọn độc lập của ba kênh.
Lời giải
Mỗi kênh nguyên 8 bit nhận 256 giá trị từ 0 đến 255. Ba kênh độc lập tạo 256³ = 16 777 216 bộ ba. Phép đếm chưa xét thêm độ trong suốt hay cách biểu diễn màu khác.
Đang học