Trình tạo bảng màu – Bảng màu hài hòa

Tạo bảng màu hài hòa ngay lập tức

Chọn màu phối hợp đẹp mắt là một trong những thách thức phổ biến nhất trong thiết kế. Quy tắc hài hòa màu, dựa trên mối quan hệ giữa các sắc độ trên vòng màu, cung cấp nền tảng đáng tin cậy để xây dựng bảng màu cân bằng.

Trình tạo bảng màu này nhận bất kỳ màu cơ sở nào và áp dụng quy tắc hài hòa chuẩn để tạo ra bộ màu bổ sung. Nhập màu ở định dạng HEX, RGB hoặc HSL và chuyển đổi giữa các loại hài hòa để khám phá các tổ hợp khác nhau.

Các loại hài hòa màu giải thích

• Bổ sung — hai màu đối diện nhau trên vòng màu (cách nhau 180°). Tương phản cao, tổ hợp táo bạo.
• Tương đồng — ba màu liền kề trên vòng màu (cách nhau 30°). Tự nhiên hài hòa và tương phản thấp.
• Tam giác — ba màu cách đều quanh vòng (cách nhau 120°). Rực rỡ và cân bằng.
• Bổ sung tách đôi — màu cơ sở cộng hai màu liền kề với màu bổ sung của nó (150° và 210°). Mềm mại hơn bổ sung thuần túy.
• Tứ giác (Vuông) — bốn màu cách đều quanh vòng (cách nhau 90°). Bảng màu phong phú và phức tạp.

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

1. Nhập màu cơ sở — gõ giá trị HEX, RGB hoặc HSL, hoặc dùng bộ chọn màu mặc định
2. Chọn loại hài hòa từ bộ chọn
3. Kéo một điểm liên kết trên vòng tròn để đổi sắc độ và độ bão hòa, rồi điều chỉnh độ sáng
4. Xem bảng màu tạo ra hiển thị dưới dạng mẫu màu
5. Sao chép giá trị HEX hoặc RGB cho bất kỳ mẫu nào bằng một cú nhấp chuột
6. Chuyển đổi giữa các loại hài hòa để so sánh các bảng màu khác nhau

Khi nào nên dùng Trình tạo bảng màu

• Bắt đầu dự án thiết kế mới và cần bảng màu cân bằng
• Xây dựng nhận diện thương hiệu xung quanh màu chủ đạo cụ thể
• Tạo chủ đề giao diện với màu nhấn hài hòa
• Khám phá quan hệ màu cho minh họa hoặc nghệ thuật
• Tạo bảng màu nhanh cho thuyết trình hoặc nguyên mẫu

Hài hòa chính và biến thể hỗ trợ

Mỗi kiểu hòa sắc tạo năm mẫu màu. Bổ túc có hai màu chính; tương đồng, tam giác và bổ túc xen kẽ có ba; tứ giác có bốn. Các mẫu còn lại là biến thể hỗ trợ được điều chỉnh độ bão hòa hoặc độ sáng.

Tạo năm màu từ một màu cơ sở

Màu cơ sở được đánh dấu vẫn được giữ nguyên trong khi vòng tròn tính toán hòa sắc và các biến thể. Dùng Trích xuất bảng màu từ ảnh cho các màu chủ đạo của toàn bộ ảnh và Bộ chọn màu cho màu chính xác của một pixel.

Sử dụng HEX, RGB, HSL và OKLCH

Ô nhập hỗ trợ HEX, RGB, HSL và OKLCH. Sao chép từng màu ở dạng HEX hoặc RGB, hoặc cả năm màu dưới dạng mã HEX viết hoa, phân tách bằng dấu phẩy.

Nhanh, miễn phí và riêng tư

Mọi phép tính diễn ra trong trình duyệt. Không cần tài khoản, tải lên, lưu trữ hay xử lý máy chủ; vòng tròn hoạt động với chuột, cảm ứng và bàn phím.

Vòng tròn thể hiện quan hệ màu theo lý thuyết nhưng không đảm bảo khả năng đọc. Dùng Kiểm tra độ tương phản để đo WCAG và Bộ chuyển đổi màu để đổi định dạng.

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

Hài hòa màu là gì?

Hài hòa màu đề cập đến sự kết hợp các màu trông hài hòa với nhau. Các kết hợp này dựa trên mối quan hệ hình học giữa các sắc độ trên vòng màu.

Nên dùng loại hài hòa nào?

Tùy thuộc vào mục tiêu thiết kế của bạn. Bổ sung tạo tương phản mạnh. Tương đồng cảm giác êm dịu. Tam giác rực rỡ và cân bằng. Bổ sung tách đôi mang lại tương phản mềm hơn. Tứ giác cho bảng màu phong phú và phức tạp.

Có thể nhập định dạng màu nào?

Bạn có thể nhập HEX, RGB, HSL hoặc OKLCH; định dạng được nhận diện tự động.

Màu bảng màu được tính như thế nào?

Màu cơ sở được chuyển sang HSL và đặt tại các góc sắc độ chính xác của kiểu hài hòa đã chọn. Mỗi mối quan hệ được mở rộng thành năm mẫu màu thực dụng với các biến thể độ bão hòa và độ sáng cân bằng. Vòng tròn tương tác hiển thị từng mẫu: kéo một điểm sẽ xoay toàn bộ kiểu hài hòa, còn thanh độ sáng cập nhật bảng màu.

Có thể sao chép màu đã tạo không?

Có. Sao chép từng màu ở dạng HEX hoặc RGB, hoặc toàn bộ bảng màu thành năm mã HEX viết hoa, phân tách bằng dấu phẩy.

Công cụ này có hoạt động trên di động không?

Có. Vòng tròn đáp ứng hoạt động bằng cảm ứng trên điện thoại và bằng chuột hoặc bàn phím trên máy tính.

Công cụ này có miễn phí không?

Có. ColourPicker.app hoàn toàn miễn phí sử dụng, không cần đăng ký.

Có thể lưu bảng màu đã tạo không?

Công cụ không lưu bảng màu giữa các phiên. Bạn có thể sao chép giá trị màu từng cái và lưu vào tệp dự án hoặc công cụ thiết kế của mình.

Vòng tròn màu thể hiện điều gì?

Nó sắp xếp sắc độ theo vòng tròn: góc biểu thị sắc độ, khoảng cách từ tâm biểu thị độ bão hòa và thanh riêng điều chỉnh độ sáng.

Tại sao mỗi bảng màu có năm màu?

Năm mẫu tạo một bộ làm việc nhất quán gồm hai đến bốn màu chính và các biến thể hỗ trợ cần thiết.

Màu chính và biến thể hỗ trợ là gì?

Màu chính tạo nên hình học đã chọn; biến thể dùng lại các sắc độ đó với độ bão hòa hoặc độ sáng khác.

Hòa sắc có đảm bảo độ tương phản đủ không?

Không. Hòa sắc mô tả quan hệ sắc độ; hãy đo riêng độ tương phản WCAG giữa tiền cảnh và nền.