brandsweets

Colour

104 purple gradients

104 named purple gradients from the two open corpora we bundle (uiGradients and WebGradients, both MIT) — lilac, violet, plum and indigo — the hues with the biggest gap between sRGB and OKLab midpoints, so every purple gradient here is rendered perceptually. Each has its own page with the CSS and Tailwind v4 to copy, a worst-case contrast verdict for white and black text, and an "open in the maker" link that carries the whole gradient in the URL.

Make a new gradientAll gradients

The other 44

The first 60 render as live cards above; these 44 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

›make me three purple hero gradients in oklch that pass AA for white text, and give me the /gradients/new links

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.