Agent skill

Banner Creator

by ReScienceLab in ReScienceLab/opc-skills

Create banners using AI image generation. An agent skill from ReScienceLab/opc-skills.

Apache-2.0Auto-check passedMedia & Creative

Install Banner Creator

skills CLI
$ npx skills add ReScienceLab/opc-skills --skill banner-creator -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install ReScienceLab/opc-skills banner-creator --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/ReScienceLab/opc-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/banner-creator .claude/skills/banner-creator && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
banner-creator
GitHub stars
1.8k
Token cost
~1.3k tokens
SKILL.md length
364 words
Files
17 (incl. scripts, references)
Skills in repo
9
Repo updated
First seen
Licence
Apache-2.0

At a glance

Create banners using AI image generation. An agent skill from ReScienceLab/opc-skills.

  • Works in 6 steps: Discovery & Requirements → Generate Banner Variations → Create HTML Preview → …
  • User wants to create a banner
  • SKILL.md covers Prerequisites, File Output Location, Workflow and Quick Reference, plus 1 more section
  • Runs Python scripts from its folder; calls python3; needs GEMINI_API_KEY

What it does

Banner Creator is an agent skill from ReScienceLab/opc-skills. 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.

Its SKILL.md is about 1.3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 21 other files, including scripts and reference files (for example `.claude-plugin/plugin.json`, `examples/opc-banner-creation.md` and `references/formats.md`).

It sits in Media & Creative, covering Image generation, Social media graphics and Technical documentation. It works with GitHub and X (Twitter). The repository describes itself as: Agent Skills for Solopreneurs. The licence is Apache-2.0.

When your agent uses it

  • User wants to create a banner
  • Tasks that involve Image generation
  • Tasks that involve Social media graphics

Example prompts

  • “/banner-creator”

Requirements

  • Python 3
  • A credential in GEMINI_API_KEY

Workflow steps

6 steps, taken from the step headings in SKILL.md.

  1. Discovery & Requirements
  2. Generate Banner Variations
  3. Create HTML Preview
  4. Iterate with User
  5. Crop to Target Ratio
  6. Deliver Final Assets

What it can do on your machine

Read from SKILL.md and the folder at commit 8295f4a. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 1 file in scripts/ (Python, from the files we listed), which the agent can run.

    Shell commands in SKILL.md call:

    • python3

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • aistudio.google.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names these keys or tokens, usually read from environment variables:

    • GEMINI_API_KEY

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Banner Creator loads about 1.3k tokens when it runs, and up to ~1.9k if it reads all its reference files. Until then it costs about 68 tokens; SKILL.md has 364 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~68
When it runs · the whole SKILL.md, loaded when a task matches
~1.3k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~1.9k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from ReScienceLab/opc-skills at commit 8295f4a, republished under its Apache-2.0 licence (© ReScienceLab). 364 words, ~1,340 tokens.

