post-image

Sử dụng màu sắc trong trang web

Tổng quan

NỘI DUNG BÀI VIẾT

Có 3 cách thường được dùng để quy định màu sắc trong trang web:

  • Sử dụng tên của màu. Chẳng hạn là “red” (đỏ) hoặc “green” (xanh lá cây)
  • Sử dụng giá trị RGB ( Red Green Blue). Chẳng hạn là “rgb(255, 0, 0).
  • Sử dụng giá trị HEX. Chẳng hạn là “#ff0000”.

Tên màu

Sau đây là bảng các tên màu phổ biến:

ColorName
 Red
 Green
 Blue
 Orange
 Yellow
 Cyan
 Black

Giá trị RGB

Giá trị RGB biểu diễn một màu theo công thức: Tất cả các màu sắc khác đều được sinh ra bằng cách hoà trộn 3 màu cơ bản là: Red (đỏ), Green (xanh lá cây) và Blue (xanh nước biển).

Giá trị của R, G và B được xác định nằm trong khoảng từ 0 đến 255.

Chẳng hạn, sau đây là bảng một số màu phổ biến cùng với giá trị RGB của nó:

ColorRGB
 rgb(255,0,0)
 rgb(0,255,0)
 rgb(0,0,255)
 rgb(255,165,0)
 rgb(255,255,0)
 rgb(0,255,255)

Mã HEX

Mã HEX là một cách biểu diễn khác của màu dựa trên các giá trị RGB. Tuy nhiên, thay vì biểu diễn bằng cú pháp rgb(value, value, value) thì được biểu diễn dưới dạng 6 chữ số hệ thập lục phân.

Lưu ý: Hệ thập lục phân bao gồm 16 chữ số: 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f. Chữ số ff trong hệ 16 tương đương với chữ số 255 trong hệ thập phân.

Như vậy:

Trong hệ thập phân, giá trị các màu biến thiên trong khoảng 0 – 255

Trong hệ thập lục phân, giá trị các màu biến thiên trong khoảng 00 – FF.

Sau đây là bảng các màu thông dụng và mã HEX của chúng:

ColorHEX
 #FF0000
 #00FF00
 #0000FF
 #FFA500
 #FFFF00
 #00FFFF

Lưu ý: Trong 6 chữ số của mã HEX thì:

  • 2 chữ số đầu biểu diễn giá trị R
  • 2 chữ số giữa biểu diễn giá trị G
  • 2 chữ số cuối biểu diễn giá trị B

Như vậy, màu có giá trị rgb(255, 255, 0) sẽ tương đương với mã HEX là #FFFF00.Last modified: Wednesday, 6 November 2019, 6:30 PM

Leave a Reply

Your email address will not be published.