Experiment

Color Lab

Generate and explore color palettes with contrast checking and export to design tokens.

Back to all projects

About

Color Lab is an interactive tool for designers and developers to generate, refine, and export color palettes. It supports multiple generation algorithms including complementary, analogous, triadic, and AI-assisted palette suggestions. Every color pair is checked against WCAG contrast ratios, with clear pass/fail indicators. Palettes can be exported as CSS custom properties, Tailwind config objects, Figma tokens, or simple JSON. A live preview panel shows how the palette looks on sample UI components.

Features

  • Multiple palette generation algorithms
  • WCAG contrast ratio checking for every color pair
  • Export to CSS variables, Tailwind config, and Figma tokens
  • Live preview on sample UI components
  • Color blindness simulation mode

Tech Stack

ReactUI Framework
chroma.jsColor Manipulation
Tailwind CSSStyling
ZustandState Management

Other Projects

More things I've built