ColorSwatches.org

Procreate Swatches Viewer & Converter

Upload a Procreate .swatches palette file to view all its colors as swatches with hex and RGB values. Export the palette for use in web or print design workflows. Everything runs locally in your browser — your file is never sent to any server.

Drag & drop a .swatches file here

or click to browse

About Procreate Swatches Files

Procreate palettes are saved as .swatches files — a ZIP archive containing a single Swatches.json file. Each swatch is stored as HSB (Hue, Saturation, Brightness) values between 0 and 1, along with an alpha value and color space identifier.

This tool converts those HSB values to standard hex and RGB codes, making them easy to use in web design, CSS, or any application that doesn't speak Procreate natively.

How to export a palette from Procreate

  1. Open Procreate and tap the Palettes panel (swatches icon in the toolbar)
  2. Tap the three-dot menu on the palette you want to export
  3. Choose Share → the file will export as a .swatches file
  4. AirDrop, email, or save it to Files, then upload it here

Supported export formats

  • CSS variables — ready to paste into any stylesheet
  • SCSS variables — for Sass/SCSS projects
  • JSON — for use in code or design token pipelines
  • ASE — import into Photoshop, Illustrator, or InDesign
  • PNG color cards — shareable swatch image with hex and RGB labels
  • Procreate .swatches — re-export after viewing (useful for renaming or inspecting)

More Color Tools

Analogous Color Palette Generator

Generate an analogous color palette from any starting color. 3–5 colors adjacent on the color wheel — harmonious, natural, and easy to work with.

Try it →

HSL to HSV Converter

Convert between HSL and HSV (HSB) color formats directly, without going through RGB. Bidirectional converter with formula explanations.

Try it →

RGB to HSV Converter

Convert between RGB and HSV (also called HSB) color formats. Bidirectional converter with sliders and formula explanations.

Try it →

Monochromatic Color Palette Generator

Generate a monochromatic color palette from any starting color. Tints, shades, and tones of a single hue — clean, cohesive, and versatile.

Try it →

Image Color Palette Extractor

Upload any image to extract a color palette. Choose 2 to 10 dominant colors displayed as swatches with hex and RGB codes.

Try it →

Hex ↔ RGB Converter

Convert between hexadecimal color codes and RGB values instantly. Enter a hex code to get RGB values, or enter R, G, B numbers to get the hex code.

Try it →

Browse all tools →