Manu Design

Open-source AI design workflow engine for teams

Generate beautiful, editable, on-brand images, videos, and marketing assets. Brand-aware. Text-overlay-native. Export-ready.

Star this repo ⭐ — it helps more designers and founders find it.

Most AI image tools can keep up until you need text on the image, the same look across a 10-slide deck, or a hero shot that matches last week's hero shot. Manu Design is the workflow engine for that.

Three things in one app:

	What it does	Where you live
🪄 Studio	Prompt → style preset → aspect → Generate. fal.ai, Replicate, or Lovable Gemini, your call.	`/studio`
✍️ Compose Editor	Live SVG/PNG text overlay on any image. Eyebrow, headline, accent, sub, CTA — re-renders in 300 ms. Zero AI re-spend.	`/compose-editor`
🎨 Canvas	Multi-layer, Canva-style compositor. Drag, resize, rotate, stack. Export PNG.	`/canvas`

git clone https://github.com/manujajay/manudesign.git
cd manudesign
echo "FAL_KEY=$YOUR_FAL_KEY" > .env
bun install && bun dev          # → http://localhost:5173/studio

The workflow, end to end

This is the loop, top to bottom. Every step on its own works fine — the power is in chaining them.

   ┌──────────────┐     ┌──────────────────┐     ┌──────────────────┐     ┌────────────────┐
   │   STUDIO     │ ──▶ │  COMPOSE EDITOR  │ ──▶ │     CANVAS       │ ──▶ │   DOWNLOAD     │
   │              │     │                  │     │                  │     │                │
   │  prompt →    │     │  swap headline,  │     │  multi-layer,    │     │  PNG / MP4     │
   │  style →     │     │  eyebrow, CTA,   │     │  drag, resize,   │     │  saved locally │
   │  generate    │     │  brand mark      │     │  rotate, stack   │     │  (auto)        │
   └──────────────┘     └──────────────────┘     └──────────────────┘     └────────────────┘
       (AI spend)        (no AI spend)            (no AI spend)

1 · Generate brand-compliant images and video — Studio

Pick a marketing style preset (Apple Minimal, Editorial Chromatic, Nike Bold, …), type a prompt, hit Generate. Behind the scenes the preset locks in lighting, lens, mood, and picks the recommended composer template so the text overlay sits where it should.

Image · 14 style presets · 5+ models · fal.ai · Replicate · Lovable Gemini
Video · Kling 2.5 Turbo Pro · Seedance · Veo 3 · Hailuo 02
Best-of-N: 1–4 variants in parallel, auto-pick the cleanest layout
Auto-download every result to your computer (toggle in the Studio) — generated URLs at fal/replicate expire eventually; this keeps them yours forever

2 · Edit text overlays, Canva-style — Compose Editor

Paste any image URL (or click "Edit text" on a Studio result). Choose a composer template, edit the copy fields:

Field	What it controls
`brandLead` + `brandLabel`	Top-left brand mark (e.g. `your/` `BRAND`)
`eyebrow`	Small uppercase tag line above the headline
`headline`	Main multi-line statement
`accent`	Substring of the headline rendered in italic serif
`sub`	Smaller paragraph under the headline
`ctaLabel`	Pill-style call-to-action button
`footerUrl`	Bottom-right URL stamp

Every keystroke triggers a ~300 ms SVG re-render. No AI spend. Switch between light and dark templates with one click. Built-in WCAG-AA contrast check flags unreadable text-over-image and suggests a theme flip.

Composer templates that ship with the engine

hero_light · problem_dark · cta_light · story_light · story_dark · stat_card · quote_card · linkedin_wide · modules_grid · trusted_by

Same prompt-style, different composer:

_{hero_light} _{problem_dark} _{stat_card} _{cta_light} _{story_light}

3 · Compose multi-asset layouts — Canvas

Open the same generated image (or any uploaded file) in Canvas for Canva-style multi-layer editing: text layers with full font / weight / colour / stroke / shadow / opacity / rotation control, drag-snap alignment, undo/redo, layer reorder, export as PNG per layer or as a combined flatten.

4 · Persist your work — locally, not in a black box

History lives in your browser's localStorage (zero backend), but two things make it durable:

Auto-download toggle in the Studio — every successful generation is saved straight to your Downloads folder with a sensible filename (manudesign-warm-analog-film-2026-05-19T10-00-00.png).
Export / Import JSON buttons on the History panel — dump the whole index as a portable JSON file you can sync between machines, archive, or version-control.

A taste of what you can make

Editorial Chromatic — one prompt-style, a full archive batch

