Introducing AI Palette. Your colors, in every prompt.

March 2026 · 4 min read

We shipped something today that we think changes how designers and developers work with AI coding tools.

It's called AI Palette. One click, and Paletter generates a COLORS.md file — a complete color system spec that AI tools like Claude Code, Cursor, and Windsurf read automatically. Your exact palette. In every prompt. No corrections.

Why we built this

We kept hearing the same thing from users. They'd spend 30 minutes building a perfect palette in Paletter — roles assigned, contrast checked, tokens exported. Then they'd open their AI coding tool and ask it to build a component.

The AI would use Tailwind blue. Or arbitrary grays. Or some hex value from its training data that had nothing to do with the palette sitting two tabs over.

The palette was done. The code didn't know it existed.

This felt like a broken handoff. You do the design work, you export the tokens, but there's a gap between "I have a color system" and "my tools use it." AI coding tools are the newest member of that toolchain, and nobody was bridging the gap.

What AI Palette actually generates

A COLORS.md file isn't just a hex list. We tried that. It doesn't work. The AI still makes bad decisions because it doesn't understand relationships between colors.

So the file includes everything the AI needs to make correct decisions:

Roles with intent

Not "Color 1, Color 2, Color 3." Background, Ink, Accent, Support, Neutral — each with a description of what it does and where to use it. The AI knows that your accent is for CTAs and focus rings, not body text.

Pre-computed contrast ratios

Every meaningful color pair, with WCAG AA and AAA pass/fail already calculated. The AI doesn't need to compute anything. It can see that ink-on-background passes AAA but accent-on-background fails for body text — and act accordingly.

Ready-to-use code blocks

Semantic CSS custom properties and a Tailwind v4 @theme block, ready to copy. When the AI writes a component, it reaches for var(--color-bg) instead of inventing bg-gray-50.

Explicit rules

This is the part that makes it work. The file includes instructions like "never use accent as body text on background" and "always place ink-colored text on accent buttons." Without these, the AI makes plausible-looking decisions that break your contrast ratios. With them, it stays on brand.

Why this matters more than you think

This isn't just a convenience feature. It's about a shift in how design systems get consumed.

Design tokens were built for build tools. CSS variables, Tailwind configs, Figma tokens — they're consumed by compilers, bundlers, and design tools. They're machine-readable, but they're read by deterministic machines that do exactly what you tell them.

AI coding tools are different. They're probabilistic. They interpret context and make decisions. A Tailwind config tells the bundler "this color exists." A COLORS.md tells the AI "this color exists, here's what it's for, here's what it pairs with, and here's what you must never do with it."

Design tokens for compilers. Color systems for AI. Different consumers, different specs.

We think every project that uses AI coding tools will have a COLORS.md within a year. Not because we said so — because the alternative is correcting your AI on every prompt. Nobody wants that.

How to use it

Generate a palette on Paletter — from an image, from color theory, from an inspiration palette. Go to the Export tab. Hit AI Palette.

Drop the downloaded COLORS.md in your project root. That's it.

Claude Code reads it automatically. Cursor indexes it with your workspace. Windsurf picks it up from project context. Any AI tool that reads your files will use it.

No plugins. No configuration. Plain markdown.

What's next

AI Palette is a Pro feature — part of the same export toolkit that includes CSS, Tailwind, SCSS, ASE, GPL, design tokens, and README generation. Your first 3 exports are free, so you can try it before committing.

We're also working on a deeper guide to the COLORS.md pattern — how to customize it, how to reference it in your CLAUDE.md or Cursor rules, and advanced patterns for multi-brand projects.

But for now: generate a palette, export the AI file, drop it in your project. See what happens when your AI actually knows your colors.

Give your AI your colors

One-click export. Works with Claude Code, Cursor, Windsurf, and any tool that reads project files.

Generate your AI palette