Trình tạo bảng màu

Trình tạo bảng màu là gì?

Trình tạo bảng màu là một công cụ tạo bảng phối màu trực tuyến miễn phí dành cho nhà thiết kế và lập trình viên front-end cần xây dựng một bảng màu đầy đủ xung quanh một màu gốc duy nhất. Nhập một màu HEX và công cụ sẽ ngay lập tức suy ra các tông sáng hơn, các sắc độ tối hơn, màu bổ sung cùng các hòa sắc tương đồng và bộ ba bằng cách dùng toán màu HSL — mỗi ô màu được hiển thị kèm giá trị HEX và nút sao chép một lần nhấp. Dùng nó để chọn màu giao diện, xây dựng một dải sắc độ/tông màu, hoặc tìm các màu nhấn phù hợp cho một thương hiệu. Đây là trình tạo bảng màu HEX, trình tạo sắc độ/tông màu và trình tìm màu bổ sung gộp trong một.

Cách sử dụng Trình tạo bảng màu

1. Nhập một màu gốc vào ô Màu gốc (HEX) theo định dạng #rrggbb hoặc #rgb, hoặc nhấp vào ô chọn màu lớn để chọn trực quan.
2. Đặt Số sắc độ mỗi bên thành 2, 3 hoặc 4 để kiểm soát số tông sáng hơn và sắc độ tối hơn được tạo ở mỗi bên của màu gốc.
3. Xem mục Sắc độ và tông màu: các tông sáng hơn xuất hiện phía trên màu gốc và các sắc độ tối hơn ở phía dưới, mỗi cái được gắn nhãn (Lighter N / Base / Darker N) và hiển thị cùng giá trị HEX.
4. Xem mục Màu hài hòa để biết màu bổ sung, màu tương đồng (+30deg / -30deg) và màu bộ ba (+120deg / -120deg).
5. Nhấp vào nút sao chép bên cạnh bất kỳ ô màu nào (hoặc bên cạnh ô màu gốc) để sao chép giá trị HEX đó vào bảng nhớ tạm.

Ví dụ

#ff0000

#00ffff

#ff0000

#00ff00

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

Tôi có thể nhập những định dạng màu nào?

Màu gốc được nhập dưới dạng giá trị HEX theo định dạng #rrggbb (sáu chữ số) hoặc dạng rút gọn #rgb (ba chữ số). Nếu giá trị không phải là màu HEX hợp lệ, thông báo 'Invalid HEX color' sẽ xuất hiện và không có bảng màu nào được tạo. Tất cả ô màu đầu ra đều được hiển thị dưới dạng HEX #rrggbb.

Nó tạo ra bao nhiêu sắc độ và tông màu?

Bạn chọn 2, 3 hoặc 4 sắc độ mỗi bên. Công cụ tạo ra bấy nhiêu tông sáng hơn (nội suy về phía trắng) và cùng số lượng sắc độ tối hơn (nội suy về phía đen), cộng với màu gốc ở giữa.

Những màu hài hòa nào được bao gồm?

Nó xuất ra màu bổ sung (sắc màu xoay 180deg), hai màu tương đồng (+30deg và -30deg) và hai màu bộ ba (+120deg và -120deg), tất cả được tính bằng cách xoay sắc màu của màu gốc trong HSL.

Tôi có thể chọn màu trực quan thay vì gõ HEX không?

Có. Nhấp vào ô lớn với trình chọn màu tích hợp để chọn một màu; ô HEX tự động cập nhật, và bảng màu được tính lại ngay lập tức khi bạn thay đổi nó.

Dữ liệu màu của tôi có được tải lên đâu đó không?

Không. Mọi thứ chạy hoàn toàn trong trình duyệt của bạn bằng toán màu cục bộ — không có giá trị màu nào được gửi đến máy chủ, vì vậy nó hoạt động ngoại tuyến và giữ bảng màu của bạn ở chế độ riêng tư.