Quay Lại Công Cụ

Color Palette Generator

Tạo bảng màu đẹp tức thì

Miễn phí 100%Chạy trên trình duyệtKhông cần đăng ký

Gioi thieu ve cong cu nay

Xây dựng bảng phối màu hài hòa cho dự án thiết kế. Chọn từ các chế độ bổ sung, tương tự, tam giác và bổ sung phân tách, hoặc trích xuất bảng màu từ ảnh. Xuất dưới dạng biến CSS, JSON hoặc mẫu PNG cho aukimi Inkwell và các công cụ khác. Thuoc aukimi Inkwell.

Tinh nang

  • Nhiều chế độ hài hòa màu sắc
  • Trích xuất màu từ hình ảnh
  • Xuất dạng CSS, JSON hoặc PNG
  • Điều chỉnh độ bão hòa và độ sáng
  • Sao chép mã màu riêng lẻ

Truong hop su dung

Bảng màu cho trang web và ứng dụngBảng màu nhận diện thương hiệuLập kế hoạch màu cho minh họa

Chia sẻ công cụ này

Giúp người khác khám phá

HN

Tạo tài khoản miễn phí để xóa watermark

Lưu tác phẩm của bạn, truy cập bộ công cụ sáng tạo đầy đủ và xuất không có watermark.

Tạo Tài Khoản Miễn Phí

Cần thêm?

Thử aukimi Inkwell

Chỉnh sửa bitmap chuyên nghiệp với lớp, mặt nạ, bộ lọc và hỗ trợ tablet đầy đủ.

Tìm hiểu thêmTạo Tài Khoản Miễn Phí

How to create a color palette

Generate a 5-color palette using harmony rules, extract from an image, or browse community palettes — then export to code.

  1. 1

    Pick a harmony mode

    Trending (curated), complementary, triadic, tetradic, analogous, split-complementary, or monochromatic.

  2. 2

    Press Space to regenerate

    Each press rolls a new palette within your chosen harmony. Lock any color (padlock icon) to keep it between rolls.

  3. 3

    Or extract from an image

    Click Extract and drop a photo — k-means pulls 5 dominant colors.

  4. 4

    Check contrast

    Open the Contrast panel to see WCAG AA/AAA ratios for every color pair.

  5. 5

    Export

    Choose Tailwind, SCSS, CSS Variables, SVG strip, Figma JSON, or PNG from the Export bar.

Câu hỏi thường gặp

How are the "Trending" palettes chosen?

The 177-palette curated list is hand-picked from highly-rated community sources (ColourLovers top-rated, Coolors trending, industry designers). Pressing Space rolls a new trending palette each time.

Can I extract a palette from my own image?

Yes. Click Extract from Image, drop a photo or artwork, and the tool runs a k-means clustering on the pixels to pull out 5 dominant colors. Works great for mood-board analysis and photo-derived brand palettes.

What is the difference between complementary, triadic, and tetradic harmonies?

Complementary picks one color plus its opposite on the wheel (max contrast). Triadic uses three colors 120° apart (vibrant but balanced). Tetradic picks four colors in two complementary pairs (rich, harder to balance). Analogous uses neighbors on the wheel (calm, cohesive).

How do I export to Figma / Tailwind / SCSS?

Use the Export bar at the bottom. Tailwind emits a config snippet ready to paste under `theme.extend.colors`. SCSS gives you `$name-N` variables plus a map. Figma format is native JSON importable via the Figma Tokens plugin.

Do my palettes get saved?

If you are signed in, you can save palettes to My Palettes. Otherwise, use the Share button — you get a link that encodes the palette and lets anyone load it without account.

What does the Contrast Check assess?

WCAG AA (4.5:1) and AAA (7:1) contrast ratios for every pair of colors in the palette, so you know which combinations are safe for body text vs large text vs decoration only.