技能 generate-assets
🎨

generate-assets

低風險 🔑 環境變數🌐 網路存取📁 檔案系統存取

为Web组件生成AI图像

为网站创建视觉素材需要时间和设计技能。此技能使用FLUX 1.1 Pro AI生成英雄区、功能图像和UI图形,并自动增强。图像优化为WebP格式并直接保存到您的项目中。

支援: Claude Codex Code(CC)
🥉 72 青銅
1

下載技能 ZIP

2

在 Claude 中上傳

前往 設定 → 功能 → 技能 → 上傳技能

3

開啟並開始使用

測試它

正在使用「generate-assets」。 为现代分析仪表板生成英雄图像

預期結果:

  • 使用现代UI元素和渐变增强提示词
  • 使用FLUX 1.1 Pro生成1920x1080图像
  • 保存到:public/assets/images/hero-dashboard.webp
  • 用法:<Image src="/assets/images/hero-dashboard.webp" alt="分析仪表板" />

正在使用「generate-assets」。 为AI内容生成创建功能图像

預期結果:

  • 使用玻璃态效果增强提示词
  • 使用FLUX 1.1 Pro生成1024x1024图像
  • 保存到:public/assets/images/feature-ai.webp
  • 用法:<Image src="/assets/images/feature-ai.webp" alt="AI内容生成" />

正在使用「generate-assets」。 生成具有透明背景的装饰星星

預期結果:

  • 使用bria/remove-background模型移除背景
  • 生成512x512透明图像
  • 保存到:public/assets/images/foreground/stars.webp
  • 用法:<Image src="/assets/images/foreground/stars.webp" alt="装饰星星" />

安全審計

低風險
v5 • 1/16/2026

This is a legitimate image generation skill that makes targeted API calls to Replicate for FLUX 1.1 Pro image generation. The static analyzer flagged patterns (network + credentials + filesystem) that appear suspicious but are standard for API-based tools. Accesses REPLICATE_API_TOKEN for authentication only. Writes files only to public/assets/images directory. No data exfiltration or malicious behavior detected.

4
已掃描檔案
917
分析行數
3
發現項
5
審計總數
審計者: claude 查看審計歷史 →

品質評分

59
架構
100
可維護性
85
內容
21
社群
90
安全
83
規範符合性

你能建構什麼

英雄区视觉效果

根据简单的文本描述为落地页生成长格式的英雄图像

功能展示图形

创建具有自动UI样式的方形功能图像,用于产品页面

透明前景素材

生成具有透明背景的装饰元素,用于叠加

試試這些提示

基础英雄图像
为现代SaaS仪表板生成英雄区图像,显示分析图表
功能卡片
生成展示AI驱动内容生成的功能图像,界面简洁
透明素材
生成具有透明背景的装饰性漂浮形状,用于UI叠加
转换图形
生成显示内容优化前后对比的转换图形

最佳實務

  • 在提示词中使用具体的主题描述以获得更好的AI理解
  • 让脚本自动增强提示词 - 它会自动添加专业样式
  • 替换素材时匹配现有图像尺寸以保持布局一致性

避免

  • 使用过于通用的提示词,如"让它好看",没有具体主题
  • 在单个提示词中请求多种素材类型 - 应分别生成
  • 运行技能前忘记设置REPLICATE_API_TOKEN

常見問題

此技能使用哪些AI模型?
主要模型是来自Replicate的FLUX 1.1 Pro,用于图像生成。可选的bria/remove-background模型用于透明素材。
支持哪些图像格式?
输出始终是WebP格式,针对Web性能进行优化。支持的宽高比包括1:1、16:9、4:3、9:16和21:9。
如何与我的项目集成?
使用'pnpm add replicate'和'pnpm add sharp -D'安装依赖项。使用前在.env文件中设置REPLICATE_API_TOKEN。
我的数据会被发送到外部服务器吗?
图像通过Replicate的API生成,并临时存储在其服务器上。最终素材仅保存到项目的public目录中。
为什么我的生成失败了?
常见原因:缺少REPLICATE_API_TOKEN、Replicate积分不足、网络问题,或提示词违反内容指南。
这与其他图像生成器有何不同?
此技能针对Web组件进行了优化,具有自动提示词增强、尺寸匹配和直接文件输出到项目的功能。