_{01 · Hero}	_{02 · Problem}	_{03 · Stat}
_{04 · Modules}	_{05 · CTA}	_{07 · Quote}
_{08 · Story hero}	_{09 · Story body}	_{10 · LinkedIn}

Eleven curated style presets

_{Editorial Chromatic Magazine cinema}	_{Warm Analog Film Portra 400 · amber sun}	_{Aesop × Jacquemus Plaster · daily ritual}
_{Apple Minimal Quiet product}	_{Nike Bold Heroic · hard rim}	_{Bartlett Editorial Tungsten chiaroscuro}
_{MrBeast Thumbnail Max contrast}	_{Hormozi Yellow Stark · conversion-coded}	_{Linear / Vercel SaaS Dark · gradients}

Plus Liquid Death, TikTok Native, Gary Vee Hustle, Jordi Colin Samir, Mobile Editing Club. Add your own in src/lib/marketing-styles.ts.

Quick start

git clone https://github.com/manujajay/manudesign.git
cd manudesign

bun install                       # or: npm install / pnpm install
cp .env.example .env              # then paste your FAL_KEY
bun dev                           # → http://localhost:5173

Open http://localhost:5173/studio. Type a prompt, pick a style, hit Generate.

Requirements

Bun ≥ 1.1 (or Node ≥ 20)
A fal.ai API key (free credits to start)

Optional — for power features

Env var	What it unlocks
`REPLICATE_API_TOKEN`	Replicate provider (Flux 1.1 Pro / Ultra / Schnell, Ideogram v2). Get one.
`LOVABLE_API_KEY`	"✦ AI variants" prompt rewriting + Lovable Gemini image editing.

How it compares

	Manu Design	Canva Magic	Midjourney	Lovable / v0 image
Self-hostable & MIT	✅	❌	❌	❌
Crisp text (SVG, not in-image)	✅	partial	❌	partial
Brand-aware style presets	✅	partial	❌	❌
Multi-provider (fal, Replicate, Lovable, …)	✅	n/a	n/a	n/a
Bring-your-own model keys	✅	❌	❌	❌
Local-first history	✅	❌	❌	❌
Multi-layer canvas editor	✅	✅	❌	❌
Video generation	✅ (Kling/Seedance/Veo)	❌	❌	❌
Free and private	✅	❌	❌	❌

We aren't trying to replace Figma. We're trying to replace the "prompt → Photoshop the headline back in" loop.

Stack

Layer	Choice
Framework	TanStack Start (Vite + React)
Runtime	Bun (dev) · Cloudflare Workers (prod)
Generation	fal.ai · Replicate · Lovable Gemini
Persistence	Browser `localStorage` · auto-download to disk · JSON export
Styling	Tailwind v4 · shadcn/ui · Radix primitives
Language	TypeScript everywhere

Providers supported out of the box

Provider	Models
fal.ai	Seedream v4 · Flux Pro 1.1 Ultra · Flux Dev · Recraft v3 · Ideogram v2 · Kling 2.5 Turbo Pro · Seedance v1 Pro · Veo 3 Fast · Hailuo 02
Replicate	Flux 1.1 Pro · Flux 1.1 Pro Ultra · Flux Schnell · Ideogram v2
Lovable Gemini	Nano Banana 2 · Gemini 3 Pro · Gemini 2.5 Flash

Adding OpenAI Images, Together, or local ComfyUI is ~30 lines in src/lib/generate.core.ts. PRs welcome.

Project layout

src/
├── routes/
│   ├── index.tsx                # Landing page
│   ├── _authenticated/
│   │   ├── studio.tsx           # Generate images and video
│   │   ├── compose-editor.tsx   # Edit text overlay on existing image
│   │   └── canvas.tsx           # Multi-layer Canva-style compositor
├── lib/
│   ├── marketing-styles.ts      # 14 curated style presets — add your own
│   ├── composers.ts             # SVG overlay templates
│   ├── generate.core.ts         # Provider-agnostic generation pipeline
│   ├── generation-history.ts    # localStorage + auto-download + export/import
│   └── contrast-check.ts        # WCAG-AA contrast analyzer
└── server.ts                    # Cloudflare Worker entry

The /_authenticated directory is a leftover from a prior auth-gated build — it's now a pass-through. Routes there are just "the main app surface."

Customising

Add a style preset

Open src/lib/marketing-styles.ts. Each preset is a single object — paste a new one with your own prompt clause and recommended composer template, drop a showcase image into src/assets/showcase/, and it appears in the Studio picker immediately.

Add an overlay template

src/lib/composers.ts defines every SVG template. Add a new one and register it in COMPOSE_TEMPLATES to use from the Compose Editor.

Add a model provider

