Production-ready brand palettes across industries.
Start by picking the palette that best matches the visual brief, then assign roles before you ship anything to production. The lightest swatch typically becomes the page background; the darkest becomes body text or a primary brand mark; mid-tones become borders, secondary buttons and supporting illustration. Test every text-on-surface pair in the contrast checker - aim for 4.5:1 (WCAG AA) on body copy and 3:1 on large text.
For richer scales, drop the dominant color into the design system tool to generate a 12-step OKLCH ramp; that gives you tints, shades and hover states that feel uniform across the whole interface. To turn the palette into a gradient, click any palette below and use the “Make a gradient” action - the OKLCH-interpolated output preserves the palette’s mood without the muddy mid-points sRGB gradients are famous for.