Color Palettes & Tailwind Color Tools for Developers
Color is where design systems either hold together or fall apart. The tools here help you generate palettes, check contrast against WCAG thresholds and export tokens for Tailwind, CSS or Figma.
Pick a generator for speed or a contrast checker for accessibility reviews — then export the result directly into the token format your project already uses.
5 resources · last reviewed 2026-10-03 · curated by re • sources editors
Colour Contrast
Accessible contrast checker for WCAG 2.2 compliance.
UI Colors
Tailwind CSS colour palette with contrast data.
ShaderGradient
Animated and mesh gradient generator.
Color Hunt
Curated four-colour palette collections.
MagicPattern
Generators for backgrounds, grids, shapes and avatars.
Frequently asked questions
Do these tools check WCAG contrast ratios?
Yes. The dedicated contrast checkers validate foreground and background pairs against WCAG 2.1 AA and AAA thresholds for normal and large text.
Can I export palettes for Tailwind CSS?
Several entries export ready-to-paste Tailwind color scales, CSS custom properties or design tokens in JSON format.