Trộn màu sắc

Giới thiệu công cụ

Bộ trộn màu kết hợp hai màu hex trong không gian RGB, tạo ra hỗn hợp mượt mà ở bất kỳ tỷ lệ nào từ 0% đến 100%. Thang màu chuyển tiếp hiển thị 7 bước đều nhau giữa hai màu.

Pha trộn RGB là cùng thao tác mà trình duyệt thực hiện khi tổng hợp màu sắc — chính xác về mặt toán học và có thể dự đoán được. Màu pha trộn ở 50% là điểm giữa thực sự giữa hai màu trong không gian RGB.

Cách sử dụng

1. Chọn hai màu bằng bộ chọn màu hoặc nhập trực tiếp mã hex.
2. Sử dụng các nút cài sẵn để thử các kết hợp màu cổ điển.
3. Kéo thanh trượt tỷ lệ để điều chỉnh hỗn hợp. 0% là Màu 1; 100% là Màu 2.
4. Nhấp vào bất kỳ mẫu màu chuyển tiếp nào hoặc nút Sao chép HEX để sao chép màu.

Trường hợp sử dụng

Các nhà thiết kế UI pha trộn màu chính của thương hiệu với trắng hoặc đen cho các trạng thái hover, active, disabled. Các nhà thiết kế chuyển động chọn màu trung gian cho hoạt hình keyframe. Lập trình viên frontend tạo điểm dừng gradient mà không cần trình chỉnh sửa đồ họa.

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

• Điều này giống với CSS gradient không? — Có. CSS linear-gradient cũng pha trộn trong sRGB theo mặc định. Các bước hiển thị tương ứng chính xác với các điểm trung gian mà CSS gradient đi qua.
• Tại sao pha trộn đỏ và xanh lam không cho màu tím? — Trong RGB, đỏ (#ff0000) và xanh lam (#0000ff) ở 50% cho #7f007f (đỏ tím đậm). Màu tím rực rỡ cần pha trộn đỏ với xanh tím như #8000ff.
• Có thể có nhiều bước gradient hơn không? — Thang màu luôn hiển thị 7 bước. Sử dụng thanh trượt tỷ lệ để kiểm tra bất kỳ điểm trung gian cụ thể nào.
• Có hỗ trợ alpha/độ trong suốt không? — Không, công cụ này chỉ hoạt động với màu hex đặc.