Color Palette Generator

Build a color palette, edit its colors and arrange them. Save or export the result for your project.

Quick presets

Hex #776487
Hex #63B04F
Hex #AC38B7
Hex #63886D
Color Studio The full suite: picker, palettes, gradients, contrast Color Picker Pick colors and convert HEX, RGB, HSL, HSV, CMYK Gradient Generator Linear, radial, conic and mesh CSS gradients Contrast Checker Check text contrast and try approximate vision filters Image Color Picker Pick colors and extract palettes from supported images Image Converter Convert images to JPG, PNG, WebP, AVIF and other formats

Your statistics

0
Colors picked
0
Palettes exported
0
Gradients generated
0
Contrasts checked
Color picker
Favorite mode
0%
Usage score

How to make a color palette

Docs

Choose a quick preset such as Pastel or Ocean, or click Random palette. Read the colors together before editing. Random creates suggestions for you to refine, rather than checking whether a palette meets a particular design requirement.

Build a palette you can reuse

Seven starting palettes

Start from Material, Tailwind, Pastel, Vintage, Neon, Earth or Ocean, then change the colors to suit the job.

Random colors with locks

Lock colors you want to keep, then generate another palette to replace the unlocked colors.

Edit and reorder

Change a swatch, add or remove colors and drag the cards into the order you need.

Show 3 moreShow less

Files and CSS variables

Export PNG, JPG or SVG palette images with optional HEX and RGB labels. Download JSON or copy the colors as CSS variables.

Named presets

Save a palette with a name to keep it in this browser. The unsaved working palette starts from Material when you reopen the page.

Related color tools

Open Image extractor for photo palettes. The mode selector also offers a color picker, gradients and contrast checks.

Frequently asked questions

How do I make a color palette?

Choose a preset or generate random colors. Edit the swatches, lock colors before generating again and drag the cards to reorder them. Export the result or save it as a named preset.

Can I generate a random palette?

Yes. Random palette replaces unlocked colors. Locked colors stay in the palette, so you can keep a starting color while trying different combinations.

Can I make a palette from a photo?

Open Image extractor using the mode links. That page selects dominant colors from a supported image. The palette builder is for editing a set of swatches.

Which presets are included?

Material, Tailwind, Pastel, Vintage, Neon, Earth and Ocean. Each preset is a four-color starting point, not a complete design system or an accessibility guarantee.

Show 4 moreShow less

Which exports are available?

Download PNG, JPG or SVG palette images with optional HEX and RGB labels, download JSON with HEX and RGB values, or copy CSS variables. PNG and JPG width is adjustable. Exports describe the palette, not your full design.

Can I lock colors and reorder them?

Yes. Use a swatch lock to keep that color during random generation, then drag a card by its grip to change the order. The HEX and RGB buttons change the displayed format.

Is the palette generator free?

Yes. MORELESS provides it without an account. Save a named preset if you want to keep a palette in this browser, and export a copy for your own backup.

Will my palette still be here next time?

Named presets are saved in this browser through IndexedDB. The unsaved working palette opens on Material again. Clearing site data can remove saved presets, and they are not synchronized between devices.

Technical details

Presets and random generation

The seven built-in presets contain four colors each. Random generation chooses hue, saturation and lightness and converts them to RGB colors. Locks preserve colors by their HEX value during regeneration.

Swatch editing

Cards can be edited, added, removed and reordered. HEX and RGB are display choices for the same colors. Focus mode shows the palette as larger vertical strips.

Show 2 moreShow less

Export formats

PNG and JPG exports have adjustable width from 120 to 7680 px and height of roughly one-sixth the width. SVG uses a 1200 by 200 coordinate space. Image formats support HEX and RGB labels. CSS is copied as numbered custom properties. JSON includes HEX and RGB data.

Named presets in this browser

Named palettes are saved through the shared Color Studio IndexedDB store. The unsaved working palette is not restored after reopening. Export copies before clearing browser storage.