本文へ移動
cccskills
無料GitHub で公開

logo-creator

Create logos using AI image generation. Discuss style/ratio, generate variations, iterate with user feedback, crop, remove background, and export as SVG. Use when user wants to create a logo, icon, favicon, brand mark, mascot, emblem, or design a logo.

インストール方法を見る

含まれるファイル(25)

  • SKILL.md5.7 KB
  • .claude-plugin/plugin.json654 B
  • examples/images/logo-01.png257.5 KB
  • examples/images/logo-02.png436.5 KB
  • examples/images/logo-03.png270.9 KB
  • examples/images/logo-04.png144.7 KB
  • examples/images/logo-05.png281.3 KB
  • examples/images/logo-06.png158.5 KB
  • examples/images/logo-07.png219.8 KB
  • examples/images/logo-08.png228.1 KB
  • examples/images/logo-09-v1.png137.2 KB
  • examples/images/logo-09-v2.png365.6 KB
  • examples/images/logo-09-v3.png287.2 KB
  • examples/images/logo-09-v4.png236.9 KB
  • examples/images/logo-09-v5.png102.9 KB
  • examples/images/logo-09-v6.png145.3 KB
  • examples/images/logo-09.png151.4 KB
  • examples/images/opc-logo-final.svg17.5 KB
  • examples/images/opc-logo-selected.png151.4 KB
  • examples/opc-logo-creation.md2.7 KB
  • references/styles.md5.8 KB
  • scripts/crop_logo.py2.5 KB
  • scripts/remove_bg.py2.4 KB
  • scripts/vectorize.py3.3 KB
  • templates/preview.html10.4 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Logo Creator Skill

Create professional logos through AI image generation with an iterative design process.

Prerequisites

Required API Keys (set in environment):

Required Skills:

  • nanobanana - AI image generation (Gemini 3 Pro Image)

File Output Location

All generated files should be saved to the .skill-archive directory:

.skill-archive/logo-creator/<yyyy-mm-dd-summaryname>/

Example:

.skill-archive/logo-creator/2026-01-18-opc-logo/
  logo-01.png
  logo-02.png
  ...
  logo-09-cropped.png
  logo-09-nobg.png
  logo-09.svg
  preview.html

Guidelines:

  • Use current date in format yyyy-mm-dd
  • Add short summary name (project/brand name, kebab-case)
  • Create directory before generating first logo
  • Keep all variations and iterations in same folder
  • Final approved logo should be copied to user's desired location

Workflow

Step 1: Discovery & Requirements

Before generating, gather requirements from user:

Ask about:

  1. Project/Brand name - What is the logo for?

  2. Style preference - See references/styles.md for options:

    • Pixel art / 8-bit retro
    • Minimalist / flat design
    • 3D / isometric
    • Hand-drawn / sketch
    • Mascot / character
    • Monogram / lettermark
    • Abstract / geometric
  3. Aspect ratio - Default is 1:1 (square), options:

    • 1:1 - Square (favicons, app icons)
    • 16:9 - Wide (headers, banners)
    • 4:3 - Standard
    • 2:3 - Portrait
  4. Color preferences:

    • Monochrome (black & white)
    • Specific brand colors
    • Let AI decide
  5. Reference images - Any existing logos or styles to reference?

Wait for user confirmation before proceeding!

Step 2: Generate Logo Variations

Generate 20 logo variations (default) using the nanobanana skill:

# Generate single logo
python3 <nanobanana_skill_dir>/scripts/generate.py "{style} logo for {brand}, {description}, {colors}" \
  --ratio 1:1 -o .skill-archive/logo-creator/<date-name>/logo-01.png

# Batch generate 20 logos
python3 <nanobanana_skill_dir>/scripts/batch_generate.py "{style} logo for {brand}, {description}, {colors}" \
  -n 20 --ratio 1:1 -d .skill-archive/logo-creator/<date-name> -p logo

Guidelines:

  • Use batch_generate.py for multiple variations (includes auto-delay)
  • Save to .skill-archive/logo-creator/<yyyy-mm-dd-summaryname>/ directory
  • Use sequential naming: logo-01.png, logo-02.png, etc.

Prompt Tips:

  • Include style keywords: "pixel art", "minimalist", "8-bit", "flat design"
  • Specify colors: "black on white", "monochrome", "blue gradient"
  • Add context: "tech startup", "food brand", "gaming company"
  • Request format: "icon", "emblem", "mascot", "lettermark"

Step 3: Create HTML Preview

Copy the preview template and open in browser:

