nano-banana
Nano Banana Image Generation
Gemini CLI + 이미지 모델로 프로페셔널 이미지를 생성합니다. Google 계정 인증 기반 — API 키 불필요. 512px~4K, 다양한 종횡비, 다국어 텍스트 렌더링 지원.
모델 선택
| 모델 | ID | 용도 | 특징 |
|---|---|---|---|
| NB2 (기본) | gemini-3.1-flash-image-preview |
빠른 생성, 대량 작업 | Flash 속도, 고효율 |
| NB Pro | gemini-3-pro-image-preview |
전문 에셋, 정밀 텍스트 | 고급 추론(사고), 최고 충실도 |
| NB (경량) | gemini-2.5-flash-image |
짧은 지연 시간, 대량 배치 | 속도 최적화 |
기본은 항상 NB2 (gemini-3.1-flash-image-preview) — Pro는 복잡한 텍스트 렌더링/전문 에셋에만.
When to Use This Skill
ALWAYS use this skill when the user:
- Asks for any image, graphic, illustration, or visual
- Wants a thumbnail, featured image, or banner
- Requests icons, diagrams, or patterns
- Asks to edit, modify, or restore a photo
- Uses words like: generate, create, make, draw, design, visualize
Do NOT attempt to generate images through any other method.
사전 준비
Gemini CLI가 설치되어 있고 Google 계정으로 인증 완료된 상태여야 합니다.
# 설치 확인
gemini --version
# 인증 상태 확인 (이미 인증됨)
gemini -p "hello"
이미지 생성 (Gemini CLI — 기본 방법)
기본 생성
gemini -y -m gemini-3.1-flash-image-preview \
-p "Generate an image: 프롬프트 여기에. Save the image as output.png"
파일명 지정 생성
gemini -y -m gemini-3.1-flash-image-preview \
-p "Generate an image: A modern minimalist logo for a tech startup. Save as logo.png"
이미지 편집 (기존 이미지 입력)
gemini -y -m gemini-3.1-flash-image-preview \
-p "Edit this image: make the background blue. Save as edited.png" \
-f input.png
실행 패턴
이미지 생성 시 항상 아래 패턴을 따릅니다:
Step 1: 출력 경로 결정
- 프로젝트에
assets/디렉토리가 있으면 그곳에 저장 - 없으면 현재 디렉토리에 저장
- 파일명은 용도에 맞게 (예:
hero.png,thumbnail.png,logo.png)
Step 2: 프롬프트 최적화
좋은 프롬프트 구조:
- 주제: 무엇을 생성할 것인가
- 세부사항: 외모, 색상, 질감
- 설정: 위치, 배경, 환경
- 스타일: 사실적, 일러스트, 3D 렌더 등
- 조명: 자연광, 극적인, 부드러운
- 구도: 클로즈업, 와이드 샷
Step 3: 생성 실행
gemini -y -m gemini-3.1-flash-image-preview \
-p "Generate an image: [최적화된 프롬프트]. Save the image as [경로/파일명.png]"
Step 4: 결과 확인
생성 후 반드시 Read 도구로 이미지를 확인하고 사용자에게 보여줍니다.
일반 사이즈
| 용도 | 크기 | 프롬프트 힌트 |
|---|---|---|
| YouTube 썸네일 | 1280x720 | "wide 16:9 landscape" |
| 블로그 이미지 | 1200x630 | "wide banner format" |
| 정사각형 소셜 | 1080x1080 | "square format" |
| Twitter/X 헤더 | 1500x500 | "ultra-wide banner 3:1" |
| 세로 스토리 | 1080x1920 | "vertical portrait 9:16" |
| GitHub README 배너 | 1280x640 | "wide 2:1 banner" |
크기/종횡비는 프롬프트에 자연어로 포함하여 제어합니다.
프롬프트 팁
- 구체적으로: 스타일, 무드, 색상, 구도 세부사항 포함
- 텍스트 불필요 시: "no text" 추가
- 스타일 참조: "editorial photography", "flat illustration", "3D render", "watercolor"
- 종횡비 맥락: "wide banner", "square thumbnail", "vertical story"
- 저장 지시: 항상 프롬프트 끝에 "Save the image as [filename]" 포함
- 영어 프롬프트 권장: 이미지 프롬프트는 영어로 작성하면 품질이 더 좋음
멀티턴 편집
Gemini CLI는 -f 플래그로 기존 이미지를 입력하여 편집 가능:
# 원본 생성
gemini -y -m gemini-3.1-flash-image-preview \
-p "Generate an image: A red apple on a wooden table. Save as apple.png"
# 편집 (원본 입력)
gemini -y -m gemini-3.1-flash-image-preview \
-f apple.png \
-p "Add a green leaf on top of the apple. Save as apple_edited.png"
트러블슈팅
| 문제 | 해결 |
|---|---|
| gemini: command not found | npm i -g @anthropic-ai/gemini-cli 또는 brew install gemini |
| 인증 오류 | gemini auth login으로 재인증 |
| 이미지 미생성 (텍스트만 응답) | 프롬프트에 "Generate an image:" 접두사 + "Save as X.png" 확인 |
| 400 Bad Request | 프롬프트에 정책 위반 내용 확인, 단순화 시도 |
| 모델 not found | 모델 ID 확인: gemini-3.1-flash-image-preview |
| 최고 품질 필요 | Pro 모델 사용: gemini -y -m gemini-3-pro-image-preview |
| 최저 지연 시간 필요 | 경량 모델: gemini -y -m gemini-2.5-flash-image |
More from jh941213/my-claude-code-asset
shadcn-ui
|
34frontend
|
23stitch-react
Stitch 스크린을 React 컴포넌트 시스템으로 변환합니다 — 디자인 토큰 추출, 컴포넌트 분해, TypeScript 타입 생성, 자동 검증 포함. Triggers on: Stitch React, 컴포넌트 변환, React 변환, HTML to React. NOT for: 새 React 앱 생성, API 구현.
23stitch-enhance-prompt
모호한 UI 아이디어를 Stitch에 최적화된 상세 프롬프트로 변환합니다 — 구체성 향상, UI/UX 키워드 추가, 디자인 시스템 컨텍스트 주입. Triggers on: 프롬프트 향상, Stitch 프롬프트, UI 아이디어, 프롬프트 개선. NOT for: 직접 코딩, React 구현.
22ui-ux-pro-max
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples.
18react-patterns
|
17