Giới thiệu về Xám nhạt
Xám nhạt (lightgray) là màu xám rất nhạt, dịu, có mã hex #d3d3d3, hoặc rgb(211, 211, 211). Trong HSL, màu này có sắc độ 0°, độ bão hòa 0% và độ sáng 83%. CSS cũng chấp nhận cách viết lightgrey cho đúng màu này. Đây là một trong 148 màu có tên mà mọi trình duyệt đều hiểu, nên bạn có thể viết color: lightgray; thay vì mã hex.
Dùng Xám nhạt cho chữ và nền
| Cặp màu | Tỉ lệ tương phản | WCAG |
|---|---|---|
| Chữ Xám nhạt trên nền trắng | 1.50 : 1 | không đạt |
| Chữ Xám nhạt trên nền đen | 14.03 : 1 | AAA |
Trên nền xám nhạt, hãy dùng chữ đen (14.03 : 1). WCAG yêu cầu tối thiểu 4.5 : 1 cho chữ nội dung và 3 : 1 cho chữ lớn. Kiểm tra các cặp màu khác với Công cụ kiểm tra độ tương phản.
CSS
.element {
color: lightgray; /* or #d3d3d3 */
background-color: #d3d3d3;
border: 1px solid rgb(211 211 211 / 50%);
}
Màu có tên tương tự
Gainsboro (#dcdcdc), Thistle (#d8bfd8), Silver (#c0c0c0), Light Steel Blue (#b0c4de), Powder Blue (#b0e0e6), Light Blue (#add8e6).
Tìm tên màu
Dán mã HEX để nhận tên màu dễ đọc gần nhất và tên token gọn gàng cho CSS, SCSS, JavaScript hoặc cấu hình Tailwind của bạn.