Claude Code Skill

Nano Banana Pro

A drop-in Claude Code skill that generates custom images for your websites using Google's Gemini 3 Pro Image — straight from a natural-language prompt.

Download the skill
nano-banana-pro.zip · 6 files · ~8 KB

What it can make

Hover any image to see the JSON that made it
Photorealistic Floating frosted-glass perfume bottle on a warm cream studio background with caustic light below
Floating perfume bottle · studio render
spec-1.json 
loading…
3D · abstract Mirror-polished chrome sculpture twisting upward on a soft pink-to-lavender pastel gradient
Liquid chrome sculpture on pastel
spec-2.json 
loading…
Architectural Wide-angle brutalist concrete interior with a slot-window blade of light and a solitary fiddle-leaf fig
Brutalist interior · single-source light
spec-3.json 
loading…
Vector · editorial Flat editorial vector illustration of a city skyline at dusk with stacked geometric clouds and a warm sun
Editorial cityscape at dusk
spec-4.json 
loading…

What you get

SKILL.md

Tells Claude when and how to invoke the generator — picks aspect ratios, paths, and writes great prompts.

generate_image.py

The CLI. Calls gemini-3-pro-image-preview, supports text-to-image plus reference-image editing.

install.sh

One-shot dependency installer for google-genai and pillow.

README.md

Human-facing setup guide with examples, flags, troubleshooting, and the Vertex AI option.

Install

  1. Unzip into your Claude Code skills folder

    # after downloading
unzip nano-banana-pro.zip -d ~/.claude/skills/

  2. Install the Python dependencies

    bash ~/.claude/skills/nano-banana-pro/install.sh

  3. Get an API key and export it

    Grab one (free tier available) at aistudio.google.com/apikey, then add to your shell rc:

    export GEMINI_API_KEY=your_key_here

  4. Restart Claude Code, then just ask

    The skill auto-triggers on phrases like "generate a hero image", "make an OG card", "create an illustration of". Claude picks the prompt, params, and output path, runs the script, and wires the image into your code.

Use it directly

# text-to-image
python3 ~/.claude/skills/nano-banana-pro/generate_image.py \
  "A wide cinematic shot of a misty pine forest at sunrise" \
  -o public/hero.png --aspect-ratio 16:9 --size 2K

# edit / compose with a reference image
python3 ~/.claude/skills/nano-banana-pro/generate_image.py \
  "Place this logo centered on a deep navy background" \
  -o public/og.png --aspect-ratio 1:1 --input assets/logo.png