Memegenscript
A free meme generator that runs entirely on Cloudflare Workers:
an in-browser editor for 450+ templates, plus a URL-based API where every meme is just a link.
- Editor pages: one page per template with draggable, individually styled text boxes,
your own image layers, custom backgrounds, undo/redo, and PNG/JPG export. No signup, no
server round-trips while you edit.
- Meme API:
GET /images/{template}/{top}/{bottom}.png renders a meme on the fly, with
fonts, colors, styles, overlays, custom backgrounds, and animated GIF/WebP output.
Interactive docs live at /docs.
- Built for search: every template page is server-rendered with a description of the
meme, alternate names, tags, structured data, social cards, and a sitemap.
- Serverless: TypeScript Worker, WASM image codecs, static assets at the edge. No
origin server, no image storage, nothing to babysit.
GET /images/buzz/memes/memes_everywhere.png
GET /images/ds/small_file/high_quality.jpg?style=maga&width=800
GET /images/oprah/you_get/animated_text.gif
POST /images {"template_id": "fry", "text": ["not sure if", "or just"]}
Meme editor pages
Every template has a human-facing, SEO-friendly editor page rendered by src/views/editor.ts:
| Route | Purpose |
|---|
/ | Index of all templates with search (/?q= also works server-side) |
/memes/{slug} | Canvas editor for one template (name-based; old ids and slugs redirect) |
/agents, /llms.txt | Guide for AI agents, as a page and as raw markdown (src/docs/agents.ts) |
/privacy | What the site collects (src/views/privacy.ts); update it when that changes |
/sitemap.xml | Lists the index and every editor page |
/robots.txt | Allows crawling of the pages, disallows the JSON API paths, links the sitemap |
/static/* | Stylesheet and scripts (assets/static/, cache-busted with ?v=<version>) |
/assets/templates/{id}/{f} | Raw template images used by the editor canvas |
/assets/fonts/{file} | Font files loaded by the editor with the FontFace API |
/proxy/image?url= | Fetches a remote image (10 MB max, images only) so the canvas can use it |
The editor (assets/static/editor.js) runs entirely in the browser, imgflip-style:
- Text boxes start where the template defines them; drag to move, corner handles to
resize, top handle to rotate (Shift snaps to 15°), arrow keys to nudge.
- Every text box has its own font, size (automatic fit or manual), color, outline color
and width, alignment, vertical alignment, case, opacity and rotation.
- Add as many text boxes as you like, add your own images as layers (upload or URL, with
flip and opacity), reorder and duplicate layers, and replace the background with an
uploaded image or a blank canvas of any size. Alternate template styles are selectable.
- Undo/redo (Ctrl+Z / Ctrl+Y), delete key, double-click a box to edit its text.
- Export as PNG or JPG at full resolution, copy the image to the clipboard, or copy an
editor link that restores the text layers (the state lives in the URL hash).
Each page is server-rendered with a unique title, meta description, canonical URL, Open
Graph and Twitter Card tags (the example meme is the social image), JSON-LD (WebSite
with SearchAction, WebPage, ImageObject, BreadcrumbList), an <h1>, descriptive
copy, the template's source link, keyword links, and related templates. Without JavaScript
a <noscript> form posts to POST /images instead.
The site name in titles and social cards comes from the SITE_NAME variable.
Progressive web app
The site is installable: /manifest.webmanifest (icons generated by
npx tsx scripts/build-icons.ts into assets/static/icons/), a service worker at /sw.js
(assets/static/sw.js, its cache name bound to the asset content hash so every deploy
refreshes caches), and an /offline fallback page. The worker serves pages network-first
with an offline fallback, and caches static assets, fonts, template images, and the last
80 rendered memes cache-first. On phones, assets/static/pwa.js shows a closeable
"Install" banner: Chrome/Android use the native prompt, iOS gets "Share → Add to Home
Screen" instructions; dismissal is remembered for 14 days and the banner never shows once
the app is installed.
Meme descriptions and search
Every template page explains what the meme is, where it comes from, its alternate names,
and related tags, so people can find a template by describing it rather than knowing its
name. The search on / (and ?q=) matches names, aliases, keywords, tags, example text,
and the description; multi-word queries require every word to match.
data/descriptions.json is fetched from each template's Know Your Meme entry by
npm run fetch:descriptions (short About/Origin excerpts, tags, alternate names). It
only refetches missing or failed entries; pass --force to refresh everything.data/descriptions.manual.json holds hand-written entries for templates without a Know
Your Meme source; these override fetched data. Add an entry here for any new template.scripts/build-templates.ts merges both into the manifest and warns about templates
that still lack a description.
Know Your Meme excerpts are short, attributed, and linked; write original copy in the
manual file when you want fully unique page text.
Getting started
Requirements: Node 20+, a Cloudflare account for deployment.
This is the beginning of the README. Read the rest at the original. Read the full README ↗
