An image API that
keeps the design.
Build the template once in the Pixy editor, name the elements you plan to change, then POST text, image sources, fills and strokes against it. No headless browser to babysit, no HTML rebuild of a layout that already exists — and the typography is the designer’s, exactly.
Free plan · 20 credits · no card required
import { Pixy } from "@pixy-art/sdk" const pixy = new Pixy(process.env.PIXY_API_KEY) const image = await pixy.generate(DESIGN_ID, [ { id: TITLE_ID, text: "Autumn drop is live" }, { id: IMAGE_ID, src: product.imageUrl },])
1
Endpoint to learn
4
Modifiable fields
3
Export formats
1,500+
Templates to start from
POST app.pixy.art/api/v1/{designId}/generate · Authorization: Bearer YOUR_API_KEY
What teams build
One template, and everything you were making by hand.
Anything you produce more than once from the same layout. The design stays a design; your data supplies the rest.
Certificates and badges
textRender a named, dated certificate the moment a course is completed. PDF back, straight into the completion email.
Invoices and receipts
textLine items, totals and tax filled from the billing webhook, returned as a PDF your app can attach or store.
Social preview images
text + srcA per-article OG image built from the headline and the hero photo, generated when the post is published rather than designed by hand.
Catalogue images
src + textPoint the image element at the new product shot and the price element at the new price. One request per row of the feed.
Ad variants
text + fillEvery headline, offer and palette your paid team wants to test this week, from one approved layout.
Personalised email
textA header that says the recipient’s name, their city or their plan, localised across every market you send to.
- Your design is never reimplemented
- No HTML clone, no CSS approximation. Pixy renders the same design object the editor saved, so the kerning, the letter-spacing and the exact position of every element are the ones the designer approved — not whatever a headless browser decided this week.
- The layout cannot drift
- A replacement image is scaled to fill the original frame and centre-cropped, so a portrait product shot dropped into a landscape slot does not move anything around it. Text reflows inside its own box and nowhere else.
- A copy change does not need you
- The design stays editable in the editor. When marketing wants the badge moved, they move it, and your integration keeps sending the same element ids at the same endpoint.
How it works
From a design file to a production pipeline in an afternoon.
Four steps, and the fourth one is your data arriving. There is no fifth step where a designer opens a file.
- 01Editor
Design it once
Open a template or build your own in the Pixy editor. Give the elements you plan to change a name you will recognise later — the headline, the product shot, the badge.
- 02IDs
Copy the IDs
Every design has a designId, and every element inside it has its own id. Copy them straight out of the editor. That is the whole integration surface.
- 03POST /generate
Send modifications
POST an array of modifications — text, src, fill, stroke — against the design. One request, one element or fifty, in whatever order your data arrives.
- 04PNG · JPEG · PDF
Get files back
Pixy renders the design with your changes applied and returns the finished files. PNG, JPEG or PDF, at the size the design was built at.
Don’t read about it.
Change something.
These are the four fields the API can modify, wired to a real design. Edit any of them and watch the canvas repaint — then take the request it wrote for you and run it against your own template.
textTitle elementtextBadge elementfillHex valuesrcImage elementformatExport option
Autumn drop is live
design_id · png
Drawn in your browser so you can play with it instantly. The real call returns the same design as a downloadable file, rendered by Pixy — not a screenshot of a web page.
const image = await pixy.generate(DESIGN_ID, [ { id: TITLE_ID, text: "Autumn drop is live", }, { id: BADGE_ID, text: "New in", fill: "#6c3bf0", }, { id: IMAGE_ID, src: "https://cdn.example.com/linen-set.jpg", },], { format: "png" })Modifications
Examples to modify images from code.
Here are some quick examples on how to get started to auto-generate images. Read our API docs for full understanding on modifications.
Replace text
Text changes keep the original text element’s styling and position. The text box can resize based on the new content, unless that text element is using “autofit” behavior.
const image = await pixy.generate(DESIGN_ID, [ { id: TITLE_ID, text: "New season drop", },])Replace image source
Replacement images are always scaled to fill the original image element’s size. If the new image has a different aspect ratio, Pixy keeps the center of the new image in view and crops the outer edges as needed so the layout stays aligned.
const image = await pixy.generate(DESIGN_ID, [ { id: IMAGE_ID, src: "https://example.com/cover.jpg", },])Multiple changes on the same element
You can send multiple supported fields for one element in the same modification object when they apply to that element type.
const image = await pixy.generate(DESIGN_ID, [ { id: TITLE_ID, text: "New season drop", fill: "#111827", stroke: "#ffffff", },])Multiple changes on different elements
One request can update multiple elements at once by sending multiple modification objects, each with its own element id.
const image = await pixy.generate(DESIGN_ID, [ { id: TITLE_ID, text: "New season drop", fill: "#111827", stroke: "#ffffff", }, { id: IMAGE_ID, src: "https://example.com/cover.jpg", }, { id: ELEMENT_ID, fill: "#111827", },])MCP
Or let an agent call it.
Pixy speaks Model Context Protocol, so Claude, Cursor or your own agent can find a template, read the elements it exposes, pull your brand colours and render the file — without you writing the integration at all.
One endpoint, authenticated by the Automation key you already have — no second credential and no OAuth flow to complete. Every tool is the REST endpoint of the same name, so an agent gets the same validation, the same credit accounting and the same line in your request log that your backend does.
The whole setup
{ "mcpServers": { "pixy": { "type": "http", "url": "https://app.pixy.art/api/mcp", "headers": { "Authorization": "Bearer YOUR_API_KEY" } } }}What an agent can do
list_templatesSearch the template library by keyword, category or size.
get_templateRead a template’s named elements — how an agent learns what it can change.
list_designsThe designs your organization has already saved.
list_brand_kitsYour logos, colours and fonts, ready to drop into a render.
duplicate_designCopy a template into your account as an editable design.
generate_imageApply modifications and render. PNG, JPEG or PDF back.
generate_ai_imageRender with the image element generated from a prompt.
get_accountPlan, credits used and credits remaining.
Why Pixy
The honest comparison.
Two other ways to get a thousand on-brand images. Both work. Here is what each one costs you.
| Approach | By hand | Headless screenshots | Pixy |
|---|---|---|---|
| Time to the 200th variant | Days | Hours of CSS | One loop |
| Who makes a copy change | A designer | A front-end dev | Whoever owns the data |
| What you maintain | A file per variant | An HTML clone of the design | One template |
| Typography and kerning | Exact | Browser-dependent | Exact |
| PDF output | Manual export | Extra plumbing | A format flag |
| Non-technical editing | Yes | No | Yes — same editor |
Automations
One call today. No-code next.
The API and the MCP server are live now and do everything on this page. The connectors below are on the roadmap — listed here so you can see where this is going, marked so you don’t plan a launch around one.
API
LiveIn-house
Generate images at scale with full control. REST, bearer auth, or the official TypeScript SDK.
Explore automation docsMCP
LiveIn-house
Point Claude, Cursor or your own agent at Pixy. Eight tools over one endpoint, authenticated by the same API key.
Explore automation docsZapier
Coming soonExternal
Automate image generation across your tools with no code in between.
Airtable
Coming soonExternal
Manage the copy and the assets in a base, and generate straight from your rows.
n8n
Coming soonExternal
Build self-hosted workflows that generate and process images at volume.
Make.com
Coming soonExternal
Design visual scenarios for bulk creative production.
Pricing
Pay for renders, not seats.
API access is on every paid plan. What changes is the monthly credit allowance — one credit per image page, one per PDF — and what you pay past it.
Starter
For solo creators getting started with regular usage.
$49/ month
Get startedWhat’s included
- Members
- 1
- Credits
- 1,000 / month
- Overages
- $0.03 / credit
- API
- Embed
Growth
PopularFor growing teams with active API and embed usage.
$149/ month
Get startedWhat’s included
- Members
- 3
- Credits
- 10,000 / month
- Overages
- $0.02 / credit
- API
- Embed
Scale
For high-volume teams that need the embeddable Pixy image editor.
$299/ month
Book a demoWhat’s included
- Members
- 10
- Credits
- 50,000 / month
- Overages
- $0.01 / credit
- API
- Embed
Image exports cost 1 credit per page · PDF costs 1 credit
FAQ
The questions we get most.
Do I have to rebuild my design in code?
No. That is the point. You build the design in the Pixy editor, name the elements you plan to change, and the API changes those named elements inside it. Nothing about your layout is reimplemented as HTML, so nothing about it can render differently on a different machine.
What can I change in a request?
Four fields: text on text elements, src on image elements, and fill and stroke on text, shapes and SVG. One request can carry as many modification objects as the design has elements.
Which plans include API access?
Starter, Growth and Scale all include it. What changes between them is credits, seats and whether the embeddable editor comes with it.
How is usage billed?
One credit per image page and one credit per PDF, drawn from your plan’s monthly allowance. Past the allowance you pay your plan’s overage rate rather than being cut off mid-campaign.
Can an AI agent use this?
Yes. Pixy runs an MCP server at app.pixy.art/api/mcp, so Claude, Cursor or your own agent can search templates, read a design’s elements, pull your brand colours and render files. It takes the same API key — one script of configuration, no second credential and no OAuth flow. Every tool is the REST endpoint of the same name, so an agent is held to the same validation and the same credit accounting your backend is.
Is there an SDK, or is it just REST?
Both. It is a plain REST endpoint with bearer auth, and there is an official TypeScript SDK — npm install @pixy-art/sdk — if you would rather not write the fetch yourself.
Start here
Send your first modification today.
Issue a key, copy a design id out of the editor, and POST one array. Free plan, 20 credits, no card — enough to prove the integration before you budget for it.
1 endpoint · 4 fields · PNG · JPEG · PDF · EU-hosted