Gradients Studio

MCP server

Gradient backgrounds from Claude Code, Cursor and any MCP client

The same renderer as the studio, where the prompt is typed. Ask for a grainy dark hero, a dithered launch post or a 1200×630 OG image and the file lands in your repo.

free previews · 5 free exports a month · no card

Install

Create a key in the studio (account menu → API keys), then add the server. Claude Code:

claude mcp add gradients --transport http https://www.gradients.studio/mcp --header "Authorization: Bearer <your key>"

Cursor, Claude Desktop, Windsurf and others take the same URL and header in their MCP config:

{ "mcpServers": { "gradients": { "url": "https://www.gradients.studio/mcp", "headers": { "Authorization": "Bearer <your key>" } } } }

Then try: “Add a dark, grainy hero background to the landing page, 2560×1440, something like Linear.”

Three tools

render_gradient

Every dial the studio has: style, palette, seed, grain, pixel and dither finishes, shape overlays, or your logo as an SVG. Without a size it returns a free 960px preview inline so the agent can look before it commits. With a size, exact pixels, it returns a download URL.

list_palettes

The studio's twelve palettes, the ones behind sites you already admire (Linear, Stripe, Raycast, Lovable, Dia…), your saved palettes, and six tuned starting points for the jobs designers ship: website hero, launch post, deck slide, product screenshot, integrations grid, App Store shot.

suggest_settings

A brief in plain words, such as “dark, premium, fintech hero, a bit retro”, becomes two or three starting points. It understands jobs, moods, product names, styles and finishes. Your agent is the taste layer; this narrows thirty dials to a few good defaults.

Look, then commit

The loop is preview, adjust, preview again. Previews are free, so the agent can iterate as long as it needs. A sized export is the only metered call, and the settings come back with every result so nothing has to be reconstructed from memory.

Your logo, as the overlay

Pass the raw text of an SVG and the server reduces it to an outline and draws it as concentric rings over the gradient, the same feature the studio has for uploaded shapes. The agent already has the file on disk; nothing to upload.

Questions

What does it cost?
Previews are free and unmetered. Sized exports use the same pool as the web: 5 free a month, unlimited on Pro ($39 for 12 months) or a Week Pass ($9 for 7 days). One-time payments, nothing to cancel.
Does an agent retrying burn my exports?
No. Asking for the same export twice within 24 hours returns the same URL and costs nothing. Only a new set of settings at a size counts.
Which clients work?
Anything that speaks MCP over Streamable HTTP with a header: Claude Code, Claude Desktop, Cursor, Windsurf, and the MCP Inspector. The server is stateless, so there is nothing to keep alive.
Can I take over in the studio?
Every result includes a studio link with the exact settings, so you can open it in the browser, adjust by hand and export from there.
Where does my key live?
Create it in the studio under your account menu. It is shown once; we store only a hash. Revoke it from the same place.

Get a key

Sign in to the studio, create a key from your account menu, paste the install line. Two minutes, then your agent makes backgrounds.

Open the studio