Chuyển HSL sang HEX
Đặt sắc màu, độ bão hòa và độ sáng để nhận mã màu HEX sáu chữ số tương ứng, sẵn sàng sao chép.
Nhập hsl
Kết quả · HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Cách sử dụng: HSL sang HEX
- 1
Nhập màu
Gõ mã màu hoặc chọn màu bằng công cụ chọn màu — mỗi ô đều chấp nhận định dạng được hiển thị.
- 2
Xem kết quả chuyển đổi
Kết quả cập nhật ngay khi bạn gõ, kèm bản xem trước trực tiếp của màu.
- 3
Sao chép mã
Sao chép giá trị bạn cần chỉ với một cú nhấp và dán vào thiết kế, CSS hoặc cài đặt in của bạn.
Vì sao chuyển HSL sang HEX
HSL là cách trực quan nhất để xây dựng hệ thống màu. Bạn cố định một sắc màu, chẳng hạn 262° cho màu tím, rồi tạo cả thang màu chủ yếu bằng cách thay đổi độ sáng: khoảng 95% cho nền, 58% cho nút và điểm nhấn, 30% cho chữ. Nhà thiết kế và lập trình viên dùng phương pháp này cho các sắc độ nhạt, đậm và giao diện tối.
Tuy nhiên, thang màu hoàn chỉnh thường phải được bàn giao dưới dạng mã HEX: bộ quy chuẩn thiết kế, design token, thư viện Figma, brand book và nhiều hệ quản trị nội dung yêu cầu giá trị #RRGGBB. Nhập giá trị HSL và sao chép kết quả HEX — ví dụ hsl(262, 83%, 58%) trở thành #7C3BED. Công cụ cũng hiển thị RGB, HSV và CMYK cho cùng màu đó. Vì HEX chỉ lưu được 256 mức mỗi kênh, những thay đổi rất nhỏ trong HSL không phải lúc nào cũng làm đổi mã HEX.
Mọi thứ đều chạy cục bộ trong trình duyệt của bạn — ảnh của bạn không bao giờ được tải lên máy chủ.