Màu sắc trong HTML

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  

Leave a Comment