スキル generate-assets
🎨

generate-assets

低リスク 🔑 環境変数🌐 ネットワークアクセス📁 ファイルシステムへのアクセス

Gerar imagens de IA para componentes web

Criar ativos visuais para sites requer tempo e habilidades de design. Esta skill usa IA FLUX 1.1 Pro para gerar seções hero, imagens de recursos e gráficos de IU com aprimoramento automático. As imagens são otimizadas como WebP e salvas diretamente no seu projeto.

対応: Claude Codex Code(CC)
🥉 72 ブロンズ
1

スキルZIPをダウンロード

2

Claudeでアップロード

設定 → 機能 → スキル → スキルをアップロードへ移動

3

オンにして利用開始

テストする

「generate-assets」を使用しています。 Generate a hero image for a modern analytics dashboard

期待される結果:

  • Enhanced prompt with modern UI elements and gradients
  • Generated 1920x1080 image using FLUX 1.1 Pro
  • Saved to: public/assets/images/hero-dashboard.webp
  • Usage: <Image src="/assets/images/hero-dashboard.webp" alt="Analytics dashboard" />

「generate-assets」を使用しています。 Create a feature image for AI content generation

期待される結果:

  • Enhanced prompt with glassmorphism effects
  • Generated 1024x1024 image using FLUX 1.1 Pro
  • Saved to: public/assets/images/feature-ai.webp
  • Usage: <Image src="/assets/images/feature-ai.webp" alt="AI content generation" />

「generate-assets」を使用しています。 Generate decorative stars with transparent background

期待される結果:

  • Removed background using bria/remove-background model
  • Generated 512x512 transparent image
  • Saved to: public/assets/images/foreground/stars.webp
  • Usage: <Image src="/assets/images/foreground/stars.webp" alt="Decorative stars" />

セキュリティ監査

低リスク
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
総監査数

リスク要因

🔑 環境変数 (1)
scripts/generate-asset.ts:7-8
🌐 ネットワークアクセス (3)
scripts/generate-asset.ts:257-267 scripts/generate-asset.ts:298-304 scripts/generate-asset.ts:348-354
📁 ファイルシステムへのアクセス (2)
scripts/generate-asset.ts:141-144 scripts/generate-asset.ts:382-388
監査者: claude 監査履歴を表示 →

品質スコア

59
アーキテクチャ
100
保守性
85
コンテンツ
21
コミュニティ
90
セキュリティ
83
仕様準拠

作れるもの

Visuais de seção hero

Gerar imagens hero em formato amplo para páginas de destino a partir de descrições simples de texto

Gráficos de vitrine de recursos

Criar imagens quadradas de recursos com estilização automática de IU para páginas de produtos

Ativos em primeiro plano com transparência

Gerar elementos decorativos com fundos transparentes para sobreposições

これらのプロンプトを試す

Imagem hero básica 
Generate a hero section image for a modern SaaS dashboard showing analytics charts
Cartão de recurso 
Generate a feature image showing AI-powered content generation with a clean interface
Ativo com transparência 
Generate decorative floating shapes with transparent background for UI overlay
Gráfico de transformação 
Generate a transformation graphic showing content optimization before and after

ベストプラクティス

  • Use descrições de assunto específicas em prompts para melhor interpretação da IA
  • Deixe o script aprimorar prompts automaticamente - ele adiciona estilização profissional automaticamente
  • Corresponda dimensões de imagens existentes ao substituir ativos para manter consistência de layout

回避

  • Usar prompts excessivamente genéricos como 'deixe bonito' sem assunto específico
  • Solicitar vários tipos de ativos em um único prompt - gere cada um separadamente
  • Esquecer de definir REPLICATE_API_TOKEN antes de executar a skill

よくある質問

Quais modelos de IA esta skill usa?
O modelo principal é FLUX 1.1 Pro da Replice para geração de imagens. O modelo opcional bria/remove-background é usado para ativos com transparência.
Quais formatos de imagem são suportados?
A saída é sempre no formato WebP otimizado para desempenho web. Proporções de aspecto suportadas incluem 1:1, 16:9, 4:3, 9:16 e 21:9.
Como integro com meu projeto?
Instale dependências com 'pnpm add replicate' e 'pnpm add sharp -D'. Defina REPLICATE_API_TOKEN no seu arquivo .env antes de usar.
Meus dados são enviados para servidores externos?
As imagens são geradas via API da Replicate e armazenadas temporariamente em seus servidores. Os ativos finais são salvos apenas no diretório público do seu projeto.
Por que minha geração está falhando?
Causas comuns: REPLICATE_API_TOKEN faltando, créditos Replice insuficientes, problemas de rede ou prompts que violam diretrizes de conteúdo.
Como isso é diferente de outros geradores de imagem?
Esta skill é otimizada para componentes web com aprimoramento automático de prompt, correspondência de dimensões e saída direta de arquivos no seu projeto.

開発者の詳細

ライセンス

MIT

リポジトリ

https://github.com/AayushBaniya2006/blinkfund/tree/main/.claude/skills/generate-assets

参照

main

ファイル構成

📁 scripts/

📄 generate-asset.ts

📄 reference.md

📄 SKILL.md