brandsweets

Mood

154 vivid gradients

Looking for a vivid gradient? These 154 are the corpus entries whose stops actually read that way — high average chroma; the ones that need the gamut and banding lines in the report — tagged by measuring the stops in OKLCH, not by name. Every one renders in OKLab, ships its CSS and Tailwind v4, and carries the contrast verdict for both inks.

Make a new gradientAll gradients

Want whole palettes with this feel? Vivid colour palettes →

The other 94

The first 60 render as live cards above; these 94 have a page each, with the same CSS, Tailwind, verdicts and maker link. Every hex and verdict in one file is in gradients.md.

Every colour

Red116Orange53Yellow79Green88Teal114Blue223Purple104Pink102Neutral21

Every mood

Warm121Cool240Vivid154Muted146Light150Dark29Pastel60Neutral21Monochrome107Jewel Tones36Sunset62Ocean113Forest8Neon24Calm103
mcpConnect your agent to the gradient engine
live endpoint

Point any MCP client at the shared gradients endpoint and your agent gets the same engine as this page — make_gradient returns CSS with the interpolation space, Tailwind v4, SVG, a PNG URL, a DTCG token and the contrast report in one call; brand_gradients derives the whole contact sheet from a brand or a palette. Read-only, no key. Every gradient is a /gradients/new/… link: open it, refine, paste it back.

endpointhttps://mcp.brandsweets.com/gradients/mcp
claude mcp add --transport http brandsweets-gradients https://mcp.brandsweets.com/gradients/mcp
try this prompt

›suggest a vivid hero gradient for a new product, check it for white text, and give me the /gradients/new link

Want the agent to remember your picks and write them into a living brand? Create a free BrandSweets workspace.

Machine-readable: gradients.md · Corpus: uiGradients and WebGradients, both MIT — licences. Rendered in OKLab; the original sRGB look is one toggle away on each gradient's page.