Toolbox Hub
Tất cả công cụ

Color Converter

HEX RGB HSL conversion

HEX RGB HSL conversion Chạy cục bộ trong trình duyệt của bạn

HEX

#2563eb

RGB

rgb(37, 99, 235)

HSL

hsl(221, 83%, 53%)

About the

Bộ chuyển đổi màu chuyển một màu duy nhất giữa HEX, RGB, HSL và HSV, đồng thời hiển thị tỷ lệ tương phản WCAG so với màu đen và trắng để bạn có thể biết ngay liệu văn bản ở màu đó có đọc được hay không. HEX và RGB là các định dạng bạn sao chép giữa các công cụ, nhưng HSL là định dạng thực sự hữu ích cho công việc thiết kế: nó tách màu sắc khỏi độ sáng, do đó bạn có thể tạo ra một tông màu hoặc một sắc thái giữ nguyên màu sắc thay vì chuyển sang màu xám theo cách mà toán học RGB ngây thơ làm. Các giá trị hex và rgba gồm tám chữ số mang kênh alpha và bộ chuyển đổi cũng xử lý các giá trị đó.

Where people use the

  • Chuyển giá trị hex của thương hiệu thành cú pháp rgb mà công cụ thiết kế mong đợi.
  • Tạo ra một bộ sắc thái nhất quán từ một màu sắc thương hiệu bằng HSL.
  • Kiểm tra xem màu liên kết có thể đọc được trên nền tối hay không.
  • Khớp màu được chọn từ ảnh chụp màn hình với giá trị hex gần nhất.

How to use the

  1. 1

    Nhập màu ở bất kỳ định dạng nào

    Dán giá trị hex chẳng hạn như 2f6fed hoặc hàm rgb hoặc hsl hoặc sử dụng bộ chọn. Các định dạng khác cập nhật khi bạn nhập.

  2. 2

    Đọc tất cả các biểu diễn cùng một lúc

    Hex, RGB, HSL và HSV được hiển thị cùng với kênh alpha được tách ra.

  3. 3

    Kiểm tra tỷ lệ tương phản

    Tỷ lệ so với màu đen và trắng cho bạn biết màu đó có thể được sử dụng làm màu văn bản hay màu nền. Văn bản nội dung cần 4,5 đến 1, viền văn bản và giao diện lớn cần 3 đến 1.

  4. 4

    Sao chép biểu mẫu mà mã của bạn cần

    Mỗi trường có nút sao chép riêng, do đó bạn có được chính xác cú pháp mà biểu định kiểu của bạn mong đợi thay vì phải định dạng lại bằng tay.

Lời khuyên và phương pháp hay nhất

  • Điều chỉnh độ sáng trong HSL thay vì thêm màu trắng hoặc đen trong RGB; màu sắc vẫn còn nguyên.
  • Kiểm tra độ tương phản ở kích thước nhỏ nhất mà văn bản sẽ thực sự được sử dụng chứ không phải ở kích thước tiêu đề.
  • Giữ một bảng tài liệu gồm năm hoặc sáu giá trị thay vì phát minh ra một bảng mới cho mỗi thành phần.

Câu hỏi thường gặp

Màu hex được chuyển đổi thành RGB như thế nào?

Mỗi cặp chữ số hex là một kênh, đọc là cơ số 16. Trong 2f6fed, 2f là 47 màu đỏ, 6f là 111 màu xanh lá cây và ed là 237 màu xanh lam. Tốc ký ba chữ số như f0a nhân đôi mỗi chữ số, vì vậy nó trở thành ff00aa.

Tại sao độ sáng HSL không giống với độ sáng cảm nhận được?

Bởi vì mắt nhạy cảm với màu xanh lá cây hơn màu xanh lam. Màu xanh thuần khiết và màu vàng thuần khiết có thể chia sẻ giá trị độ sáng trong khi màu vàng có vẻ sáng hơn nhiều. Đó là lý do tại sao độ tương phản phải được đo bằng công thức độ chói thay vì đánh giá từ số HSL.

Cặp chữ số thứ tư trong màu hex có ý nghĩa gì?

Alpha, từ 00 hoàn toàn trong suốt đến ff hoàn toàn mờ đục. Hex tám chữ số được hỗ trợ trong tất cả các trình duyệt hiện tại và tương đương với hex của rgba.

Is the CMYK conversion accurate for print?

No, and no browser tool can be. CMYK phụ thuộc vào mực, giấy và cấu hình máy in. Sử dụng giá trị này làm điểm bắt đầu và chuyển đổi thông qua hồ sơ ICC của nhà cung cấp dịch vụ in của bạn để biết bất kỳ điều gì quan trọng.

Làm cách nào để chọn văn bản có thể đọc được cho nền màu?

So sánh độ tương phản giữa màu chữ và màu nền. Nếu cả màu đen lẫn màu trắng đều không đạt tỷ lệ 4,5 đến 1 thì nền quá bão hòa đối với văn bản nội dung và cần được làm tối hoặc sáng hơn trước khi sử dụng phía sau bản sao.

Tại sao cùng một hình lục giác trông khác nhau trên hai màn hình?

Bởi vì màn hình khác nhau về gam màu, hiệu chuẩn và độ sáng. Màn hình có gam màu rộng hiển thị màu sắc bão hòa mà tấm nền sRGB tiêu chuẩn không thể tái tạo được. Làm việc ở chế độ sRGB trừ khi bạn có lý do cụ thể để không làm vậy.

Công cụ liên quan