Download SKILL.mdSave it as .claude/skills/banner-creator/SKILL.md (or your agent's skills folder). This skill also uses 16 other files; get the full folder from GitHub.
name
banner-creator
description
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.

Banner Creator Skill

Create professional banners 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/banner-creator/<yyyy-mm-dd-summaryname>/

Example:

.skill-archive/banner-creator/2026-01-19-opc-banner/
  banner-01.png
  banner-02.png
  ...
  banner-03-cropped.png
  preview.html

Workflow

Step 1: Discovery & Requirements

Before generating, gather requirements from user:

Ask about:

  1. Purpose - Where will the banner be used?

    • GitHub README
    • Twitter/X header
    • LinkedIn banner
    • Website hero
    • YouTube channel art
  2. Target ratio/size - See references/formats.md:

    • 2:1 (1280x640) - GitHub README
    • 3:1 (1500x500) - Twitter header
    • 16:9 (1920x1080) - Website hero
  3. Style preference:

    • Match existing logo/brand?
    • Pixel art / 8-bit retro
    • Minimalist / flat design
    • Gradient / modern
    • Illustrated / artistic
  4. Content elements:

    • Brand name / project name?
    • Tagline / slogan?
    • Logo character to include?
  5. Color preferences:

    • Existing brand colors?
    • Let AI decide?

Wait for user confirmation before proceeding!

Step 2: Generate Banner Variations

Generate 20 banner variations using the nanobanana skill:

bash
# Generate single banner
python3 <nanobanana_skill_dir>/scripts/generate.py "{style} banner for {brand}, {description}, {text elements}" \
  --ratio 21:9 -o .skill-archive/banner-creator/<date-name>/banner-01.png

# Batch generate 20 banners
python3 <nanobanana_skill_dir>/scripts/batch_generate.py "{style} banner for {brand}, {description}, {text elements}" \
  -n 20 --ratio 21:9 -d .skill-archive/banner-creator/<date-name> -p banner

Guidelines:

  • Generate at 21:9 ratio (widest available), crop later to target
  • Use batch_generate.py for multiple variations (includes auto-delay)
  • Use sequential naming: banner-01.png, banner-02.png, etc.

Image Editing (for incorporating existing logo):

bash
python3 <nanobanana_skill_dir>/scripts/generate.py "add {logo character} to the left side of the banner" \
  -i /path/to/existing-logo.png --ratio 21:9 -o banner-with-logo.png
Step 3: Create HTML Preview

Copy the preview template and open in browser:

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

Then open in default browser:

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

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

Show full SKILL.md (145 more words)Show less
Step 4: Iterate with User

Ask user which banners they prefer:

  • "Which banners do you like? (e.g., #3, #7, #15)"
  • "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: banner-{original}-v{n}.png (e.g., banner-03-v1.png)
  3. Update HTML preview
  4. Repeat until user selects final banner
Step 5: Crop to Target Ratio

Once user approves a banner, crop to target size:

bash
python3 <skill_dir>/scripts/crop_banner.py {input.png} {output.png} --ratio 2:1 --width 1280

Common targets:

  • GitHub README: --ratio 2:1 --width 1280 → 1280x640
  • Twitter header: --ratio 3:1 --width 1500 → 1500x500
  • Website hero: --ratio 16:9 --width 1920 → 1920x1080
Step 6: Deliver Final Assets

Present final deliverables:

## Final Banner Assets

| File | Description | Size |
|------|-------------|------|
| banner-03.png | Original (21:9) | 2016x864 |
| banner-03-cropped.png | GitHub README (2:1) | 1280x640 |

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

Quick Reference

Common Prompt Patterns

With Text:

Wide banner for {brand}, {style} style, featuring "{text}" prominently displayed, {colors}, {scene/elements}

With Character:

Wide banner featuring {character description}, {style} style, {scene}, text "{brand name}" on {position}, {colors}

Abstract/Gradient:

Abstract {style} banner, {colors} gradient, geometric patterns, modern tech feel, text "{brand}" centered

Scene-based:

{Style} illustration banner, {scene description}, {character} in {action}, "{brand}" text overlay, {colors}
Supported Aspect Ratios

Generate at widest ratio, then crop:

  • 21:9 - Ultra-wide (recommended for generation)
  • 16:9 - Wide
  • 3:2 - Standard wide

References

© ReScienceLab, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 16 other files (scripts, references) in skills/banner-creator of ReScienceLab/opc-skills.

  • SKILL.md
  • .claude-plugin/plugin.json
  • examples/images/banner-01.png
  • examples/images/banner-02.png
  • examples/images/banner-03.png
  • examples/images/banner-04.png
  • examples/images/banner-05.png
  • examples/images/banner-06.png
  • examples/images/github-banner-01.png
  • examples/images/github-banner-02.png
  • examples/images/github-banner-03.png
  • examples/images/opc-banner-final.png
  • examples/opc-banner-creation.md
  • references/formats.md
  • scripts/crop_banner.py
  • templates
  • … and 1 more

Open the folder on GitHubat commit 8295f4a

Compare with similar skills

Banner Creator next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Banner Creator compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Banner Creator this skillReScienceLab/opc-skills1.8k—~1.3kAutomated safety check: PassApache-2.0
Web Asset Generatoralonw0/web-asset-generator5121 repos~6.6kAutomated safety check: PassMIT
Beautify GitHub Readmeoil-oil/beautify-github-readme1.8k—~4.1kAutomated safety check: PassMIT
Beautify GitHub ReadmeZergie/YAMMU1061 repos~3.2kAutomated safety check: PassGPL-3.0
Social Previewthatrebeccarae/claude-marketing162—~2.1kAutomated safety check: PassMIT
Ccfddl X Postsccfddl/ccf-deadlines9.4k—~4.2kAutomated safety check: PassMIT

Similar skills

  • Web Asset Generator

    alonw0/web-asset-generator

    Generate web assets including favicons, app icons (PWA), and social media meta images (Open Graph) for Facebook, Twitter, WhatsApp, and LinkedIn.

    512 GitHub starsUsed in 1 repo~6.6k tokens
    Media & CreativeAuto-check passed
  • Beautify GitHub Readme

    oil-oil/beautify-github-readme

    Redesign GitHub README homepages or create project-native pure SVG, hybrid SVG-composed PNG/WebP, and opt-in animated GIF assets.

    1.8k GitHub stars~4.1k tokensUpdated 3 days ago
    DevelopmentAuto-check passed
  • Redesign GitHub README homepages or create standalone GitHub-safe SVG and animated GIF assets around a repository's real theme.

    106 GitHub starsUsed in 1 repo~3.2k tokens
    DevelopmentAuto-check passed
  • Social Preview

    thatrebeccarae/claude-marketing

    Generate Open Graph social preview images (1280x640) for GitHub repositories.

    162 GitHub stars~2.1k tokensUpdated 4 mo ago
    Marketing & SEOAuto-check passed
  • Ccfddl X Posts

    ccfddl/ccf-deadlines

    Prepare and, with a verified authenticated publishing route and authorization, publish daily conference-deadline countdown posts for @ccfddl on X/Twitter.

    9.4k GitHub stars~4.2k tokensUpdated today
    Media & CreativeAuto-check passed
  • Native Transparent Imagegen

    ZSeven-W/craft-skills

    Generate new raster assets that must contain native pixel transparency, then verify the untouched PNG or WebP before delivery.

    223 GitHub starsUsed in 2 repos~1.1k tokens
    Media & CreativeAuto-check passed

More from ReScienceLab/opc-skills

All 9 skills in this repo
  • SEO Geo

    ReScienceLab/opc-skills

    SEO & GEO (Generative Engine Optimization) for websites. An agent skill from ReScienceLab/opc-skills.

    1.8k GitHub starsUsed in 4 repos~2.1k tokens
    Auto-check passed
  • Nanobanana

    ReScienceLab/opc-skills

    Generate and edit images using Google Gemini 3 Pro Image (Nano Banana Pro).

    1.8k GitHub starsUsed in 1 repo~1.3k tokens
    Auto-check passed
  • Logo Creator

    ReScienceLab/opc-skills

    Create logos using AI image generation. An agent skill from ReScienceLab/opc-skills.

    1.8k GitHub stars~1.5k tokensUpdated yesterday
    Auto-check passed
  • Producthunt

    ReScienceLab/opc-skills

    Search and retrieve content from Product Hunt. An agent skill from ReScienceLab/opc-skills.

    1.8k GitHub stars~467 tokensUpdated yesterday
    Auto-check passed
  • Reddit

    ReScienceLab/opc-skills

    Search and retrieve content from Reddit. An agent skill from ReScienceLab/opc-skills.

    1.8k GitHub stars~516 tokensUpdated yesterday
    Auto-check passed
  • Twitter

    ReScienceLab/opc-skills

    Search and retrieve content from Twitter/X. An agent skill from ReScienceLab/opc-skills.

    1.8k GitHub stars~702 tokensUpdated yesterday
    Auto-check passed

Questions about Banner Creator

What does Banner Creator do?

Create banners using AI image generation. An agent skill from ReScienceLab/opc-skills. Banner Creator is an agent skill from ReScienceLab/opc-skills. Create banners using AI image generation.

When should I use Banner Creator?

Banner Creator fits situations like: user wants to create a banner; tasks that involve Image generation; tasks that involve Social media graphics.

How do I install Banner Creator in Claude Code?

Run `npx skills add ReScienceLab/opc-skills --skill banner-creator -a claude-code`. Or copy the skill folder (skills/banner-creator in ReScienceLab/opc-skills) into .claude/skills/banner-creator in your project. Claude Code loads it when a task matches its description.

How do I install Banner Creator in Codex?

Run `npx skills add ReScienceLab/opc-skills --skill banner-creator -a codex`. Or copy the skill folder (skills/banner-creator in ReScienceLab/opc-skills) into .agents/skills/banner-creator in your project. Codex loads it when a task matches its description.

Can I use Banner Creator in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add ReScienceLab/opc-skills --skill banner-creator -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/banner-creator, .gemini/skills/banner-creator, .github/skills/banner-creator and .opencode/skills/banner-creator in your project.

What does Banner Creator need to run?

Going by SKILL.md and its folder, Banner Creator needs Python for the scripts in its folder, the command-line tools its instructions call (python3) and credentials named GEMINI_API_KEY. Our summary lists: Python 3; A credential in GEMINI_API_KEY.

Does Banner Creator access the network?

SKILL.md names 1 domain. As links in the text: aistudio.google.com. This is read from the text; nothing was executed.

Is Banner Creator safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Banner Creator use?

Banner Creator is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Banner Creator use?

About 1.3k tokens (SKILL.md is roughly 5.4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 593 tokens, read only when the agent opens those files.

What are the alternatives to Banner Creator?

Skills that share tags, products or a category with Banner Creator: Web Asset Generator (alonw0/web-asset-generator, 512 stars), Beautify GitHub Readme (oil-oil/beautify-github-readme, 1.8k stars), Beautify GitHub Readme (Zergie/YAMMU, 106 stars) and Social Preview (thatrebeccarae/claude-marketing, 162 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Banner Creator?

ReScienceLab (a GitHub organization) maintains it in ReScienceLab/opc-skills, which has 1,843 GitHub stars. The repository holds 9 skills in this directory. The repository was last updated on October 6, 2026.

Source: ReScienceLab/opc-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.