Màu sắc là sự hiển thị được kết hợp bởi ba màu ĐỎ (RED), XANH LÁ (GREEN) và XANH DA TRỜI (BLUE).
Tên màu sắc
Với CSS, các màu có thể được tạo bằng cách sử dụng tên màu (bằng tiếng Anh):
Màu | Tên |
---|---|
Red | |
Orange | |
Yellow | |
Cyan | |
Blue |
Các giá trị màu sắc trong CSS
Với CSS, các màu có thể được chỉ định theo những cách khác nhau:
- Bằng tên màu sắc (tiếng Anh;
- Bằng giá trị RGB;
- Bằng giá trị hệ thập lục phân (hexadecimal);
- Bằng giá trị HSL (trong CSS3);
- Bằng giá trị HWB (trong CSS4);
Chỉ định màu sắc từ hệ RGB
Các giá trị màu sắc RGB được hỗ trợ bởi tất cả các trình duyệt.
Một giá trị màu RGB được chỉ định với công thức như sau: rgb(đỏ, xanh lá, xanh da trời).
Mỗi tham số (đỏ, xanh lá, và xanh da trời) định nghĩa cường độ (độ bão hoà?) của màu sắc bằng một số nguyên từ 0 đến 255.
Ví dụ như rgb(0,0,255) sẽ xuất ra màu xanh da trời, bởi vì tham số màu xanh da trời được thiết lập giá trị lớn nhất (255) và các tham số khác được thiết lập giá trị nhỏ nhất là 0.
Ví dụ:
Color | RGB | Color |
---|---|---|
rgb(255,0,0) | Đỏ | |
rgb(0,255,0) | Xanh lá | |
rgb(0,0,255) | Xanh da trời |
Các trạng thái khác nhau của màu xám thường được tạo ra bằng cách dùng giá trị bằng nhau cho tất cả 3 nguồn sáng, ví dụ:
Màu sắc | RGB | Color |
---|---|---|
rgb(0,0,0) | Đen | |
rgb(128,128,128) | Xám | |
rgb(255,255,255) | Trắng |
Chỉ định màu sắc từ hệ thập lục phân
Các giá trị của hệ màu thập lục phân cũng được hỗ trợ trong tất cả các trình duyệt.
Một màu thập lục phân được chỉ định có dạng như thế này: #RRGGBB
RR (đỏ), GG (xanh lá) và BB (xanh da trời) là một số nguyên thuộc hệ thập lục phân có giá trị từ 00 đến FF chỉ định rõ độ bão hoà của màu sắc.
Ví dụ như, #0000FF
được hiển thị là màu xanh da trời, bởi vì thành phần màu xanh da trời được thiết lập với giá trị cao nhất (FF) và các giá trị khác được thiết lập giá trị 00.
Màu | Hệ HEX | Hệ RGB | Màu |
---|---|---|---|
#FF0000 | rgb(255,0,0) | Đỏ | |
#00FF00 | rgb(0,255,0) | Xanh lá | |
#0000FF | rgb(0,0,255) | Xanh da trời |
Các trạng thái khác nhau của màu xám thường được tạo ra bằng cách dùng giá trị bằng nhau cho tất cả 3 nguồn sáng ở các mức độ khác nhau:
Màu | Hệ HEX | Hệ RGB | Màu |
---|---|---|---|
#000000 | rgb(0,0,0) | Đen | |
#808080 | rgb(128,128,128) | Xám | |
#FFFFFF | rgb(255,255,255) | Trắng |
Viết HOA hay viết thường?
Bạn có thế viết HOA hoặc thường để chỉ định giá trị thập lục phân.
Chữ thường dễ viết hơn, còn chữ HOA dễ đọc hơn.
Các tên màu sắc
CSS hỗ trợ 140 tiêu chuẩn tên màu.
Trong phần tiếp theo bạn sẽ tìm thấy danh sách đầy đủ tên màu theo thứ tự ABC với giá trị thập lục phân, còn ở đây chỉ ví dụ vài tên:
Tên màu (tiếng Anh) | Hệ Hex | Màu |
---|---|---|
AliceBlue | #F0F8FF | |
AntiqueWhite | #FAEBD7 | |
Aqua | #00FFFF | |
Aquamarine | #7FFFD4 | |
Azure | #F0FFFF | |
Beige | #F5F5DC | |
Bisque | #FFE4C4 |