image-generator – Design & UI skill for AI agents
Generate and edit images using Gemini's Nano Banana Pro model (gemini-3-pro-image-preview). Use this skill when the user asks you to generate images, create visuals, edit photos, create logos, generate product mockups, or perform any image generation/editing task.
Install the image-generator skill with one command
Pick the tool you use, copy the command and paste it in your terminal. The skill lands in that tool's skills folder and is ready in your next session.
Claude Code
mkdir -p ~/.claude/skills && curl -fsSL https://skill.dn1nguoi.com/z/image-generator-2e4fa.tgz | tar xz -C ~/.claude/skills
Call it in Claude Code: /image-generator – then describe the task you want done.
Codex
mkdir -p ~/.codex/skills && curl -fsSL https://skill.dn1nguoi.com/z/image-generator-2e4fa.tgz | tar xz -C ~/.codex/skills
Call it in Codex: $image-generator – then describe the task you want done.
Hermes Agent
mkdir -p ~/.hermes/skills && curl -fsSL https://skill.dn1nguoi.com/z/image-generator-2e4fa.tgz | tar xz -C ~/.hermes/skills
Call it in Hermes Agent: /image-generator – then describe the task you want done.
DeepSeek
mkdir -p ~/.deepcode/skills && curl -fsSL https://skill.dn1nguoi.com/z/image-generator-2e4fa.tgz | tar xz -C ~/.deepcode/skills
Call it in DeepSeek: /image-generator – then describe the task you want done.
SKILL.md content
Image Generator
Detailed Guide
Read [the detailed guide](references/detailed-guide.md) before executing this skill. It retains the complete procedure and reference material. Treat its safety, prerequisites, and validation requirements as mandatory. For focused work, load the relevant sections; for end-to-end work, read the guide completely.
When to Use
Use when this workflow matches the user request: Generate and edit images using Gemini's Nano Banana Pro model (gemini-3-pro-image-preview). Use this skill when the user asks you to generate images, create visuals, edit photos, create logos, generate product mockups, or perform any image generation/editing task.
_Source: [dair-ai/dair-academy-plugins](https://github.com/dair-ai/dair-academy-plugins) (MIT)._
This skill generates and edits images using Google's Gemini Nano Banana Pro model (gemini-3-pro-image-preview).
API Usage
Paid external API workflow: confirm approved model/budget, exact prompt and input image set, rights/consent and provider data policy before requests. Model ID/options below are historical examples; check current availability and SDK version. Never promise exact text, masking or resolution; inspect returned MIME/dimensions and visible output. Preserve originals and use new unique output names, writing only within the authorized destination. A missing/blocked image is not success; do not retry billable calls blindly after uncertain outcomes.
Basic Text-to-Image (Python)
from google import genai
from google.genai import types
client = genai.Client()
response = client.models.generate_content(
model="gemini-3-pro-image-preview",
contents=["Your prompt here"],
config=types.GenerateContentConfig(
response_modalities=['TEXT', 'IMAGE'],
image_config=types.ImageConfig(
aspect_ratio="16:9", # Optional
image_size="2K" # Optional: "1K", "2K", "4K"
)
)
)
for part in response.parts:
if part.text is not None:
print(part.text)
elif part.inline_data is not None:
image = part.as_image()
image.save("generated_image.png")Basic Text-to-Image (JavaScript)
import { GoogleGenAI } from "@google/genai";
import * as fs from "node:fs";
const ai = new GoogleGenAI({});
const response = await ai.models.generateContent({
model: "gemini-3-pro-image-preview",
contents: "Your prompt here",
config: {
responseModalities: ['TEXT', 'IMAGE'],
imageConfig: {
aspectRatio: "16:9",
imageSize: "2K"
}
}
});
for (const part of response.candidates[0].content.parts) {
if (part.text) {
console.log(part.text);
} else if (part.inlineData) {
const buffer = Buffer.from(part.inlineData.data, "base64");
fs.writeFileSync("generated_image.png", buffer);
}
}REST alternative
Prefer the SDK examples so credentials are not interpolated into command-line headers and JSON is serialized correctly. If implementing REST, use a protected header/request file, explicit timeouts and HTTP-status handling; validate candidate/part/MIME fields before writing bytes. Do not assume the first candidate or an image exists.
Image Editing (with input image)
from google import genai
from google.genai import types
from PIL import Image
client = genai.Client()
input_image = Image.open('input.png')
prompt = "Add a wizard hat to the cat in this image"
response = client.models.generate_content(
model="gemini-3-pro-image-preview",
contents=[prompt, input_image],
config=types.GenerateContentConfig(
response_modalities=['TEXT', 'IMAGE']
)
)
for part in response.parts:
if part.inline_data is not None:
image = part.as_image()
image.save("edited_image.png")Multi-Image Composition
from google import genai
from google.genai import types
from PIL import Image
client = genai.Client()
image1 = Image.open('dress.png')
image2 = Image.open('model.png')
prompt = "Put the dress from the first image on the model from the second image"
response = client.models.generate_content(
model="gemini-3-pro-image-preview",
contents=[image1, image2, prompt],
config=types.GenerateContentConfig(
response_modalities=['TEXT', 'IMAGE'],
image_config=types.ImageConfig(
aspect_ratio="3:4",
image_size="2K"
)
)
)With Google Search Grounding
from google import genai
from google.genai import types
client = genai.Client()
response = client.models.generate_content(
model="gemini-3-pro-image-preview",
contents="Visualize the current weather forecast for San Francisco",
config=types.GenerateContentConfig(
response_modalities=['TEXT', 'IMAGE'],
image_config=types.ImageConfig(aspect_ratio="16:9"),
tools=[{"google_search": {}}]
)
)Limitations
- Requires the upstream tool, account, API key, or local setup when the workflow names one.
- Does not authorize destructive, production, paid, or external-message actions without explicit user approval.
- Validate generated artifacts or recommendations against the user's real sources before treating them as final.
Related skills
- image-studio – Studio de geracao de imagens inteligente — roteamento automatico entre ai-studio-image…
- imagen – AI image generation skill powered by Google Gemini, enabling seamless visual content…
- industrial-brutalist-ui – Use when creating raw industrial or tactical telemetry UIs with rigid grids, stark…
- isometric-design – Web and App implementation guide for Isometric Design. Trigger when user wants angled 3D…
- json-canvas – Create and edit JSON Canvas files (.canvas) with nodes, edges, groups, and connections…
- ui-design-system – UI design system toolkit for Senior UI Designer including design token generation…
- ux-researcher-designer – UX research and design toolkit for Senior UX Designer/Researcher including data-driven…
- kpi-dashboard-design – Comprehensive patterns for designing effective Key Performance Indicator (KPI)…