AI-Powered Social Media Caption Generator
Transform your photos into engaging social media captions with the power of artificial intelligence. Create, customize, and share amazing content effortlessly.
🚀 Live Demo • 📖 Documentation • 🐛 Report Bug • ✨ Request Feature • ☕ Support
CapMeToo is a free, open-source Progressive Web App that uses Google's Gemini AI to generate engaging social media captions from your photos. With support for 9 different caption styles and 8 languages, it's the perfect tool for content creators, social media managers, and anyone who wants to enhance their online presence.
- 🆓 Completely Free - No subscriptions, no hidden costs
- 🔒 Privacy First - Your photos and API keys stay on your device
- 🌍 Multi-Language - Generate captions in 8 different languages
- 📱 Works Everywhere - PWA that works on any device
- ⚡ Lightning Fast - Optimized for speed and performance
- 🎨 Beautiful Design - Modern, clean interface with dark/light themes
- Glass Morphism UI - Beautiful backdrop blur effects and transparency
- Dark/Light Theme - Automatic system theme detection with manual toggle
- Responsive Design - Perfect experience on mobile, tablet, and desktop
- Smooth Animations - Polished interactions and micro-animations
- Sidebar Navigation - Modern slide-out menu following UX best practices
- 9 Caption Styles - Funny, General, Travel, Food, Fitness, Lifestyle, Business, Nature, Fashion
- 8 Languages - Native generation in English, Bulgarian, German, Spanish, French, Portuguese, Chinese, Hindi
- Smart Context - AI analyzes your photos for relevant content
- Instant Generation - Fast caption creation with loading animations
- Easy Copying - One-click copy to clipboard functionality
- Installable - Add to home screen on any device
- Offline Ready - Works without internet connection with fallback captions
- Fast Loading - Optimized performance with service worker caching
- Native Feel - App-like experience with smooth navigation
- Local Storage - API keys stored securely on your device
- No Data Collection - Your photos and captions stay private
- Secure Processing - All AI processing through encrypted connections
- Smart Key Management - Only requests API key when needed
- Visit CapMeToo
- Get API Key - Free Google AI API key
- Upload & Generate - Upload a photo and start creating captions!
```bash
git clone https://github.com/SimeonTsvetanov/Cap-Me-Too.git cd Cap-Me-Too
npm install
npm run dev
```
- Visit Google AI Studio
- Create a free account and generate an API key
- Copy the key for the next step
- Open CapMeToo in your browser
- Paste your API key in the setup screen
- Your key is stored locally and never shared
- Upload any photo by clicking or dragging
- Choose your preferred caption style and language
- Click "Generate Caption" and wait for AI magic
- Copy and paste to your social media!
| Style | Description | Perfect For |
|---|---|---|
| 😂 Funny | Humorous and entertaining captions | Memes, casual posts, comedy content |
| ✨ General | Versatile captions for any occasion | Daily posts, general sharing |
| Adventure and wanderlust focused | Vacation photos, travel blogs | |
| 🍕 Food | Delicious and appetizing descriptions | Restaurant visits, cooking |
| 💪 Fitness | Motivational and health-focused | Gym photos, workout progress |
| 🌟 Lifestyle | Aspirational and relatable content | Daily life, personal branding |
| 💼 Business | Professional and growth-minded | LinkedIn, business updates |
| 🌿 Nature | Environmental and peaceful vibes | Outdoor photos, nature shots |
| 👗 Fashion | Style and trend-focused captions | Outfit posts, fashion content |
- 🇺🇸 English - Native AI generation
- 🇧🇬 Bulgarian - Native AI generation
- 🇩🇪 German - Native AI generation
- 🇪🇸 Spanish - Native AI generation
- 🇫🇷 French - Native AI generation
- 🇵🇹 Portuguese - Native AI generation
- 🇨🇳 Chinese - Native AI generation
- 🇮🇳 Hindi - Native AI generation
- Framework: Next.js 14 with App Router
- Language: TypeScript for type safety
- Styling: Tailwind CSS with custom design system
- UI Components: Radix UI primitives with custom styling
- AI Integration: Google Gemini 2.0 Flash API
- PWA: Complete Progressive Web App implementation
- Storage: Local storage with smart key management
- Deployment: GitHub Pages with automated CI/CD
CapMeToo is designed mobile-first with special attention to touch interfaces:
- Touch-Friendly: Large buttons and intuitive gestures
- Sidebar Menu: Modern slide-out navigation
- Responsive Images: Automatic image optimization for mobile
- Offline Support: Generate captions even without internet
- Add to Home Screen: Install like a native app
This project uses a single-command deployment to GitHub Pages:
pnpm run gh-deployThis command:
- Builds the Next.js application as static files
- Creates
.nojekyllfile for GitHub Pages compatibility - Commits build output to git
- Deploys to
gh-pagesbranch usinggit subtree
Setup GitHub Pages:
- Go to repository Settings → Pages
- Source: "Deploy from a branch"
- Branch:
gh-pages - Folder:
/ (root)
Benefits:
- ✅ Simple: Single command deployment
- ✅ Fast: Direct git subtree push
- ✅ Clean: Source code and build artifacts separated
- ✅ Reliable: No CI/CD dependencies
capmetoo/
├── .github/workflows/ # GitHub Actions for CI/CD
├── app/ # Next.js app directory
├── components/ # React components
│ ├── app/ # App-specific components
│ ├── layout/ # Layout components
│ ├── modals/ # Modal components
├── Cap-Me-Too/ # All deployment icons, manifest, and static assets for GitHub Pages
│ ├── favicon.ico # Browser favicon
│ ├── icon.svg # Vector icon
│ ├── ... # All PWA icons and static assets
├── public/ # Source icons (for development only)
├── out/ # Build output (for deployment)
└── ...
Important: For GitHub Pages deployment, all icons and static assets (favicon.ico, icon.svg, PWA icons) must be in the /Cap-Me-Too/ subfolder. Do not place deployment icons in the root or public/ folders.
We welcome contributions! Here's how you can help:
Found a bug? Create a bug report
Have an idea? Request a feature
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- Fix typos and improve clarity
- Add examples and use cases
- Translate to other languages
- Update outdated information
Help us support more languages! Check our translation guide.
- Node.js 18+
- npm or yarn
- Google AI API key
```bash
git clone https://github.com/SimeonTsvetanov/Cap-Me-Too.git cd Cap-Me-Too npm install
npm run dev ```
```bash npm run dev # Start development server npm run build # Build for production npm run start # Start production server npm run lint # Run ESLint with auto-fix npm run lint:check # Check linting without fixing npm run type-check # Run TypeScript checks npm run deploy # Deploy to GitHub Pages ```
``` capmetoo/ ├── .github/workflows/ # GitHub Actions for CI/CD ├── app/ # Next.js app directory ├── components/ # React components │ ├── app/ # App-specific components │ ├── layout/ # Layout components │ ├── modals/ # Modal components │ ├── setup/ # Setup components │ └── ui/ # Reusable UI components ├── hooks/ # Custom React hooks ├── utils/ # Utility functions ├── public/ # Static assets ├── docs/ # Documentation └── README.md # This file ```
This project is licensed under the MIT License - see the LICENSE file for details.
If you find CapMeToo helpful, consider supporting the project:
- Google AI for providing the Gemini API
- Vercel for Next.js and deployment platform
- Tailwind CSS for the amazing styling framework
- Radix UI for accessible component primitives
- The Community for feedback and contributions
- 🌐 Website: CapMeToo
- 📧 Email: Create an issue
- 💬 Discussions: GitHub Discussions
- 🐛 Bug Reports: GitHub Issues
- ☕ Support: Buy Me a Coffee
