Về màu đỏ
Đỏ (red) là một tông đỏ vừa, rực rỡ, có mã hex #ff0000, hoặc rgb(255, 0, 0). Trong HSL, màu này có sắc độ 0°, độ bão hòa 100% và độ sáng 50%. Đây là một trong 148 tên màu có sẵn mà mọi trình duyệt đều hiểu, vì vậy bạn có thể viết color: red; thay cho mã hex.
Dùng màu đỏ cho chữ và nền
| Cặp màu | Tỷ lệ tương phản | WCAG |
|---|---|---|
| Chữ đỏ trên nền trắng | 4.00 : 1 | Chỉ đạt AA với chữ lớn |
| Chữ đỏ trên nền đen | 5.25 : 1 | AA |
Trên nền đỏ, hãy dùng chữ đen (5.25 : 1). WCAG yêu cầu tối thiểu 4.5 : 1 cho văn bản thường và 3 : 1 cho chữ lớn. Hãy 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: red; /* or #ff0000 */
background-color: #ff0000;
border: 1px solid rgb(255 0 0 / 50%);
}Tên màu tương tự
Đỏ cam (#ff4500), Đỏ thẫm (#dc143c), Gạch lửa (#b22222), Nâu (#a52a2a), Đỏ sẫm (#8b0000), Sô cô la (#d2691e).
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.
Câu hỏi thường gặp
Mã hex của màu đỏ là gì?
#ff0000 — tức là rgb(255, 0, 0) và hsl(0, 100%, 50%). Trong CSS, bạn cũng có thể viết đơn giản là red.
Chữ đỏ trên nền trắng có dễ đọc không?
Tỷ lệ tương phản của màu này trên nền trắng là 4.00 : 1, chỉ đạt chuẩn WCAG AA cho chữ lớn.
Những màu nào hợp với đỏ?
Màu bổ sung của đỏ là #00ffff; các màu tương tự #ff0080 và #ff8000 nằm ngay cạnh nó trên vòng màu.