cp <skill_dir>/templates/preview.html .skill-archive/logo-creator/<yyyy-mm-dd-summaryname>/preview.html

Then open in default browser:

open .skill-archive/logo-creator/<yyyy-mm-dd-summaryname>/preview.html

IMPORTANT: Update the HTML to include the correct number of logos generated.

Step 4: Iterate with User

Ask user which logos they prefer:

  • "Which logos do you like? (e.g., #5, #12, #18)"
  • "What do you like about them?"
  • "Any changes you'd want?"

Based on feedback:

  1. Generate 10-20 more variations of favorite styles
  2. Use naming: logo-{original}-v{n}.png (e.g., logo-05-v1.png)
  3. Update HTML preview
  4. Repeat until user selects final logo

Step 5: Finalize Logo

Once user approves a logo, process it:

5a. Crop whitespace (make 1:1 with no margins):

python3 <skill_dir>/scripts/crop_logo.py {input.png} {output-cropped.png}

5b. Remove background:

python3 <skill_dir>/scripts/remove_bg.py {input.png} {output-nobg.png}

5c. Convert to SVG:

python3 <skill_dir>/scripts/vectorize.py {input.png} {output.svg}

Step 6: Deliver Final Assets

Present final deliverables:

## Final Logo Assets

| File | Description | Size |
|------|-------------|------|
| logo.png | Original | 1024x1024 |
| logo-cropped.png | No margins, 1:1 | ~800x800 |
| logo-nobg.png | Transparent background | ~800x800 |
| logo.svg | Vector (scalable) | ~20KB |

All files saved to: `.skill-archive/logo-creator/<yyyy-mm-dd-summaryname>/`
Copy final logo to user's desired location.

Quick Reference

Common Prompt Patterns

Pixel Art:

Pixel art {subject} logo, 8-bit retro style, black pixels on white background, {size}x{size} grid, minimalist icon

Minimalist:

Minimalist {subject} logo, flat design, clean lines, {color} on white, simple geometric shapes

Mascot:

Cute {animal/character} mascot logo, friendly expression, {style} style, {colors}, suitable for brand icon

Lettermark:

Letter "{letter}" logo, modern typography, {style} design, {colors}, clean professional look

Supported Aspect Ratios

  • 1:1 - Square (default for logos)
  • 2:3, 3:2 - Portrait/Landscape
  • 3:4, 4:3 - Standard
  • 4:5, 5:4 - Photo
  • 9:16, 16:9 - Wide
  • 21:9 - Ultra-wide

References

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Checklist and automation guide for adding a new skill to the OPC Skills project. Ensures all required files, metadata, logos, and listings are created before release. Use when adding a new skill, publishing a skill, or preparing a skill for release.

日本語の概要は準備中です。原文の説明を表示しています。

ReScienceLab/opc-skills1,8472026年10月10日 更新

archive

無料

Archive session learnings, debugging solutions, and deployment logs to .archive/yyyy-mm-dd/ as indexed markdown with searchable tags. Use when completing a significant task, resolving a tricky bug, deploying, or when the user says "archive this". Maintains .archive/MEMORY.md index for cross-session knowledge reuse.

日本語の概要は準備中です。原文の説明を表示しています。

ReScienceLab/opc-skills1,8472026年10月10日 更新

Create banners using AI image generation. Discuss format/style, generate variations, iterate with user feedback, crop to target ratio. Use when user wants to create a banner, header, hero image, cover image, GitHub banner, Twitter header, or readme banner.

日本語の概要は準備中です。原文の説明を表示しています。

ReScienceLab/opc-skills1,8472026年10月10日 更新

Search domains, compare prices, find promo codes, get purchase recommendations. Use when user wants to buy a domain, check domain prices, find domain deals, compare registrars, or search for .ai/.com domains.

日本語の概要は準備中です。原文の説明を表示しています。

ReScienceLab/opc-skills1,8472026年10月10日 更新

Generate and edit images using Google Gemini 3 Pro Image (Nano Banana Pro). Supports text-to-image, image editing, various aspect ratios, and high-resolution output (2K/4K). Use when user wants to generate images, create images, use Gemini image generation, or do AI image generation.

日本語の概要は準備中です。原文の説明を表示しています。

ReScienceLab/opc-skills1,8472026年10月10日 更新

Search and retrieve content from Product Hunt. Get posts, topics, users, and collections via the GraphQL API. Use when user mentions Product Hunt, PH, or product launches.

日本語の概要は準備中です。原文の説明を表示しています。

ReScienceLab/opc-skills1,8472026年10月10日 更新

ReScienceLab のスキルをすべて見る

このスキルの問題を報告する