Importing and Exporting

v1.1.14

Bring palettes into Petals from links, code, swatch files, and images, then share or export them in common formats.

Importing Palettes

Open the preset viewer, click the import button, and choose where your colors are coming from.

URL imports Petals share links and Coolors URLs.
HEX imports hex codes separated by commas, spaces, or newlines.
CSS imports custom properties, hex values, rgb(), and hsl().
Tailwind imports config snippets that contain color values.
ASE imports Adobe Swatch Exchange files.
Image samples a palette from a PNG, JPG, GIF, or WebP file.

Text imports show a color preview before you confirm. File imports create the palette as soon as the file is read.

Import palette modal showing URL, HEX, CSS, ASE, Tailwind, and Image import options.

Imported palettes are saved as new project palettes. Petals keeps the first 19 colors and trims anything extra.

Exporting Palettes

Hover a palette card in the preset viewer and click the export button.

Copy URL creates a shareable Petals palette link.
HEX copies comma-separated hex codes.
CSS copies CSS custom properties.
Tailwind copies a Tailwind config snippet.
PNG exports a 1600x900 palette image.
PDF exports full-bleed color strips.
ASE exports an Adobe Swatch Exchange file.
X / Pinterest opens a social share dialog.

Export modal showing a color swatch strip and a grid of export format buttons: URL, HEX, CSS, PNG, PDF, ASE, Tailwind, X, Pinterest.

File exports are saved to the export folder set in Petals settings. By default, that folder is your Desktop.