Palette Exporter
Paste or import a set of colors and export them instantly to CSS variables, SCSS, Tailwind config, JSON or SVG swatches — the finishing step for any palette.
Paste HEX values (one per line, or separated by commas/spaces). rgb() and hsl() are accepted too.
No valid colors found — check your input.
Everything runs in your browser — paste a palette and copy production-ready code in any format. No sign-up, completely free.
About Palette Exporter
The Palette Exporter is the finishing step for any color palette: paste in a set of colors and get production-ready code in the format your project needs. It accepts HEX values one per line or separated by commas and spaces, and understands rgb() and hsl() notation too.
Six output formats are generated live: CSS custom properties, SCSS variables, a Tailwind config color block, JSON, SVG swatches and a plain HEX list. A configurable variable prefix keeps the generated names consistent with your codebase, and each format can be copied to the clipboard or downloaded as a file.
Everything runs in your browser — the colors you paste are never sent anywhere. It pairs naturally with the other palette tools: extract or generate a palette elsewhere, paste it here, and walk away with the exact snippet your stylesheet, framework or design pipeline expects.
How to use Palette Exporter
- Paste your colors into the input — HEX, rgb() or hsl(), one per line or comma-separated.
- Click "Update colors" to parse them into a palette, or load the sample to try it out.
- Choose an export format: CSS variables, SCSS, Tailwind config, JSON, SVG swatches or plain HEX.
- Adjust the variable prefix if you want custom naming.
- Copy the generated code or download it as a file.