src/lib/generate.core.ts ships with adapters for fal.ai, Replicate, and Lovable Gemini. Adding Together, OpenAI Images, or local ComfyUI is ~30 lines: implement a new generator function, add a case to runProvider, register it in MODELS_BY_PROVIDER in src/routes/_authenticated/studio.tsx.

Deploying

Production target is Cloudflare Workers via Wrangler:

bun run build
bunx wrangler deploy
bunx wrangler secret put FAL_KEY
bunx wrangler secret put REPLICATE_API_TOKEN    # optional
bunx wrangler secret put LOVABLE_API_KEY        # optional

Or one-click:

Self-host on Netlify, Fly, or any Node-compatible host — every key is read at runtime, no secrets baked into the build.

Open core — what's in here, what's not

This repo is the engine. It's MIT, batteries included, and runs standalone. Fork it, ship internal tooling, build a vertical product on top, roll your own SaaS — the license allows it.

We run a commercial layer on top at manudesign.theaiinternship.com for teams that want it managed:

	Open-source core (this repo)	Managed / hosted
Single-user studio	✅	✅
All 14 style presets + composer templates	✅	✅
Bring-your-own provider keys	✅	✅ (managed billing optional)
Local history + JSON export	✅	✅ + synced across devices
Team workspaces & shared brand kits		✅
Premium brand-tuned style presets		✅
Enterprise SSO + audit log		✅
Premium workflows (carousels-from-archive, brand-compliance, ad-pack generation)		✅
Asset library with team-wide search		✅
White-glove brand-kit setup		✅

Want the hosted version, a brand-tuned preset pack, or a custom team workflow? hello@theaiinternship.com

Roadmap

The core gets more useful when more contributors bring providers, templates, and presets. Up next:

Replicate provider — shipped in 0.1.0
OpenAI Images provider
Local ComfyUI provider (zero API keys)
Brand-kit JSON spec → consumed by every composer
Workflow YAML — declarative multi-step generation
CLI: manudesign generate --style editorial-chromatic --prompt "…"

PRs welcome on any of these.

Security

Never commit .env — already gitignored.
FAL_KEY / REPLICATE_API_TOKEN / LOVABLE_API_KEY are server-side only; they never reach the browser. All provider calls go through TanStack server functions.
If you accidentally push a key, rotate it in the provider dashboard first, then rewrite history with git filter-repo.

Found a vulnerability? See SECURITY.md.

Contributing

PRs welcome — see CONTRIBUTING.md and CODE_OF_CONDUCT.md. Easy wins:

✨ New marketing style presets — drop a preset + showcase image
🎨 New compose templates — typography overlays
🔌 New providers — OpenAI Images, Together, ComfyUI, custom backends
🧠 Workflow recipes — multi-step pipelines as code
🐛 Bug fixes with a clear repro

Star history

If this is useful, ⭐ on GitHub — each star helps another designer / founder find this tool.

License

MIT. Use it, fork it, ship it.

Made by @manujajay for The AI Internship. If you build something with this, tell me — I'd love to see.

Name		Name	Last commit message	Last commit date
Latest commit History 506 Commits
.github		.github
public		public
src		src
.env.example		.env.example
.gitignore		.gitignore
.prettierignore		.prettierignore
.prettierrc		.prettierrc
CHANGELOG.md		CHANGELOG.md
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE		LICENSE
README.md		README.md
SECURITY.md		SECURITY.md
bun.lock		bun.lock
bunfig.toml		bunfig.toml
components.json		components.json
eslint.config.js		eslint.config.js
instrument-serif-italic.woff2		instrument-serif-italic.woff2
package-lock.json		package-lock.json
package.json		package.json
tsconfig.json		tsconfig.json
vite.config.ts		vite.config.ts
wrangler.jsonc		wrangler.jsonc

Folders and files

Latest commit

History

Repository files navigation

Manu Design

Open-source AI design workflow engine for teams

The workflow, end to end

1 · Generate brand-compliant images and video — Studio

2 · Edit text overlays, Canva-style — Compose Editor

Composer templates that ship with the engine

3 · Compose multi-asset layouts — Canvas

4 · Persist your work — locally, not in a black box

A taste of what you can make

Editorial Chromatic — one prompt-style, a full archive batch

Eleven curated style presets

Quick start

Requirements

Optional — for power features

How it compares

Stack

Providers supported out of the box

Project layout

Customising

Add a style preset

Add an overlay template

Add a model provider

Deploying

Open core — what's in here, what's not

Roadmap

Security

Contributing

Star history

License

About

Topics

Resources

License

Code of conduct

Contributing

Security policy

Uh oh!

Stars

Watchers

Forks

Releases 1

Packages 0

Uh oh!

Contributors

Uh oh!

Languages

Packages