# Gradients Studio

> Gradients Studio is a free mesh gradient generator for product sites, launch posts, OG images and decks. Grain is rendered into every 4K export, so gradients stay smooth on large screens instead of showing color bands. It runs in the browser, as an app inside ChatGPT, and as an MCP server for coding agents.

Key facts:
- Styles: blobs, stripes, clouds and rays. Finishes: grain, pixel (blue-noise dithered pixel art) and dither (dots or glyphs).
- Export: high-quality JPEG at 4K (3840 pixels wide for landscape, 2160 tall for portrait and square), no watermark. Sizes include 16:9 hero, 1.91:1 OG/link preview, 1:1, 4:5, 9:16 story and more.
- Free plan: 5 4K exports a month and 3 saved palettes. The first download needs no account (HD, 1920 × 1080 for 16:9) and keeps a pixel or dither finish; 4K needs a free account, and 4K with a finish needs Pro.
- Pro: $39 for 12 months of unlimited exports, pixel and dither finishes and 50 saved palettes. One payment, never auto-renews. Week Pass: $9 for 7 days.
- Commercial use is allowed on every plan.
- Video: Animate turns any frame into a looping MP4 (H.264, no sound) with no seam, 5 to 30 seconds long. Free accounts export up to 1080p at 30 fps, ending with a 1.5 second "Made with gradients.studio" card. Pro and the Week Pass export up to 4K (3840 × 2160 for 16:9; 21:9 is exactly 3840 × 1646, Apple's header video size) at 30 or 60 fps with no card. It renders in the browser (Chrome or Safari on a computer); exporting needs a sign-in.
- Not offered: CSS or SVG export, GIF or WebM.
- Every design has a link that reopens its exact settings.

## Use it

- [Studio](https://www.gradients.studio/canvas): the editor in the browser.
- [ChatGPT app](https://chatgpt.com/plugins/plugin_asdk_app_6abe1d5e3e048191adc509c94fe81709): type @Gradients Studio in ChatGPT and describe the background; it shows six live variations to pick, tweak and export.
- [MCP server](https://www.gradients.studio/mcp): for Claude Code, Cursor, Claude Desktop and other MCP clients.

## Guides

- [Mesh gradient generators compared](https://www.gradients.studio/best-mesh-gradient-generators): 11 tools on output, grain, pixel, dither, animation, price and sign-up, with a "best for" pick per job. Updated October 2026.
- [Grainy gradient generators compared](https://www.gradients.studio/best-grainy-gradient-generators): 10 grain and noise tools, same table. Updated October 2026.
- [Dither gradient tools compared](https://www.gradients.studio/best-dither-gradient-tools): 9 dithering tools, from gradient makers to image ditherers. Updated October 2026.
- [Gradients Studio vs MagicPattern](https://www.gradients.studio/vs/magicpattern): features and pricing side by side, and when to pick MagicPattern.
- [Gradients Studio vs meshgradient.com](https://www.gradients.studio/vs/meshgradient-com): features and pricing side by side, and when to pick meshgradient.com.
- [Gradients Studio vs InstantGradient](https://www.gradients.studio/vs/instantgradient): features and pricing side by side, and when to pick InstantGradient.
- [Gradients Studio vs fffuel](https://www.gradients.studio/vs/fffuel): features and pricing side by side, and when to pick fffuel.
- [Grainy gradient generator](https://www.gradients.studio/grainy-gradient)
- [Noise gradient generator](https://www.gradients.studio/noise-gradient): heavy grain (up to 80%), free to export in 4K.
- [Pixel gradient generator](https://www.gradients.studio/pixel-gradient)
- [Pixel art gradient generator](https://www.gradients.studio/pixel-art-gradient): palette cells with a blue-noise dithered fade.
- [8-bit gradient generator](https://www.gradients.studio/8-bit-gradient): large cells, hard color steps.
- [1-bit gradient generator](https://www.gradients.studio/1-bit-gradient): two colors, dithered.
- [Pixel gradient wallpaper](https://www.gradients.studio/pixel-gradient-wallpaper): pixel cells at desktop and phone sizes.
- [Dither gradient generator](https://www.gradients.studio/dither-gradient)
- [Bayer dither gradient](https://www.gradients.studio/dither-gradient/bayer): ordered 4 × 4 Bayer dithering.
- [Halftone gradient generator](https://www.gradients.studio/halftone-gradient): round dots on an ordered grid.
- [Glyph dither gradient](https://www.gradients.studio/glyph-dither-gradient): ASCII-style, up to 16 characters of your choice.
- [Dither wallpaper](https://www.gradients.studio/dither-wallpaper): ordered dither at desktop and phone sizes.
- [Dithered background generator](https://www.gradients.studio/dither-background): a dither over a smooth gradient at 85% opacity, quiet enough for a headline.
- [Aurora gradient generator](https://www.gradients.studio/aurora-gradient)
- [OG video generator](https://www.gradients.studio/og-video): paste a website, get a looping 1200×630 og:video in its logo, colours and words, with the meta tags to add it. Plays in iMessage link previews.
- [Animated gradient background generator](https://www.gradients.studio/animated-gradient): seamless MP4 loops of any gradient, sized for site heroes, App Store headers, launch posts and slides.
- [Spotify Canvas size](https://www.gradients.studio/spotify-canvas/size): Spotify Canvas specs (9:16, 3 to 8 seconds, MP4 or JPG, 720 × 1280 to 1080 × 1920), a file checker that runs in the browser, and seamless canvas loops to make in the studio (720 × 1280 free with no end card, 1080 × 1920 on Pro).
- [Discord banner maker](https://www.gradients.studio/backgrounds/discord-banner): gradient Discord profile banners, still or as animated GIFs (Discord's minimum is 680 × 240, PNG, JPG or GIF under 10 MB, Nitro only), free first download; GIF export is free for any signed-in account, with no watermark or end card.
- [Discord server banner maker](https://www.gradients.studio/backgrounds/discord-server-banner): gradient server banners at Discord's recommended 960 × 540 (16:9), still or as animated GIFs, top 48 px kept calm for the server name.
- [Twitch banner maker](https://www.gradients.studio/backgrounds/twitch-banner): gradient Twitch profile banners at Twitch's recommended 1200 × 480, made to stretch cleanly on wide screens.
- [Twitch panel maker](https://www.gradients.studio/backgrounds/twitch-panel): gradient Twitch panel images (Twitch takes up to 320 × 600 px, under 1 MB), headers at 320 × 100, free first download.
- [Bluesky banner maker](https://www.gradients.studio/backgrounds/bluesky-banner): gradient Bluesky banners in its 3:1 shape (its app keeps up to 2000 × 667 and 1 MB, PNG or JPEG), with the desktop crop and avatar marked, free first download.
- [Blurry gradient generator](https://www.gradients.studio/blurry-gradient)
- [Gradient backgrounds](https://www.gradients.studio/gradient-background)
- [Free gradient wallpapers](https://www.gradients.studio/wallpapers)

## Optional

- [Home page and FAQ](https://www.gradients.studio/)
- [About](https://www.gradients.studio/about)
- [License](https://www.gradients.studio/license)
- Contact: hello@gradients.studio