Create and organize your own color palettes. Add colors via HEX, eyedropper or from our library. Drag and drop to reorder. Export as CSS, JSON or Tailwind.
A coherent palette follows color harmony rules: first choose your dominant color, then apply a harmony (complementary, analogous, triadic). Add 1-2 neutrals for backgrounds and text. Limit yourself to 5-7 colors maximum. Check that each text/background combination achieves at least 4.5:1 WCAG contrast to ensure readability on all media.
Once your palette is created, export it as CSS variables to integrate directly into your stylesheet, as Tailwind config for your Next.js/Vue projects, or as JSON to transfer to Figma via the Tokens Studio plugin. Copy individual HEX codes to paste directly into Adobe XD, Sketch or your favorite prototyping tool.