Thanks for your interest in contributing! Branda is an open-source project by the Context.dev team, and we welcome contributions of all sizes — bug fixes, new ad formats, better prompts, docs, anything.
By participating, you agree to follow our Code of Conduct.
-
Fork and clone the repo:
git clone https://github.com/<your-username>/ad-maker.git cd ad-maker npm install
-
Configure your environment:
cp .env.example .env
You'll need:
- A free Context.dev API key (
CONTEXT_DEV_API_KEY) - A Vercel AI Gateway key (
AI_GATEWAY_API_KEY)
- A free Context.dev API key (
-
Run the dev server:
npm run dev
Open http://localhost:3000, paste a public domain, and make sure generation works end to end before you start changing things.
-
Create a branch from
main:git checkout -b feat/my-feature(orfix/...,docs/...) -
Keep PRs focused on a single change — small PRs get reviewed and merged fastest
-
Match the existing code style: TypeScript, App Router conventions, Tailwind for styling
-
Before pushing, run the complete verification gate:
npm run verify
Use the domain names and relationships defined in CONTEXT.md when changing an interface or moving behavior between modules.
| Area | Path |
|---|---|
| Shared Ad Run contract | src/lib/ad-run.ts |
| Brief planning | src/lib/generate/planner.ts, src/lib/generate/brief.ts |
| Rendered Ad generation | src/lib/generate/renderer.ts |
| Creative Direction catalog + prompts | src/lib/generate/directions.ts, src/lib/generate/concepts.ts |
| Image Model catalog | src/lib/generate/models.ts |
| Public raster-logo policy | src/lib/public-raster.ts |
| Context.dev integration | src/lib/context.ts |
| UI | src/components/ad-maker.tsx, src/hooks/use-ad-maker.ts |
- Add its key, label, and
bestFormetadata toCREATIVE_DIRECTIONSinsrc/lib/generate/directions.ts - Add the matching prompt implementation in
src/lib/generate/concepts.ts; the exhaustive registry reports a type error if one is missing - Reuse the shared
typography(...)andHARD_RULESblocks so text stays clean - Never put hex codes in a prompt — use the
colorA/colorBphrases (image models literally print hex strings onto the art)
Edit IMAGE_MODELS in src/lib/generate/models.ts. Each Image Model record declares its primary/secondary tier and whether it accepts a raster logo; the shared contract verifies six distinct assignments and primary-first placement.
- Describe what changed and why
- Include screenshots or generated ads for anything visual — they make review much faster
- Link any related issues
Open an issue with:
- What you did (the domain you pasted, if relevant)
- What you expected vs. what happened
- Any errors from the browser console or dev server output
Never include your API keys in issues, logs, or screenshots.
Please report suspected vulnerabilities privately using the process in SECURITY.md, not in a public issue.
By contributing, you agree that your contributions will be licensed under the MIT License.