
Nhập một màu cơ sở, công cụ sẽ tạo 9 bảng màu hài hòa: đơn sắc, bổ sung, tam giác, pastel và nhiều hơn. Mỗi màu có thể sao chép cùng mã HEX.
Bảng màu đơn sắc
Tất cả màu có cùng sắc độ (H), khác nhau chủ yếu về độ sáng (L) trong không gian màu HSL.
#0b28ba
#153af2
#4f6bf5
#899cf8
#c3ccfc
Bảng màu bộ ba
Ba sắc độ cách nhau 120° trên bánh xe màu (đỉnh của tam giác đều) – hình học thường dùng trong branding và thiết kế phong cách Bauhaus.
#4f6bf5
#f43757
#7ff667
#f87f94
#42f21f
Bảng màu bổ sung chia tách
Biến thể của bảng màu bổ sung – thay vì một màu bổ sung (180°), hai màu dịch chuyển khoảng ±30° từ màu bổ sung được sử dụng, giảm căng thẳng thị giác nhưng vẫn giữ được độ tương phản mạnh.
#4f6bf5
#f5864f
#bef54f
#f7a176
#b0f328
Bảng màu pastel
Cùng sắc độ với độ bão hòa giảm và độ sáng tăng – dịch chuyển về giữa và đỉnh của không gian HSL, tạo ra màu mềm, "kem".
#e1e5f4
#d3d7ee
#c4cae9
#b5bde3
#a6b0dd
Bảng màu tối
Cùng sắc độ với độ bão hòa cao (S) và độ sáng thấp (L) – dịch chuyển xuống trên trục độ sáng, tạo ra màu sâu đặc trưng cho chế độ tối và điểm nhấn mạnh.
#3757f4
#153af2
#0c2dd2
#0a25ab
#081d85
Bảng màu sắc độ (lấy cảm hứng Material Design)
Nhiều mức độ sáng của một sắc độ – L biến đổi và S vừa phải, tương tự phạm vi sắc độ trong hướng dẫn Material Design (ví dụ 50-900).
#f2f3f8
#dcdfef
#b1bae7
#7c8ee9
#3e5df4
Bảng màu tối giản (lấy cảm hứng Apple)
Một điểm nhấn màu nổi bật và nhiều tông trung tính rất sáng, nhẹ nhàng – bố cục đặc trưng của giao diện với nhiều khoảng trắng và bóng đổ tinh tế.
#3e5df4
#fafafa
#efeff1
#dfdfe2
#484951
Bảng màu tương tự
Các màu có sắc độ tương tự – từ khoảng -30° đến +30° quanh màu cơ sở trên bánh xe màu cổ điển (ví dụ Itten).
#4fbef5
#67a3f6
#4f6bf5
#4637f4
#864ff5
Bảng màu bổ sung
Màu cơ sở và màu bổ sung dịch chuyển 180° trên bánh xe màu – một trong những đối lập màu cơ bản được mô tả bởi Johannes Itten.
#4f6bf5
#1f42f2
#f5d94f
#f8e37f
#f2cf1f
Bảng màu nhất quán là nền tảng của mọi dự án hình ảnh — từ website, qua logo, đến vật liệu in. Chọn thủ công các màu phối hợp với nhau đòi hỏi kiến thức về lý thuyết màu sắc. Công cụ tạo thực hiện tự động: bạn cung cấp một màu cơ sở (ví dụ: màu logo), và công cụ tạo 9 bộ màu dựa trên các phối màu hài hòa đã được chứng minh.
Mỗi màu được tạo đi kèm mã HEX (ví dụ: #4F6BF5) và giá trị HSL (sắc độ, bão hòa, độ sáng). Mã HEX có thể dán trực tiếp vào CSS, Figma, Canva hoặc bất kỳ ứng dụng đồ họa nào.
Toàn bộ quá trình chỉ mất vài giây:
Công cụ tạo 9 loại bảng màu — mỗi loại dựa trên nguyên tắc lý thuyết màu khác nhau:
Tất cả bảng màu được tạo bằng cách biến đổi toán học màu cơ sở trong không gian màu HSL. HSL mô tả màu bằng ba giá trị: sắc độ (H) là vị trí trên vòng màu (0°–360°), bão hòa (S) xác định cường độ màu, và độ sáng (L) — màu sáng hay tối như thế nào.
Bảng màu bổ sung, tam giác và bổ sung tách dựa trên hình học vòng màu — các màu được đặt ở khoảng góc bằng nhau, tạo cân bằng thị giác. Bảng màu đơn sắc, pastel và tối chỉ thay đổi độ sáng và bão hòa trong khi giữ nguyên sắc độ.