Build a Canva alternative

Build a Canva alternative as locked templates, text slots, and a PNG export. The renderer, stock library, and live cursors are the other product.

  • teardown
  • vibe-coding
  • scope

You can build a Canva alternative as locked templates, text slots, and a PNG export. The catalog calls Canva a tiny brand-safe editor for the graphics you make every week.

You pay $15–$30 a person a month. The card says that price scales with the team. The verdict is “Build the templates you repeat”.

Last time I wrote about building a HubSpot alternative. That was a regular backlog post. This one is a teardown.

Build a Canva alternative as locked templates

The Canva page splits the work into three rows.

The first row is 3 days. Fixed templates, text editing, PNG export. That is a page size, a few slots, and toDataURL. You can vibe-code this.

The second row is 2 weeks and up. Brand kit, drag layout, image crop, undo. Still one person, still your files.

The third row is 3 months and up. Full design engine, stock library, collaboration, video. Skip that row.

If you tell an agent to “clone Canva”, it aims at the third row. The useful v1 is the first one.

Here is the shape of the data. Nothing else has to exist at 3 days.

const template = {
  id: 'tpl-launch-square',
  name: 'Launch announcement',
  width: 1080,
  height: 1080,
}

const design = {
  id: 'des-bootcamp-oct',
  templateId: 'tpl-launch-square',
  slots: [
    { id: 'headline', type: 'text', content: 'Bootcamp.dev is live' },
    { id: 'photo', type: 'image', objectKey: 'uploads/bootcamp-hero.jpg' },
  ],
}

A template, a page size, two slots. Brand colors wait until you have exported three graphics with the same red. Drag and crop wait until a photo sits in the wrong place. Undo waits until you have typed over a good headline.

The audience line on the page is a small business producing recurring social and announcement graphics. If that is you, five locked templates are enough.

The same v1 also replaces Adobe Express and Kittl if what you wanted was this week’s square with your logo and type. Shots.so is the screenshot cousin at $10–$20 a month. Gamma is the slide cousin at $10–$20. When the job is a freeform wireframe, that is Figma. I already wrote the Figma teardown.

How does Canva work

Canva publishes the design model, the export job, and a few engineering posts about media, fonts, drawing, and live cursors. I am summarizing those pages, not reconstructing today’s cluster.

The Apps SDK says a design is pages plus ingredients. Most pages sit between 40 × 40 and 8,000 × 8,000 pixels. Docs have no fixed height. Whiteboards have no fixed width. Design types in the pages API include doc, email, presentation, sheet, whiteboard, and custom.

The Design Editing API treats elements as the building blocks. Every element shares top, left, width, height, rotation, transparency, and locked. Types include text, images, shapes, groups, tables, videos, and embeds. Content sits inside an element. A page background can hold an image without being an image element.

A 3-day v1 copies the public shape, not the endpoints. One page. Fixed width and height. Text and image slots. Locked positions.

Their brand template autofill API is the same idea at scale. You send named fields. Canva fills CITY or BACKGROUND on a template and starts a job. A v1 does that in one form. No job queue.

Export is also a job. The Connect export API starts an async export. Formats include PNG, JPEG, GIF, PDF, PPTX, and MP4. Download URLs last 24 hours. Rate limits sit on the integration, the document, and the user.

A v1 can skip the job. Draw the page in the browser and call toDataURL('image/png').

function exportPng(canvas) {
  const link = document.createElement('a')
  link.href = canvas.toDataURL('image/png')
  link.download = 'launch-announcement.png'
  link.click()
}

Shots.so already ships this path. Compose, then a PNG at the exact pixel size.

PICK A TEMPLATE Fixed 1080 × 1080 page FILL THE SLOTS Headline text, one photo RENDER THE PAGE Canvas API, locked positions EXPORT A PNG toDataURL, exact pixels DOWNLOAD THE FILE No async export job No public listing
The public v1 path: pick a locked template, fill the slots, render in the browser, then download a PNG.

How Canva media and fonts work

The skip row starts at the library.

