Bảng chọn màu & Vòng màu
Phối màu hài hòa
Bộ chọn màu từ hình ảnh - Nhận mã màu HEX và RGB
Chọn một pixel để đọc các giá trị HEX, RGB và HSL hoặc xuất bảng màu chủ đạo dưới dạng biến JSON hoặc CSS.
Thả ảnh vào — nhấn vào bất kỳ điểm ảnh nào để lấy mã màu hoặc trích xuất toàn bộ bảng màu
PNG, JPG, WEBP, GIF
Bạn có thể làm gì với Trình chọn màu
Xem lại các khả năng chính trước khi bạn bắt đầu.
- Chọn bất kỳ màu nào từ ảnh dưới dạng mã HEX, RGB hoặc HSL
- Trích xuất bảng màu chủ đạo từ hình ảnh
- Lấy màu thương hiệu từ ảnh chụp màn hình hoặc logo
- Sao chép mã màu cho thiết kế của bạn
- Xuất bảng màu thành JSON hoặc biến CSS
- Tạo bảng phối màu từ một ảnh tham chiếu
Tham khảo cài đặt
cài đặt 9
Các điều khiển có sẵn cho Trình chọn màu.
- Chế độ xử lýCài đặt sẵn
- Xử lý một đầu vào hoặc chuyển sang chế độ theo lô của Premium để áp dụng cùng thiết lập cho nhiều đầu vào. Loại đầu vào được hỗ trợ tùy thuộc vào công cụ.Tùy chọn: Một ảnhHàng loạt
Bảng chọn màu & Vòng màu
- Ngẫu nhiênMột cú nhấp
- Chuyển sang một màu ngẫu nhiên mới chỉ với một cú nhấp để lấy cảm hứng nhanh; các giá trị HEX, RGB, HSL và bảng màu hòa sắc đều cập nhật cùng lúc.
- Độ bão hòa và độ sángThanh trượtPhạm vi: 0–100%
- Kéo điểm đánh dấu trong ô vuông để đặt độ rực của màu (từ trái sang phải) và độ sáng tối (từ trên xuống dưới).
- Tông màuThanh trượtPhạm vi: 0–360 · Mặc định: 211
- Trượt dọc thanh cầu vồng để chọn tông màu gốc, đi từ đỏ qua vàng, lục, lam, magenta rồi quay lại đỏ.
- HEXNhập văn bản
- Gõ hoặc dán bất kỳ giá trị màu nào — mã HEX, ký hiệu rgb() hoặc hsl(), hay tên màu CSS — để nhảy thẳng đến đúng màu đó.
- RGBÔ nhập sốPhạm vi: 0–255
- Đặt riêng từng kênh đỏ, xanh lá và xanh dương từ 0 đến 255 khi bạn cần khớp chính xác một giá trị RGB trong bản đặc tả thiết kế.
- HSLÔ nhập sốPhạm vi: 0–360
- Điều chỉnh sắc độ (0–360) cùng độ bão hòa và độ sáng (0–100) bằng số — hữu ích khi bạn muốn chỉnh màu sáng hơn hoặc trầm hơn mà không đổi tông màu.
Bảng màu chủ đạo
- Kích thướcDanh sách thả xuống
- Chọn số màu chủ đạo được trích xuất từ ảnh đã tải lên (mặc định 8); chọn số nhỏ để có bảng màu thương hiệu gọn gàng hoặc số lớn để lộ ra các sắc màu nhấn.Tùy chọn: 58101624
- Màu đã chọnBộ chọn màu
- Nhấp hoặc chạm vào bất kỳ vị trí nào trên ảnh đã tải lên để lấy mẫu đúng điểm ảnh đó; mỗi lần chọn sẽ thêm một ô màu kèm giá trị HEX, RGB và HSL, có thể xóa từng ô hoặc xóa tất cả cùng lúc.
Các công cụ liên quan dành cho Trình chọn màu
Công cụ dành cho các bước tiếp theo phổ biến sau Trình chọn màu.
Sáng tạo & Thiết kế
Trình Tạo Bảng Màu
Tạo 3–8 bảng màu với các chế độ hài hòa, khóa và chia sẻ màu, sau đó xuất PNG, biến CSS hoặc JSON.
Dùng thử ngay
Sáng tạo & Thiết kế
Bánh Xe Màu
Sử dụng bánh xe màu tương tác để tìm các hòa âm bổ sung, tương tự, ba, bốn và vuông với mã HEX có thể sao chép.
Dùng thử ngay
Sáng tạo & Thiết kế
Ý Nghĩa Màu Sắc
Khám phá ý nghĩa màu sắc, tâm lý học, biểu tượng, bối cảnh văn hóa, ví dụ về thương hiệu và các cặp đôi được đề xuất cho bất kỳ giá trị HEX nào.
Dùng thử ngayCâu hỏi thường gặp
Trình chọn màu giúp bạn hoàn thành công việc như thế nào
Những vấn đề thực tế mà nó giải quyết hàng ngày — cho doanh nghiệp, người sáng tạo và các công việc hàng ngày. Tìm trường hợp sử dụng phù hợp với bạn và bắt đầu.
Đánh giá nhận diện thương hiệu
Lấy chính xác các giá trị HEX từ một logo hoặc tài sản marketing có sẵn để đưa vào bộ hướng dẫn phong cách của bạn. Khớp màu thương hiệu của đối thủ cho bộ slide định vị hoặc bài pitch.
Xây dựng bảng màu thiết kế web
Trích xuất các màu chủ đạo từ một bức ảnh hoặc bảng cảm hứng, xuất ra dưới dạng biến CSS và đưa thẳng vào tệp định kiểu của bạn. Khoảng 5-8 màu là điểm lý tưởng, bao gồm màu chính, màu nhấn và màu trung tính, làm nền tảng cho một hệ thống thiết kế hoàn chỉnh.
Danh sách sản phẩm thương mại điện tử
Khớp màu nền ảnh sản phẩm với giao diện cửa hàng của bạn. Chọn màu nhấn chủ đạo từ ảnh giày thể thao hay váy và dùng nó làm điểm nhấn nổi bật cho mục đăng bán.
Cảm hứng nội thất & thời trang
Chụp một căn phòng hoặc trang phục bạn thích và trích xuất bảng màu. Dùng nó để chọn sơn, vải vóc hoặc phụ kiện bổ trợ cho tông màu hiện có — biến cảm hứng thị giác thành các mẫu màu thực tế.
Bảng Phối Màu Trực Quan Hóa Dữ Liệu
Tạo bảng màu phân loại gồm 10-16 màu lấy từ một hình ảnh bạn muốn gợi cảm hứng (ví dụ: một bức tranh màu nước cho biểu đồ dịu nhẹ, một cảnh hoàng hôn cho dải màu chuyển từ ấm sang lạnh). Tốt hơn việc chọn các sắc màu chung chung.
Quy trình tạo tài nguyên game & giao diện
Trích xuất bảng màu được lập chỉ mục từ sprite art hoặc bản phác giao diện để đưa vào công cụ pixel-art hoặc game engine. Tệp JSON bảng màu xuất ra tương thích với Aseprite, Photoshop và hầu hết các quy trình xử lý tài nguyên.
Kiểm tra độ tương phản WCAG trước khi bạn phát hành
Chọn một cặp màu chữ và màu nền trong Bộ chọn màu & Vòng màu độc lập và đọc ngay tỷ lệ tương phản của chúng so với trắng và đen, để bạn phát hiện lỗi tiếp cận AA/AAA trước khi đưa vào production.
Tinh chỉnh màu sơn & màu in tùy chỉnh
Bỏ qua hoàn toàn bức ảnh — gõ một giá trị HEX, RGB hoặc HSL chính xác, hoặc kéo các điều khiển độ bão hòa/sắc màu, để xác định chính xác một hỗn hợp sơn, màu chấm hoặc tông màu thương hiệu cụ thể, rồi kiểm tra tên màu gần nhất của nó để dễ trao đổi với nhà cung cấp.
Bảng mẫu màu nhiều điểm từ một tấm ảnh
Nhấn vào nhiều điểm trên một ảnh tham chiếu — bầu trời, một chiếc váy, một bông hoa — để dựng nên một bộ mẫu màu nhiều màu được chọn lọc thay vì phụ thuộc vào bảng màu chủ đạo được trích xuất tự động, rồi xuất ra dưới dạng JSON hoặc CSS cho mood board của khách hàng.
Bộ màu thương hiệu hài hòa tức thì
Nhập mã HEX của thương hiệu để tính toán các mẫu màu bổ sung, bộ ba và bổ sung tách để xem xét trong mẫu xã hội hoặc bảng quảng cáo.
Trích xuất bảng design token từ ảnh chụp màn hình của đối thủ
Tải lên một ảnh chụp màn hình trang web hay ứng dụng của đối thủ thay vì một tấm ảnh, và bộ trích bảng màu chủ đạo sẽ rút ra chính xác các màu nền, màu nhấn và màu chữ dưới dạng mã HEX mà bạn có thể xuất thành biến CSS — một cách nhanh để tái tạo một sơ đồ màu cho bản so sánh hay bộ trình bày.
Ngắm nhìn từng vùng đất chuyển hóa
Mỗi bức ảnh đều vượt qua dấu gạch chéo và đi ra phía bên kia.
