Generate in one press
Hit Space for a fresh five-color palette. Lock the colors you like and the rest are rebuilt around them.
Learn more →See your colors on a real page before you use them.
Palette generates color palettes for apps and websites and paints this whole page with them, in light and dark. Tweak any color, check contrast, then export to CSS or Tailwind.
Free · Runs in your browser · Nothing to install
How it works
Five colors: text, background, primary, secondary, and accent. Every one of them is on this page.
Hit Space for a fresh five-color palette. Lock the colors you like and the rest are rebuilt around them.
Learn more →This whole page is painted with your palette, so you judge colors on buttons, cards, and text, not swatches.
Learn more →Every palette passes WCAG AA contrast, in light and dark. Tap a swatch to check or edit any color.
Learn more →Export your palette or share it with a link that opens exactly these colors.
Export
CSS variables
For any website
Tailwind theme
For Tailwind projects
JSON & SCSS
For apps and design tools
Components
Tabs, toggles, menus, tables, and more, all in your palette. Try them: they work.
Tabs
Your workspace at a glance: 12 open tasks, 3 due today.
Maya commented on “Launch plan” 5 minutes ago.
Notifications, members, and billing live here.
Segmented control
Pagination
Switches and checkboxes
Slider and progress
Dropdown menu
Accordion
Yes. Upgrade or downgrade any time, and we prorate the difference.
Every paid plan starts with 14 days free.
Data is encrypted in transit and at rest.
Inputs
Dialog
This removes “Brand refresh” and its 24 tasks. You can’t undo this.
Loading
Empty state
Create your first project to start planning with your team.
Table
| Project | Owner | Status | Progress |
|---|---|---|---|
| Website redesign | Maya Kim | Active | 72% |
| Mobile app | Leo Park | Review | 90% |
| Brand refresh | Ana Silva | Planned | 15% |
“Five squares can look great and still fail on a real page. Here you see it before you ship it.”