Use it from an AI agent

The Page Patterns MCP server lets AI agents such as Claude Code design a pattern background for a section of your site, show you options in your own page and add the one you pick.

What the agent does

1. Reads your page: the section's colour, the size of the area at desktop and phone widths, and where the headline and buttons sit.
2. Explores: it draws a dozen or more variants, studies them and keeps three or four that suit the section.
3. Shows you: each option in your real page, at desktop and phone width, so you can pick.
4. Adds your pick: it puts the SVG in the section, adds the CSS and checks both widths.

What you need

• An AI tool that supports MCP servers: Claude Code, Cursor, Claude Desktop and others.
• Node 22 or later on your computer.
• A free key. Get your key by signing in with GitHub or Google. The account page shows the setup steps for your tool, with your key filled in when you make it.

In Claude Code, the Page Patterns plugin adds the MCP server and a skill that teaches Claude the steps above. Then ask, for example, "make the hero background more interesting".

What leaves your computer

The MCP server runs on your computer, and your designs and your site's files stay there. About once a day it checks your key with our account service, which runs on Supabase, sending only the key. See the privacy notice.