The Internet's Fastest Meme Maker — Pick a template, add your text, download. Zero BS, pure meme energy.
| Feature | Description |
|---|---|
| 🖼️ 1000+ Templates | Huge library of trending meme templates |
| 🔍 Instant Search | Find any template in seconds |
| ✏️ Drag & Drop Editor | Position text boxes anywhere on the image |
| 📤 Custom Uploads | Use your own image as a template |
| 💾 Instant Download | Download your meme as PNG with one click |
| 📋 Copy to Clipboard | Paste directly into chats |
| 🎨 Rich Text Styling | Fonts, colors, outlines, shadows, letter spacing |
| 🖊️ Draw Mode | Annotate or doodle directly on your meme |
| 📱 Mobile Friendly | Works seamlessly on any device |
| 🆓 Completely Free | No sign-up, no watermarks, no limits |
- Framework — Next.js 15 (App Router)
- Language — TypeScript 5
- Styling — Tailwind CSS v4
- Animations — Framer Motion
- UI Components — shadcn/ui
- Icons — Lucide React
- Fonts — Bricolage Grotesque + Epilogue
- Analytics — Vercel Analytics
- Node.js 18.17 or later
- npm / yarn / pnpm / bun
# 1. Clone the repo
git clone https://github.com/puri-adityakumar/meme-generator.git
cd meme-generator
# 2. Install dependencies
npm install
# 3. Start the dev server
npm run devOpen http://localhost:3000 in your browser. 🎉
- Browse Templates — Scroll through 1000+ templates or search by name
- Upload Your Own — Click "Upload Your Own" to use a custom image
- Edit Text — Click a text box and type your caption
- Style It — Change font, color, outline, shadow, and letter spacing
- Reposition — Drag text boxes to place them exactly where you want
- Draw — Use Draw Mode to annotate or doodle on the meme
- Download — Hit the Download button to save your PNG
src/
├── app/ # Next.js App Router pages & layout
│ ├── layout.tsx # Root layout with Navbar + Footer
│ ├── page.tsx # Home page
│ └── globals.css # Global styles + design system
├── components/
│ ├── Navbar.tsx # Top navigation bar
│ ├── Footer.tsx # Footer with copyright
│ ├── HeroSection.tsx # Landing hero with mascot
│ ├── TemplateSearch.tsx # Search bar component
│ ├── TemplateSelector.tsx# Template grid with pagination
│ ├── MemeEditor.tsx # Core canvas editor
│ ├── CustomTemplateUpload.tsx # Custom image uploader
│ └── ui/ # shadcn/ui base components
├── context/ # React Context (SelectedContext)
├── data/ # Templates data & site config
├── hooks/ # Custom hooks (useSelected)
├── lib/ # Constants & utilities
└── types/ # TypeScript type definitions
npm run dev # Start development server
npm run build # Build for production
npm run start # Start production server
npm run lint # Run ESLint- Fork the repository
- Create your feature branch —
git checkout -b feature/my-feature - Commit your changes —
git commit -m 'feat: add my feature' - Push to the branch —
git push origin feature/my-feature - Open a Pull Request
This project is open source and available under the MIT License.
⚡ Powered by Zenviq Digital
© 2026 Zenviq Meme. All rights reserved.