Bánh xe màu

275 người đã dùng

Chọn một màu gốc, nhận ngay bảng màu hài hoà. Xuất sang Photoshop, CSS, Tailwind.

Quy tắc phối màu: Tương đồng
Bảng màuBấm một màu để chỉnh
Xuất bảng màuCho web hoặc phần mềm Adobe

                                        
                                    

                                    

                                        Tải về:
                                        
                                        
                                        
                                    

                

                    

                    
Độ tương phảnChuẩn WCAG 2.1

                    

                                        

                                            
Màu chữ

                                            

                                            
Màu nền

                                            

                                            
                                        

                                        

                                            
Aa Thiết kếChữ thường 16px trên nền này

                                            
4.5:1tỉ lệ tương phản

                                            

                                        

                                    

                                

                
                    

                    
Xem như người mù màuChỉ đổi cách hiển thị

                    

                                        
                                        
                                        
                                        
                                        
                                    

                

                

                

            

        


Xem nhanh cách dùng


Xong việc này? Labs gợi ý bước tiếp theo
Kiểm tra màu cá nhânLấy màu trên màn hìnhĐổi mã màu


Câu hỏi thường gặp
Bánh xe màu là gì và dùng để làm gì?
Bánh xe màu sắp xếp các màu theo vòng tròn sắc độ, giúp bạn chọn những màu đi cùng nhau theo các quy tắc lý thuyết màu. Công cụ này tạo nhanh bảng 5 màu hài hoà cho logo, poster, giao diện web hay bộ nhận diện thương hiệu.
Công cụ bánh xe màu này có miễn phí không, có cần đăng nhập không?
Hoàn toàn miễn phí và không cần đăng nhập. Mọi thao tác chạy ngay trên trình duyệt của bạn; nếu đã đăng nhập ColorME, ảnh PNG, SVG bạn tải về còn được lưu vào mục Lịch sử để dùng lại. Khi bạn tải PNG, ColorME nhận một bản ảnh bảng màu để theo dõi cách công cụ được dùng.
Khác gì so với Adobe Color?
Cách dùng tương tự Adobe Color: 5 chấm màu, màu gốc, các quy tắc phối màu, bánh xe hoạ sĩ RYB và xuất file ASE. Điểm khác là giao diện tiếng Việt, có sẵn kiểm tra tương phản WCAG, xem như người mù màu và xuất thẳng CSS, SCSS, Tailwind.
Bánh xe "Màu hoạ sĩ RYB" và "Màu RGB" khác nhau thế nào?
RYB là bánh xe truyền thống của hội hoạ với ba màu gốc đỏ, vàng, lam, nên màu bổ sung của đỏ là lục như khi pha màu vẽ. RGB là bánh xe màu màn hình, màu bổ sung của đỏ là xanh cyan. Mã màu bạn nhận được vẫn là màu RGB dùng được trên máy tính.
Có những quy tắc phối màu nào?
Có 8 lựa chọn: tương đồng, đơn sắc, bộ ba, bổ sung, bổ sung chia tách, ghép đôi (hai cặp màu bổ sung), sắc độ (cùng màu khác độ sáng) và tuỳ chỉnh để kéo từng chấm tự do.
Màu gốc là gì, đổi màu gốc thế nào?
Màu gốc là chấm lớn có vòng trắng bên trong, các màu còn lại được tính theo nó. Chọn một ô màu rồi bấm "Đặt làm màu gốc" để đổi; ô màu gốc có nhãn GỐC kèm biểu tượng ngôi sao.
Làm sao nhập mã màu thương hiệu có sẵn?
Chọn ô màu gốc, nhập mã vào ô HEX (ví dụ #2563EB) hoặc chuyển sang RGB, HSB, LAB, CMYK để nhập số. Cả bảng màu sẽ tự đổi theo quy tắc đang chọn.
Khoá màu dùng để làm gì?
Bấm biểu tượng ổ khoá trên một ô để giữ nguyên màu đó khi bạn bấm Ngẫu nhiên hoặc khi màu gốc thay đổi. Rất tiện khi đã chốt được một vài màu và muốn thử phần còn lại.
Làm sao đưa bảng màu vào Photoshop hoặc Illustrator?
Bấm Xuất rồi chọn "ASE (Adobe)" để tải file Adobe Swatch Exchange. Trong Photoshop mở bảng Swatches, chọn Import Swatches; trong Illustrator dùng Open Swatch Library > Other Library để mở file này.
Có xuất được mã cho web như CSS hay Tailwind không?
Có. Mục Xuất cho phép sao chép biến CSS, biến SCSS, cấu hình màu Tailwind hoặc JSON gồm HEX, RGB, HSB, LAB, CMYK của cả 5 màu, và tải ảnh PNG hoặc SVG của bảng màu.
Kiểm tra độ tương phản dùng thế nào?
Chọn một màu chữ và một màu nền trong bảng, công cụ hiện tỉ lệ tương phản và cho biết có đạt chuẩn WCAG AA, AAA cho chữ thường, chữ lớn hay không. Nên đạt tối thiểu 4.5:1 cho chữ nội dung.
Có chia sẻ bảng màu cho người khác được không?
Có. Bấm Chia sẻ để sao chép liên kết; bảng màu, quy tắc và kiểu bánh xe được lưu ngay trong liên kết nên người nhận mở ra sẽ thấy đúng bảng màu của bạn.
Dùng trên điện thoại được không, có phím tắt không?
Dùng được trên điện thoại, chỉ cần chạm và kéo các chấm màu. Trên máy tính, phím cách tạo bảng màu ngẫu nhiên, Ctrl/⌘ + Z để hoàn tác, và có thể chọn chấm màu rồi dùng phím mũi tên để chỉnh sắc độ, độ bão hoà.


5/5 · 2 đánh giá


Công cụ cùng nhóm
Tất cả công cụ
Kiểm tra Personal Color của bạnKiểm tra màu cá nhânHotHút màu ở bất kỳ đâu, ra HEX, RGB, HSL, CMYKLấy màu trên màn hìnhHEX, RGB, HSL, CMYK, OKLCH qua lạiĐổi mã màuChữ trên nền có đạt chuẩn WCAG khôngKiểm tra tương phảnDải màu tuyến tính, toả tròn, xuất CSSTạo gradient CSSLấy dải màu gradient từ chính bức ảnhTạo gradient từ ảnhTạo dải 50–950 từ 1 màu, xuất CSS, TailwindThang màu & design tokenXem thiết kế qua mắt người mù màuMô phỏng mù màu