Hình ảnh

Trích bảng màu chủ đạo từ ảnh

Lấy các màu chủ đạo của một bức ảnh dưới dạng mã HEX và RGB, kèm sẵn đoạn biến CSS dùng ngay.

Kéo thả ảnh vào đây hoặc bấm để chọn

Hỗ trợ JPG, PNG, WebP, GIF, AVIF, SVG

Công cụ này chạy hoàn toàn trong trình duyệt của bạn — dữ liệu không rời khỏi máy.

Trích bảng màu chủ đạo từ ảnh là gì?

Lấy bảng màu từ một bức ảnh là cách nhanh nhất để xây bộ màu hài hoà cho thiết kế. Chọn một tấm ảnh có tông bạn thích, trích ra các màu chủ đạo, rồi dùng chúng làm nền, chữ và điểm nhấn — kết quả gần như luôn ăn nhập vì các màu đó vốn đã cùng tồn tại trong một khung hình.

Công cụ dùng thuật toán k-means để gom các điểm ảnh thành từng cụm màu, tâm mỗi cụm là một màu đại diện. Cách này cho kết quả sát mắt người hơn nhiều so với việc chỉ đếm màu xuất hiện nhiều nhất — ảnh chụp gần như không bao giờ có hai điểm ảnh trùng màu tuyệt đối, nên phép đếm thuần tuý sẽ ra kết quả vô nghĩa.

Cách sử dụng

  • Kéo thả ảnh vào khung hoặc bấm để chọn tệp.
  • Kéo thanh trượt để chọn số màu muốn trích, từ 2 đến 12.
  • Dải màu phía trên hiển thị theo đúng tỷ lệ xuất hiện trong ảnh.
  • Bấm vào một ô màu để chép mã HEX, hoặc chép cả đoạn biến CSS ở cuối.

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

Nên trích bao nhiêu màu?

Năm tới sáu màu là đủ cho hầu hết thiết kế: một màu nền, một màu chữ, một màu nhấn và vài màu phụ. Trích quá nhiều sẽ cho ra các màu gần giống nhau, khó dùng.

Con số phần trăm nghĩa là gì?

Đó là tỷ lệ điểm ảnh thuộc về cụm màu đó. Màu chiếm tỷ lệ cao thường là màu nền hoặc vùng lớn nhất trong ảnh; màu tỷ lệ thấp thường là điểm nhấn — và chính những màu này hay dùng làm màu nhấn trong thiết kế.

Vì sao chạy lại cho kết quả hơi khác?

K-means là thuật toán lặp, kết quả phụ thuộc điểm khởi đầu. Công cụ chọn điểm khởi đầu cố định nên kết quả ổn định, nhưng đổi số màu sẽ làm toàn bộ cụm được chia lại chứ không đơn giản là thêm bớt một màu.