A 2022 media post is the public history. Canva launched in 2013 with stock photos and user uploads. By that post they said more than 100 million monthly active users, more than 100 million stock photos and graphics, and 50 million new uploads a day. The media service stores an id, an owner, a library flag, status, metadata, and a file pointer. Most media are written once and read often.

They started on MySQL. Schema changes on the largest tables took days, then weeks. They migrated live to DynamoDB. After the cut they said the service held more than 25 billion user-uploaded media. Treat “the 2026 store is still DynamoDB at that count” as an educated guess. The product rule is public: a media object is metadata plus a file, and the library is a second product on top of your uploads.

Search is another service. Their search pipeline post says the search server grew four systems: audio, fonts, media, and templates. That is the stock library you type into.

Fonts are hostile. A 2024 security post is blunt. Canva processes millions of graphics files a day. Fonts carry SVG tables, archives, and subsetting bugs. Their advice is to sandbox font processing and run something like OpenType-Sanitizer. The catalog guardrail is the same rule. Licensed user uploads. Trusted fonts. Isolate rendering inputs. Keep private assets behind authorized URLs.

A v1 ships two or three licensed fonts as static files. One image upload to private storage. No stock search.

How Canva drawing and collaboration work

The draw tool is a later feature, not the 3-day editor.

Their 2024 draw post splits the tool into pointer events, a state machine, then Preview and Commit. Preview shows the stroke. Commit writes it into the design. They used perfect-freehand for SVG paths, then spent the rest of the post shrinking those paths: two decimal places, relative commands, Ramer-Douglas-Peucker, a boolean union for filled scribbles. Mobile Canva is Cordova. They added a native overlay so points still land when JavaScript is busy.

That is why freehand drawing sits on the skip row. A locked text slot does not need a stroke kernel.

Live editing is the other product.

A 2021 RSocket post says the editor needs the server to push. Alice adds an exclamation mark. Bob should see it before he types the same letter. They picked WebSockets, then put RSocket on top so one browser connection can multiplex editing, presentations, and later APIs. Backpressure is the point they stress. If the editing backend stops requesting messages, clients stop sending them, and the presentation stream keeps flowing.

Cursors are a second path. The 2024 mouse-pointer post started on the same WebSocket plus Redis setup used for design edits. The goal was 3 updates a second, for up to 50 people on one design. That first version, they say, carried hundreds of thousands of simultaneous clients and about 100,000 pointer updates a second. They later moved pointers onto a WebRTC mesh so clients can skip the server. About half the connections still go through TURN. The WebSocket path stayed as signaling and as a fallback.

A v1 has no cursors. One tab. One person. Save the JSON.

Figma is the same fork. Single-player drawing is a few days. The multiplayer file is the product. Canva’s fork is templates versus the library and the live room.

3-DAY V1 Locked templates you repeat Text and image slots A PNG at the template size SKIP THIS HALF Stock library and search Font sandboxing at upload Live edits and WebRTC cursors
Ship the templates, the slots, and the PNG. Leave the library, the font pipeline, and live cursors on the skip row.

A Canva alternative for one brand

I would rebuild Canva for the five graphics I already remake every week. Launch square, talk graphic, changelog card, a 1080 × 1920 story, a 1200 × 630 Open Graph image. Locked slots. Our hex. Two fonts we already license. PNG download.

Brand kit comes after the third export looks off-brand. Drag and crop come when a photo never sits in the slot. I would not search a stock library. I would not open a second cursor.

Host it next to the product, on Node.js and Astro, with R2 for the photo and D1 for the row, because that is the stack on the card. Use TanStack Start if React is your weekday language. Draw with the Canvas API. Keep uploads on signed URLs.

If the rent is “frame this screenshot”, that is Shots.so, 2 hours. If the rent is “markdown in, slides out”, that is Gamma, 8 hours. If the rent is five pixel edits, that is Photoshop.

Start with the first row

Go to Build your own Canva. Copy the Astro prompt, or TanStack Start if that is what you write.

Tell the agent the first estimate only: fixed templates, text editing, PNG export. Three days.

If the company already lives in the stock library and a shared whiteboard, keep paying.

Keep reading

Read all articles →