Question 1

What are color harmony rules?

Accepted Answer

Color harmony rules are mathematical relationships on the color wheel that create pleasing color combinations. Complementary colors are opposite each other (180°), analogous are adjacent (30°), triadic are evenly spaced (120°), and split-complementary uses two colors adjacent to the complement.

Question 2

How do I create a complementary color scheme?

Accepted Answer

Select a base color, choose 'Complementary' as the harmony type, and click generate. The tool will calculate the color directly opposite on the color wheel (180° hue rotation) which creates high contrast and vibrant combinations.

Question 3

Can I extract colors from an image?

Accepted Answer

Yes! Click 'From Image' to upload any image. The tool analyzes the image and extracts the 5 most dominant colors to create a palette. This is perfect for matching website colors to brand photography or creating themed palettes.

Question 4

What export formats are available?

Accepted Answer

Export your palette as: Tailwind config (for tailwind.config.js), CSS variables (:root custom properties), SCSS variables ($variable format), JSON (for design tokens), or Figma tokens (compatible with Figma's token system).

Question 5

How does the accessibility checker work?

Accepted Answer

The accessibility tab analyzes all possible color combinations in your palette and checks their contrast ratios against WCAG 2.1 standards. It shows which pairs pass AA (4.5:1) and AAA (7:1) requirements for text readability.

Question 6

Can I lock colors while generating?

Accepted Answer

Yes! Click the lock icon on any color to keep it fixed while randomizing or generating new palettes. This is useful when you have a brand color that must be included in every palette variation.

Tailwind Palette Generator

Keyboard Shortcuts