Palette Exporter

Export color palettes to multiple formats.

Export Colors for Any Project

Once you've created the perfect color palette, you need to use it in your projects. This tool exports your colors in formats ready for web development, design software, and documentation—no manual conversion required.

Whether you're building a design system, configuring Tailwind CSS, or documenting brand colors, we generate the exact format you need.

Export Formats

Tailwind CSS

Generates a configuration object for your tailwind.config.js file. Includes color values ready to extend or override Tailwind's default palette.

CSS Custom Properties

Modern CSS variables that can be used anywhere in your stylesheets. Perfect for theming and easy color management.

SCSS Variables

Sass/SCSS variable definitions for use in preprocessor-based workflows. Compatible with any SCSS project.

JSON

Structured data format for design tokens, configuration files, and programmatic access to your color palette.

GPL (GIMP Palette)

Palette file format compatible with GIMP, Inkscape, and other open-source design tools.

How to Use This Tool

  1. Enter your colors as comma-separated hex codes
  2. Give your palette a name (used in variable names)
  3. Set prefixes for CSS and Tailwind variable naming
  4. Choose a specific format or "All" to export all formats
  5. Click "Export" to generate the code
  6. Copy to clipboard or download as a file

Use Cases

  • Design Systems: Export design tokens in JSON for tools like Figma Tokens or Style Dictionary
  • Tailwind Projects: Quickly add brand colors to your Tailwind configuration
  • CSS Theming: Create CSS variables for light/dark mode or multi-theme support
  • Brand Guidelines: Export palettes for documentation and team sharing