Build your color chart.
Browse color families from light to dark.
WCAG AA · normal text
Use the selected swatch or enter a HEX color.
Choose a swatch to inspect its color.
A color chart puts swatches side by side so you can compare hues and find a shade. Use the atlas to browse color families, or enter your own HEX codes to build a chart for a brand, website, or illustration.
Choose Color scales and paste up to eight HEX codes. Each row keeps your input in the middle, with lighter tints on the left and darker shades on the right. Choose Color transition for a row of RGB blends.
Copy individual codes or download the full chart as a PNG. A free account unlocks bulk codes and CSS exports. Pro adds SVG, Tailwind, and JSON. Text contrast is measured against black and white; check your actual background in the Color Contrast Checker.