Công cụ này làm gì
Mở một ảnh (hoặc dán ảnh chụp màn hình) và di chuyển trên đó: kính lúp hiện các điểm ảnh dưới dấu chữ thập, màu được ghi dưới dạng HEX, RGB, HSL và OKLCH, mỗi dạng có nút sao chép. Bấm hoặc chạm để giữ màu vào danh sách. Bên dưới, công cụ tách các màu chủ đạo, cho biết mỗi màu chiếm bao nhiêu phần ảnh và màu chữ nào đọc được trên nó, rồi xuất bảng màu thành biến CSS, Tailwind (v4 @theme hoặc cấu hình v3), SCSS, JSON hay danh sách mã màu. Phần kiểm tra tương phản cho biết một cặp màu có đạt chuẩn WCAG cho chữ thường, chữ lớn và biểu tượng không. Ảnh không được tải lên: nó được giải mã và đọc ngay trên thiết bị.
Lấy màu chính xác
Trên máy tính, di chuột và bấm. Trên điện thoại, kéo ngón tay: kính lúp đi theo và màu được lấy khi bạn nhấc tay, nên đầu ngón tay không che chỗ bạn chọn. Với bàn phím, dùng phím mũi tên (Shift để đi 10 điểm ảnh) và Enter. Ảnh chụp có nhiễu và vệt nén JPEG, nên hãy chọn vùng lấy mẫu trung bình 3 × 3 hoặc 5 × 5 để đọc màu của bề mặt thay vì của một điểm ảnh ngẫu nhiên.
Bảng màu được tìm thế nào
Bảng màu dùng thuật toán median cut: đếm điểm ảnh vào 32.768 ô màu, rồi liên tục cắt đôi hộp màu có độ phân tán lớn nhất tại trung vị của kênh màu rộng nhất. Mỗi màu là trung bình chính xác của hộp. Không có yếu tố ngẫu nhiên, nên cùng một ảnh luôn cho cùng một bảng màu.
Từ ảnh đến bảng màu dùng được
Màu lấy thẳng từ ảnh hiếm khi cho chữ dễ đọc: màu cam #f08c1e chỉ đạt 2,48:1 trên nền trắng, dưới mức 4,5:1 cần cho chữ thường. Công cụ gợi ý màu gần nhất đạt chuẩn mà vẫn giữ sắc độ (#b1620c). Xem bài viết về bảng màu từ ảnh và độ tương phản; để tạo dải màu hay phối màu từ một màu, dùng bộ công cụ màu.
