React Generator

React theme constants and CSS-in-JS objects.

Randomize a palette, pick each swatch, or build a harmony from a base color — then export React tokens.

Palette builder

Pick colors or randomize

Generate from a base color

Base

Harmony

Token name

Export

export const brandColors = {
  color1: '#e11d48',
  color2: '#db2777',
  color3: '#c026d3',
  color4: '#f59e0b',
  color5: '#111827',
} as const;