Cách chuyển mã màu hex sang RGB
- Nhập hoặc dán mã màu hex vào ô Mã màu hex, có hoặc không có
#, hoặc nhấp vào ô màu để chọn màu. - Đọc kết quả dưới dạng
rgb()và xem các giá trị đỏ, xanh lục, xanh lam trên các thanh trượt, cùng với HSL, HSV và CMYK. - Sao chép bất kỳ định dạng nào chỉ với một cú nhấp. Công thức bên cạnh các định dạng cho thấy cách mỗi cặp chữ số hex trở thành một số từ 0 đến 255.
Công thức chuyển hex sang RGB
Mã màu hex là ba byte được viết ở hệ thập lục phân: #RRGGBB. Mỗi cặp chữ số là một kênh màu từ 00 (0) đến FF (255). Để chuyển đổi một cặp, nhân chữ số thứ nhất với 16 rồi cộng chữ số thứ hai, với A = 10, B = 11, C = 12, D = 13, E = 14 và F = 15. Ví dụ với #7C3AED:
- Đỏ:
7C= 7 × 16 + 12 = 124 - Xanh lục:
3A= 3 × 16 + 10 = 58 - Xanh lam:
ED= 14 × 16 + 13 = 237
Vậy #7C3AED = rgb(124, 58, 237).
Mã hex rút gọn và mã màu có độ trong suốt
Mã 3 chữ số là dạng rút gọn, trong đó mỗi chữ số được nhân đôi: #F80 = #FF8800 = rgb(255, 136, 0). Mã 8 chữ số có thêm một byte alpha cho độ trong suốt: trong #7C3AED80, cặp cuối 80 = 128, và 128 ÷ 255 ≈ 0.5, nên mã này bằng rgba(124, 58, 237, 0.5). Dạng 4 chữ số #RGBA cũng hoạt động theo cách tương tự.
Các mã màu hex phổ biến và giá trị RGB
| Màu | Hex | RGB |
|---|---|---|
| Trắng | #FFFFFF | rgb(255, 255, 255) |
| Đen | #000000 | rgb(0, 0, 0) |
| Đỏ | #FF0000 | rgb(255, 0, 0) |
| Xanh chanh | #00FF00 | rgb(0, 255, 0) |
| Xanh lam | #0000FF | rgb(0, 0, 255) |
| Vàng | #FFFF00 | rgb(255, 255, 0) |
| Cam | #FFA500 | rgb(255, 165, 0) |
| Xám | #808080 | rgb(128, 128, 128) |
| Xanh hải quân | #000080 | rgb(0, 0, 128) |
| Tím | #800080 | rgb(128, 0, 128) |
| Xanh mòng két | #008080 | rgb(0, 128, 128) |
Câu hỏi thường gặp
Làm sao để chuyển hex sang RGB bằng tay?
Tách mã thành ba cặp và chuyển từng cặp từ hệ thập lục phân: chữ số thứ nhất × 16 + chữ số thứ hai. Với #1E90FF: 1E = 30, 90 = 144 và FF = 255, nên màu này là rgb(30, 144, 255).
Mã màu hex 3 chữ số như #F80 có nghĩa là gì?
Đó là dạng rút gọn của mã 6 chữ số, với mỗi chữ số được nhân đôi: #F80 = #FF8800 = rgb(255, 136, 0). Chỉ những màu mà mỗi cặp gồm hai chữ số giống nhau mới có thể rút gọn.
Làm sao để chuyển hex sang RGB trong JavaScript hoặc Python?
JavaScript: [1, 3, 5].map((i) => parseInt(hex.slice(i, i + 2), 16)) cho mã dạng #RRGGBB. Python: tuple(int(h[i:i + 2], 16) for i in (1, 3, 5)). Trong CSS thì không cần chuyển đổi – cả hai cách viết đều được chấp nhận.
Nên dùng hex hay RGB trong CSS?
Cả hai mô tả chính xác cùng một màu. Hex ngắn gọn hơn và phổ biến trong các công cụ thiết kế; rgb() dễ đọc, dễ điều chỉnh hơn và thể hiện rõ độ trong suốt với rgba(). Các trình duyệt hiện đại cũng chấp nhận mã hex 8 chữ số có alpha.