Softonic

Trình đổi mã màu

Bước 1 / 2
Tiếp theo

Dán một màu dưới dạng HEX (#ff6600 hoặc #f60), rgb(255, 102, 0), cách nhau bằng dấu phẩy 255, 102, 0 hoặc hsl(24, 100%, 50%), trình đổi sẽ trả về ngay màu đó ở hai định dạng còn lại, kèm bản xem trước mẫu màu trực tiếp và nút sao chép một cú nhấp chuột cho từng định dạng.

Cách hoạt động của trình đổi mã màu

  1. 1

    Nhập màu ở định dạng được hỗ trợ

    HEX (#abc, #abcdef), rgb(r, g, b), cách nhau bằng dấu phẩy r, g, b hoặc hsl(h, s%, l%).

  2. 2

    Được phân tích thành biểu diễn nội bộ

    Công cụ chuyển giá trị sang RGB bên trong, rồi suy ra các giá trị tương đương ở dạng HEX và HSL từ đó.

  3. 3

    Hiển thị tất cả các định dạng

    Các chuỗi HEX, RGB và HSL tương ứng được hiển thị cạnh nhau.

  4. 4

    Xem trước mẫu màu trực tiếp

    Hiển thị màu kết quả trong nháy mắt để bạn xác nhận phép đổi trước khi sao chép.

Các định dạng được hỗ trợ

Định dạng Ví dụ Công dụng
HEX 3 ký tự #F66 Dạng viết tắt; chỉ dùng cho màu có chữ số lặp lại
HEX 6 ký tự #FF6B6B Mặc định cho CSS và thiết kế đồ họa
RGB rgb(255, 107, 107) CSS, JS, phần mềm thiết kế
Cách nhau bằng dấu phẩy 255, 107, 107 Giống RGB nhưng không dùng cú pháp hàm
HSL hsl(0, 100%, 71%) Dễ hình dung về sắc độ/độ bão hòa/độ sáng

Dùng định dạng nào khi nào

  • HEX cho CSS tĩnh và bàn giao thiết kế.
  • RGB khi bạn truyền các kênh màu cho JavaScript hoặc phần mềm thiết kế.
  • HSL khi điều chỉnh độ sáng hoặc độ bão hòa, mô hình tư duy rõ ràng hơn RGB.

Các định dạng khác như HSV, CMYK, LAB, LCH và OKLCH tồn tại trong các công cụ thiết kế. Chúng mô tả cùng một màu theo những cách khác nhau, nhưng trình đổi này tập trung vào ba định dạng web cơ bản nêu trên.

Độ chính xác

  • Phép đổi giữa HEX, RGB và HSL là chính xác: HEX và RGB là cùng một mô hình màu, còn HSL được suy ra từ RGB bằng công thức chuẩn.
  • Giá trị HSL được làm tròn thành số nguyên, nên khi đổi qua đổi lại chữ số cuối có thể lệch đi. Màu hiển thị vẫn giống hệt; hãy dùng HEX khi cần bản sao chính xác từng bit.

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

HEX hoặc rgb() để tương thích rộng. hsl() khi bạn cần dễ đọc. Trình duyệt hiện đại cũng hỗ trợ oklch() và các định dạng khác, nhưng HEX vẫn là lựa chọn mặc định an toàn nhất.

Không, trình đổi chỉ nhận màu đục: HEX 3 hoặc 6 ký tự, rgb() và hsl() không có kênh alpha. Hãy dùng rgba() hoặc HEX 8 ký tự trực tiếp trong CSS của bạn.

Không, trình đổi chỉ nhận ba định dạng số. Hãy dùng công cụ chọn màu hoặc tra cứu trực tuyến để đổi tên màu sang HEX trước.

HSL được hiển thị với sắc độ, độ bão hòa và độ sáng là số nguyên, nên việc đổi qua lại có thể làm lệch một đơn vị. Màu hiển thị vẫn giống hệt; hãy dùng HEX khi cần bản sao chính xác.

Công cụ liên quan

Bảng tham chiếu ASCII

Bảng ASCII đầy đủ từ 0 đến 127 với giá trị thập phân, thập lục phân, bát phân, nhị phân và ký hiệu tham chiếu ký tự số HTML, gồm NUL, LF và DEL.

Tham chiếu ký tự HTML

Danh sách có thể tìm kiếm các thực thể HTML, mã tên và mã số tương ứng của chúng, cùng chức năng sao chép chỉ với một cú nhấp cho các ký tự đặc biệt và biểu tượng.

Bộ chuyển đổi Base64 sang Hex

Chuyển chuỗi Base64 chuẩn thành các byte nền tảng được viết dưới dạng hexadecimal liên tục in hoa. Giải mã nghiêm ngặt, lý tưởng cho token, khóa và chữ ký JWT.

Trình tạo bảng màu ngẫu nhiên

Tạo bảng màu ngẫu nhiên từ 2 đến 15 mẫu màu, chọn phong cách rực rỡ, pastel, dịu hoặc tối, rồi sao chép mã HEX hoặc biến CSS.

Bộ chọn màu HEX

Chọn hoặc nhập màu HEX để xem RGB, HSL, CMYK ước tính, độ chói tương đối và tương phản với trắng và đen.

Trình xem hex của tệp nhị phân

Chọn một tệp và kiểm tra phần dữ liệu giới hạn từ bất kỳ offset byte hợp lệ nào dưới dạng hex dump cục bộ với cột offset, hex và ASCII.