Trình tạo phối màu hài hòa

Tạo bảng màu hài hòa chỉ trong vài giây. Nhập màu nền HEX để sinh bảng màu bổ sung, tương đồng, tam giác, tứ giác, bổ sung lệch và đơn sắc với mã HEX sẵn sàng sử dụng.

Thiết lập cơ bản
5Điều chỉnh số lượng sắc độ sáng tối được tạo trong bảng màu đơn sắc.
Kết quả phối màu
Bổ sung

Hai màu đối diện nhau trên vòng tròn màu cho độ tương phản mạnh mẽ.

Tương đồng

Các màu kề nhau tạo cảm giác mềm mại và chuyển sắc tự nhiên.

Tam giác

Ba màu cách đều nhau giúp bảng màu luôn sống động nhưng cân bằng.

Tứ giác

Hai cặp màu bổ sung mang lại bảng màu phong phú, dễ phân vai chính phụ.

Bổ sung lệch

Giữ lại độ tương phản của bổ sung nhưng dịu hơn nhờ chọn hai màu lân cận.

Đơn sắc

Các sắc độ sáng tối của cùng một màu để xây dựng trạng thái UI đồng nhất.

Trình tạo phối màu hài hòa - Có bảng màu cân bằng trong tích tắc

Nhà thiết kế, lập trình viên hay họa sĩ minh họa đều cần phối màu chuẩn để truyền tải cảm xúc và tính khả dụng. Công cụ này tự động hóa lý thuyết màu sắc, cung cấp ngay bảng màu bổ sung, tương đồng, tam giác, tứ giác, bổ sung lệch và đơn sắc để bạn sao chép dùng liền.

Phối màu hài hòa là gì?

Phối màu hài hòa mô tả cách các màu liên hệ trên vòng tròn để tạo sự cân bằng và tương phản.

Các mô hình phổ biến:
- Bổ sung: Hai màu đối diện, tạo điểm nhấn mạnh (logo, nút CTA)
- Tương đồng: Các màu liền nhau, hợp cho gradient dịu mắt (dashboard, infographic)
- Tam giác: Ba màu cách đều, vẫn sôi động nhưng cân đối (giao diện app, marketing)
- Tứ giác: Hai cặp bổ sung, dễ phân vai chính - phụ - nhấn
- Bổ sung lệch: Giữ năng lượng của bổ sung nhưng bớt gắt
- Đơn sắc: Tông sáng tối của cùng màu cho UI dễ truy cập

Cách sử dụng trình tạo phối màu?

Thao tác trong vài bước:
1. Chọn màu nền bằng bộ chọn hoặc nhập mã HEX
2. Tùy chỉnh số bước bảng màu đơn sắc (3-7 sắc độ)
3. Nhấn "Tạo bảng màu" để cập nhật mọi hài hòa
4. Sao chép từng màu hoặc cả bảng với một cú nhấp
5. Nhấn "Màu ngẫu nhiên" khi cần ý tưởng mới

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

Chọn hài hòa phù hợp mục tiêu:
- Bổ sung: Nút kêu gọi hành động, banner nổi bật
- Tương đồng: Nền gradient, biểu đồ, minh họa
- Tam giác: Bảng điều khiển năng động, sản phẩm giải trí
- Tứ giác: Bộ sản phẩm cần màu chủ đạo, phụ, nhấn
- Bổ sung lệch: Chiến dịch marketing muốn nổi bật nhưng vẫn dễ nhìn
- Đơn sắc: Trạng thái UI, chế độ sáng/tối, bảo đảm độ tương phản

Tính năng nổi bật

  • Sinh bảng màu bổ sung, tương đồng, tam giác, tứ giác, bổ sung lệch và đơn sắc
  • Đồng bộ giữa bộ chọn màu và ô nhập HEX
  • Tùy chỉnh số sắc độ đơn sắc từ 3 tới 7 bước
  • Sao chép nhanh từng màu hoặc toàn bộ bảng với thông báo tiếng Việt
  • Gợi ý màu ngẫu nhiên để khởi động cảm hứng
  • Bố cục responsive, hỗ trợ thao tác bàn phím
  • Tự động chọn màu chữ có độ tương phản tốt
  • Hỗ trợ chế độ tối để mẫu màu luôn rõ ràng
  • Chạy hoàn toàn trên trình duyệt, không cần tải tệp
  • Phù hợp cho thương hiệu, trạng thái UI, minh họa và slide thuyết trình