Communitygithub.com

xfstudio/skills

此技能可使用 Google Gemini 的圖片生成模型 (`gemini-3-pro-image-preview`) 產生圖片。讓您在任意 Claude Code 工作階段中都能順暢創作圖片——無論是建構前端 UI、撰寫文件,或是需要概念的視覺化呈現。

skills 是什麼?

此技能整合了 Google Gemini 的 `gemini-3-pro-image-preview` 模型,讓開發者能在 Claude Code 中直接生成圖片。它的核心價值在於消除工作流程中斷:當需要插入圖片(例如前端元件的佔位圖、文件架構圖或 UI 素材)時,不必切換到外部工具。技能會將文字提示轉換為圖片,並傳回檔案路徑,方便直接於專案中使用。支援 Windows、macOS 和 Linux 跨平台環境。使用時只需設定 `GEMINI_API_KEY` 環境變數,並安裝 Python 3.6 以上版本(僅需標準函式庫,無需額外 pip 套件)。使用者可透過 CLI 參數指定輸出路徑與解析度(例如 `--size 2K`),圖片預設以 PNG 格式儲存於當前目錄。此技能尤其適合前端開發、專案文件撰寫、UI 素材製作,以及任何需要快速視覺化的場景。

相容平台✓Claude Code~Codex CLI~Cursor✓Gemini CLI
npx skills add https://github.com/xfstudio/skills/tree/HEAD/imagen

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

Imagen - AI 圖片生成技能

概述

此技能使用 Google Gemini 的圖片生成模型 (gemini-3-pro-image-preview) 產生圖片。讓您在任意 Claude Code 工作階段中都能順暢創作圖片——無論是建構前端 UI、撰寫文件,或是需要概念的視覺化呈現。

跨平台:支援 Windows、macOS 和 Linux。

何時使用此技能

當出現以下情況時自動啟用此技能:

  • 使用者要求產生圖片(例如「生成一張……的圖片」、「建立一張圖片……」)
  • 前端開發需要佔位圖或實際圖片
  • 文件需要插圖或圖表
  • 將概念、架構或想法視覺化
  • 建立圖示、標誌或 UI 素材
  • 任何需要 AI 生成圖片協助的工作

運作方式

  1. 接受一段描述所需圖片的文字提示
  2. 透過圖片生成設定呼叫 Google Gemini API
  3. 將產生的圖片儲存至指定位置(預設為當前目錄)
  4. 回傳檔案路徑,方便在專案中使用

使用方法

Python(跨平台 - 建議使用)

# 基本使用
python scripts/generate_image.py "夕陽下的未來城市天際線"

# 自訂輸出路徑
python scripts/generate_image.py "音樂播放器的極簡應用程式圖示" "./assets/icons/music-icon.png"

# 自訂尺寸
python scripts/generate_image.py --size 2K "高解析度風景" "./wallpaper.png"

需求

  • 須設定 GEMINI_API_KEY 環境變數
  • Python 3.6 以上(僅使用標準函式庫,無需 pip 安裝)

輸出

產生的圖片會儲存為 PNG 檔案。腳本回傳:

  • 成功:產生的圖片路徑
  • 失敗:包含詳細資訊的錯誤訊息

範例

前端開發

使用者:「我需要在登陸頁面放一張主打圖片——抽象且科技感為主」
-> 產生並儲存圖片,提供路徑供 HTML/CSS 使用

文件

使用者:「建立一張微服務架構圖」
-> 產生視覺化圖表,可立即用於 README 或文件

UI 素材

使用者:「為使用者個人資料元件生成一張佔位頭像圖片」
-> 以適合元件使用的大小建立圖片

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相關技能