All IT Tools

Palette Generator

Choose a seed color and build a useful, exportable color palette.

Focus on this tool.

Start with a color

Color picker

Hex color

Palette style

Your palette

#16878C

HEX
#16878C

RGB
rgb(22, 135, 140)

HSL
hsl(183 73% 32%)

Text contrast on this color

Black: 4.88:1 · White: 4.30:1. Normal text needs at least 4.5:1 for WCAG AA. A color pair is not a full accessibility audit.

Selected: Balanced. Choose from the 10 options below; CSS and downloads follow your selection.

Palette CSS

:root {
  --palette-1: #16878C;
  --palette-2: #20CE9C;
  --palette-3: #0F5C60;
  --palette-4: #208DCE;
  --palette-5: #0F2760;
}

10 palette options

Each keeps your exact seed color as the first swatch. Pick a look, then copy or download the selected palette above. Color choices still need foreground/background contrast checks.

Color accuracy & accessibility

Hex, RGB and HSL describe sRGB colors. Pixel readings use the browser-decoded image; color profiles, transparency and display settings can affect appearance. Screen picking is an optional browser feature; image picking works without it. Always check actual foreground/background pairs before using a palette for text.

Reference: WCAG contrast guidance.

Calculated in your browser. Inputs and files aren’t uploaded or saved. Tool sources & licenses