🍌 NanoBanana Prompts

A curated collection of 200+ AI image generation prompts for Gemini's Nano Banana feature. Browse, search, filter, and copy prompts to create stunning image transformations instantly.

✨ Features

• 🎨 200+ Curated Prompts - Hand-picked prompts for various styles and effects
• 🔍 Advanced Search & Filters - Search by title, description, tags, or category
• 🏷️ 12+ Categories - From 3D figurines to retro styles, gaming effects, and more
• 💾 One-Click Copy - Copy any prompt instantly to your clipboard
• 🌟 Featured & Popular - Discover trending and community-favorite prompts
• 📱 Responsive Design - Beautiful UI that works on all devices
• 🎯 Direct Gemini Integration - "Open in Gemini" button for seamless workflow
• 🌙 Dark Mode - Full dark mode support
• 🚀 Fast Performance - Built with Nuxt 4 and optimized for speed

🎭 Categories

• 3D Figurine - Collectible figurines and toy box styles
• Retro/Vintage - Bollywood, 80s, Hollywood glamour
• Gaming/Pixel Art - 16-bit, anime, RPG characters
• Cinematic - Movie posters and dramatic effects
• Artistic - Renaissance, sketches, mosaics
• Fashion/Editorial - Studio fashion and magazine styles
• Photography Effects - Professional portraits and techniques
• Fantasy/RPG - Character transformations
• Cyberpunk/Tech - Futuristic and holographic effects
• And more!

🚀 Quick Start

Prerequisites

• Node.js 18+ or Bun
• pnpm (recommended) or npm

Installation

# Clone the repository
git clone https://github.com/jd-solanki/imgprompts.git
cd imgprompts

# Install dependencies
pnpm install

Development

Start the development server on http://localhost:3000:

pnpm dev

Build for Production

pnpm build

# Preview production build
pnpm preview

📁 Project Structure

imgprompts/
├── app/
│   ├── components/
│   │   ├── PromptCard.vue       # Prompt card component
│   │   └── layout/              # Header & footer
│   ├── pages/
│   │   ├── index.vue            # Homepage
│   │   └── gallery/
│   │       ├── index.vue        # Gallery with filters
│   │       └── [id].vue         # Prompt detail page
│   └── app.vue                  # Root component
├── content/
│   └── prompts/                 # JSON prompt files (200+)
├── scripts/
│   └── convert-csv-to-json.mjs  # CSV to JSON converter
├── content.config.ts            # Content collection schema
└── nuxt.config.ts               # Nuxt configuration

🗂️ Prompt JSON Structure

Each prompt follows this comprehensive schema:

{
  "id": "classic-3d-figurine",
  "slug": "classic-3d-figurine",
  "title": "Classic 3D Figurine",
  "prompt": "Full prompt text...",
  "shortDescription": "Brief description",
  "category": "3d-figurine",
  "tags": ["figurine", "collectible", "3d"],
  "style": "3D/CGI",
  "popularity": "high",
  "trendLevel": 95,
  "featured": true,
  "verified": true,
  "author": {
    "name": "Google Official",
    "username": "google"
  },
  "images": [
    {
      "url": "https://...",
      "caption": "Example image",
      "alt": "Description"
    }
  ],
  "metadata": {
    "difficulty": "beginner",
    "estimatedTime": "2-5 minutes",
    "bestWith": ["portrait photos"],
    "tips": "Works best with clear photos",
    "community": "Reddit, Instagram"
  },
  "engagement": {
    "likes": 0,
    "saves": 0,
    "comments": 0
  },
  "gemini": {
    "compatible": true,
    "webUrl": "https://gemini.google.com/app"
  }
}

🔧 Adding New Prompts

From CSV

1. Add prompts to gemini_nano_banana_100_prompts_final.csv
2. Run the conversion script:

node scripts/convert-csv-to-json.mjs

Manually

Create a new JSON file in content/prompts/:

# Create new prompt file
touch content/prompts/999.my-new-prompt.json

Follow the schema defined in content.config.ts.

🛠️ Tech Stack

• Framework: Nuxt 4 - Vue.js framework
• Content: @nuxt/content - File-based CMS
• UI: @nuxt/ui - Beautiful UI components
• Styling: Tailwind CSS
• Language: TypeScript
• Icons: Lucide Icons

📝 Scripts

• pnpm dev - Start development server
• pnpm build - Build for production
• pnpm preview - Preview production build
• pnpm generate - Generate static site
• node scripts/convert-csv-to-json.mjs - Convert CSV to JSON prompts

🎨 Customization

Update Categories

Edit the schema in content.config.ts:

category: z.enum([
  '3d-figurine',
  'retro-vintage',
  // Add your categories here
])

Styling

Customize colors and themes in app/app.config.ts:

export default defineAppConfig({
  ui: {
    colors: {
      primary: 'your-color',
    }
  }
})

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingPrompt)
3. Commit your changes (git commit -m 'Add some AmazingPrompt')
4. Push to the branch (git push origin feature/AmazingPrompt)
5. Open a Pull Request

📄 License

MIT License - feel free to use this project for your own purposes.

🙏 Acknowledgments

• Prompt data curated from various community sources
• Built with Nuxt and Nuxt UI
• Inspired by the Gemini Nano Banana community

📬 Contact

• GitHub: @jd-solanki
• Repository: imgprompts

---

Made with ❤️ for the Gemini Nano Banana community

yarn

yarn build

bun

bun run build

Locally preview production build:

```bash
# npm
npm run preview

# pnpm
pnpm preview

# yarn
yarn preview

# bun
bun run preview

Check out the deployment documentation for more information.