🛝Toolio
About Contact

🎨 Color Palette Generator

Instantly generate beautiful 5-color palettes using harmony modes like analogous, complementary, and triadic — or pull a palette straight out of any image, or from a mood word like sunset. Lock the colors you like and the rest of the palette is built around them, then export the set as a HEX list, CSS variables, Tailwind config, JSON, or Figma tokens. It's completely free and runs entirely in your browser with no uploads or login. Looking for a free Coolors alternative? Toolio’s version is completely free and needs no sign-up.

Press Spacebar to generate a new palette.

Private by design. This tool runs entirely in your browser — nothing you enter is uploaded, and it works offline.

About

This tool builds 5-color palettes in three ways: generate them from four harmony modes (Random, Analogous, Complementary, Triadic); type a mood word such as sunset, ocean or cyberpunk to get a palette in that style; or extract five prominent colors from any image you choose — the image is processed locally with median-cut quantization, every result is a color that actually occurs in the image, and nothing is uploaded. Lock individual swatches to keep them across regenerations; in the Analogous, Complementary and Triadic modes the rest of the palette is then built around the hue of the first locked swatch. Copy any single HEX code or export the whole palette in the format you need: a plain HEX list, CSS custom properties, a Tailwind colors snippet, a JSON array, or Figma design tokens. Everything runs in your browser, so no color or image data ever leaves your device — no server, no account. Each swatch also shows its nearest PANTONE Solid Coated number (for example, PANTONE 185 C), so a generated or image-derived palette can move straight toward a print workflow.

How to use

  1. Choose a harmony mode — Random, Analogous, Complementary, or Triadic — from the Mode dropdown.
  2. Click Generate (or press Spacebar) to create a fresh 5-color palette.
  3. Click the lock icon on any swatch to keep that color; the other swatches are regenerated around its hue (in Random mode they stay random).
  4. Click Copy HEX on a swatch to copy that color's HEX code to your clipboard.
  5. Use Copy All to copy all five colors at once, in the export format selected next to it, for use in your design tool or code.
  6. Click 'From image' and choose a photo — the tool pulls its five dominant colors into the palette, all locally.
  7. Pick an export format — HEX list, CSS variables, Tailwind, JSON, or Figma tokens — and click Copy All to drop the palette into your project.
  8. Or type a mood word such as sunset, ocean or cyberpunk and click From mood to generate a palette in that style.

FAQ

Is this tool free to use?
Yes, completely free — no subscription, no account, and no hidden limits. Just open the page and start generating palettes.
Do you upload my color data to a server?
No. The entire tool runs in your browser using JavaScript. Nothing is sent to any server — your palette data stays in your browser's localStorage only.
Does the Color Palette Generator work offline?
Yes. Once the page is loaded, it works fully offline. There are no external API calls or CDN dependencies required.
What is the difference between the harmony modes?
Random picks five unrelated hues. Analogous spreads five hues 20° apart over an 80° stretch of the color wheel for a calm, cohesive look. Complementary puts two swatches near the base hue and three on the opposite side of the wheel (170°, 180° and 190° away) for high contrast. Triadic places hues 120° apart: two swatches near the base hue, two near +120°, and one at +240°. Saturation and lightness vary within a moderate range in every mode. The wheel is the HSL (screen-light) color wheel, so the complement of red is cyan rather than green.
Can I keep a color I like while regenerating the rest?
Yes. Click the lock icon on any swatch to keep it. Locked swatches are skipped during generation. In the Analogous, Complementary and Triadic modes the other swatches are built around the hue of the first locked swatch (a grey swatch has no hue and is ignored for this), so the palette stays harmonious around your favorite color; in Random mode they stay random. Your palette and locks are saved in this browser.
Can I build a palette from an image?
Yes. Click 'From image' and pick a photo. The tool shrinks it, groups similar pixels with median-cut quantization, and picks the five most prominent groups that look clearly different from one another. Each result is a color that actually occurs in the image rather than an average, sorted from dark to light, and it all happens in your browser — the image is never uploaded. If the image has fewer than five distinct colors, such as a flat single color, the remaining swatches are lighter and darker steps of the dominant color.
What export formats are available?
Copy the palette as a plain HEX list, CSS custom properties (:root variables), a Tailwind colors snippet, a JSON array, or Figma design tokens (Tokens Studio format). Choose the format in the dropdown, then click Copy All — ready to paste into your code or design tool.
Can I see Pantone numbers for the palette?
Yes. Each of the five swatches shows its HEX code and the nearest PANTONE Solid Coated match (e.g. PANTONE 185 C); click the Pantone label to copy it. Matches use the perceptual CIEDE2000 formula and are an approximate sRGB reference, since Pantone spot inks are defined physically rather than by a screen value.
Can I generate a palette from a word?
Yes. Type a mood such as sunset, ocean, cyberpunk or obangsaek (the traditional Korean five colors) in the mood box and click From mood. Known mood words use a matching hue, saturation and lightness range, and obangsaek returns the five fixed traditional colors. Words the tool does not know still produce a palette, but its colors are not related to the meaning of the word.