Tạo bảng màu
Bắt đầu từ một màu bạn yêu thích hoặc để ngẫu nhiên tạo bất ngờ, rồi giữ lại những tông màu hợp ý.
Đã niêm phong trên thiết bị này
Chạy ngay trong trình duyệt. Không có gì được tải lên.
Đã niêm phong
Bảng màu của bạn
Cài đặt
Tạo bảng màu xoay quanh màu gốc. Các màu đã khóa được giữ nguyên.
Xuất
Cách hoạt động
-
Chọn màu gốc hoặc ngẫu nhiên
Nhập một màu gốc và chọn kiểu phối màu, hoặc nhấn “Bảng màu mới” (hay phím cách) để có bảng màu mới.
-
Khóa màu bạn thích
Khóa những màu muốn giữ, rồi tạo lại: chỉ các màu chưa khóa thay đổi. Nhấp vào một ô màu để chỉnh tay.
-
Xuất bảng màu
Sao chép dưới dạng biến CSS hoặc JSON cho code của bạn, hoặc tải PNG để chia sẻ với nhóm.
Câu hỏi thường gặp
Các kiểu phối màu có ý nghĩa gì?
Chúng dựa trên vòng tròn màu. Màu tương đồng nằm cạnh nhau và tạo cảm giác êm dịu. Màu bổ túc nằm đối diện nhau và tạo tương phản. Bổ túc xen kẽ, bộ ba và bộ bốn trải đều các màu quanh vòng tròn để có bảng màu sinh động hơn. Đơn sắc dùng các phiên bản sáng hơn và tối hơn của cùng một sắc độ.
Tính năng khóa hoạt động thế nào?
Chọn biểu tượng ổ khóa bên dưới một màu để giữ màu đó. Khi bạn tạo bảng màu mới, các màu đã khóa giữ nguyên vị trí và các màu mới được chọn để hợp với chúng.
Tại sao các màu trông cân đối như vậy?
Bảng màu được tạo trong OKLCH, một không gian màu được thiết kế dựa trên thị giác con người. Xoay sắc độ trong đó giữ độ sáng và độ rực đồng đều, nên không màu nào trông sáng hay xỉn bất thường so với các màu còn lại.
Làm sao để dùng bảng màu trong dự án của tôi?
Sao chép phần xuất CSS và dán vào tệp CSS của bạn: bạn sẽ có các biến như --color-1 dùng được ở bất cứ đâu. Phần xuất JSON liệt kê mọi màu ở dạng HEX, RGB và OKLCH cho design token hoặc script.
Tôi có thể dùng bảng màu cho mục đích thương mại không?
Có. Màu sắc không thuộc sở hữu của ai, và bảng màu bạn tạo ở đây là của bạn, tự do sử dụng cho công việc cá nhân hay thương mại.