Agent skill

Imagegen Frontend Web

by caorushizi in caorushizi/oss-client

Elite frontend image-direction skill for generating premium, conversion-aware website design references.

No licenceAuto-check passedFrontend & Design

Install Imagegen Frontend Web

skills CLI
$ npx skills add caorushizi/oss-client --skill imagegen-frontend-web -a claude-code

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

GitHub CLI
$ gh skill install caorushizi/oss-client imagegen-frontend-web --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/caorushizi/oss-client.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/imagegen-frontend-web .claude/skills/imagegen-frontend-web && 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
imagegen-frontend-web
GitHub stars
113
Used in
14 other repos
Token cost
~9.2k tokens
SKILL.md length
4,994 words
Files
1
Skills in repo
8
Repo updated
First seen
Licence
None found

At a glance

Elite frontend image-direction skill for generating premium, conversion-aware website design references.

  • Works in 12 steps: ACTIVE BASELINE CONFIGURATION → THE COMBINATORIAL VARIATION ENGINE → FRONTEND REFERENCE RULE → …
  • Tasks that involve Landing pages
  • SKILL.md covers 1. ACTIVE BASELINE CONFIGURATION, 2. THE COMBINATORIAL VARIATION…, 3. FRONTEND REFERENCE RULE and 4. HERO MINIMALISM RULES, plus 1 more section
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Imagegen Frontend Web is an agent skill from caorushizi/oss-client. Elite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing page with 8 sections produces 8 images. Never compress multiple sections into one image. Enforces composition variety (not always left-text / right-image), background-image freedom, varied CTAs, varied hero scales (giant / mid / mini minimalist), narrative concept spine, second-read moments, and a single consistent…

Its SKILL.md is about 9.2k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Landing pages and Image generation. The repository describes itself as: 七牛云文件仿百度网盘文件夹管理,上传下载,删除。七牛云存储,七牛云图床。桌面应用程序 windows mac.

When your agent uses it

  • Tasks that involve Landing pages
  • Tasks that involve Image generation

Example prompts

  • “/imagegen-frontend-web”

Workflow steps

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

  1. ACTIVE BASELINE CONFIGURATION
  2. THE COMBINATORIAL VARIATION ENGINE
  3. FRONTEND REFERENCE RULE
  4. HERO MINIMALISM RULES
  5. IMAGE COUNT & PAGE SLICING
  6. CREATIVITY ESCALATION RULE
  7. IMAGE-FIRST ART DIRECTION
  8. ANTI-AI-SLOP RULES
  9. TYPOGRAPHY-FIRST DISCIPLINE
  10. SECTION RHYTHM RULE
  11. COMPONENT EXECUTION GUIDELINES
  12. DENSITY & SPACING DISCIPLINE

What it can do on your machine

Read from SKILL.md and the folder at commit 6950030. 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

    No scripts in the folder and no shell commands in SKILL.md.

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

  • Network

    No URLs in SKILL.md.

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

  • Credentials

    Names no API keys, tokens, secrets or passwords.

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

Context cost

Imagegen Frontend Web loads about 9.2k tokens when it runs. Until then it costs about 171 tokens; SKILL.md has 4,994 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~171
When it runs · the whole SKILL.md, loaded when a task matches
~9.2k

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); files beside SKILL.md are not scanned.

SKILL.md

Without a licence we can't republish the file, so here is its outline and opening line. It has 4,994 words (~9,195 tokens).

“Generate one separate horizontal image PER section. Always. No exceptions.”

— opening of SKILL.md by caorushizi
name
imagegen-frontend-web

Read the full SKILL.md on GitHub

Files

Just SKILL.md in .agents/skills/imagegen-frontend-web of caorushizi/oss-client.

Open the folder on GitHubat commit 6950030

Used in 14 other repositories

We found 16 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 14 other GitHub owners. This page covers the copy in caorushizi/oss-client, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Imagegen Frontend Web 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.

Imagegen Frontend Web compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Imagegen Frontend Web this skillcaorushizi/oss-client11314 repos~9.2kAutomated safety check: PassNone
Ky Design To HTMLKyrieCheungYep/ky-design-to-html-skill163—~2.8kAutomated safety check: PassNone
Creating Oneshot Landing Pagesnroadley/Creating-Oneshot-Hero-Landing-Pages134—~3.5kAutomated safety check: PassMIT
Open Design Landingsanqiufong/slides-from-anything1321 repos~3.3kAutomated safety check: PassApache-2.0
Omd Mediakwakseongjae/oh-my-design531—~1.1kAutomated safety check: PassMIT
Fal Redesignfal-ai-community/skills249—~1.4kAutomated safety check: PassMIT

Similar skills

  • Ky Design To HTML

    KyrieCheungYep/ky-design-to-html-skill

    Convert visible UI references such as screenshots, exported mockups, Figma frame images, SaaS empty states, dashboards, and landing page screenshots into high-quality HTML/CSS by decomposing layout…

    163 GitHub stars~2.8k tokensUpdated 4 mo ago
    Frontend & DesignAuto-check passed
  • Creating Oneshot Landing Pages

    nroadley/Creating-Oneshot-Hero-Landing-Pages

    Designs and builds video-driven parallax hero landing pages with smooth video scrubbing, progress-locked typography, and clean navigation.

    134 GitHub stars~3.5k tokensUpdated 1 mo ago
    Frontend & DesignAuto-check passed
  • Open Design Landing

    sanqiufong/slides-from-anything

    Produce a world-class single-page editorial landing site in the Atelier Zero visual language (Monocle / Apartamento / Études editorial collage) — the same aesthetic Open Design uses for its own…

    132 GitHub starsUsed in 1 repo~3.3k tokens
    Frontend & DesignAuto-check passed
  • Omd Media

    kwakseongjae/oh-my-design

    Brand-consistent asset sets from DESIGN.md — hero, section illustrations, icon sets, OG image — generated through whichever channel the user actually has (grok build imagegen, Codex $imagegen…

    531 GitHub stars~1.1k tokensUpdated 7 days ago
    Frontend & DesignAuto-check passed
  • Fal Redesign

    fal-ai-community/skills

    Upgrade a coded website to award-tier, editorially-crafted design using fal.ai.

    249 GitHub stars~1.4k tokensUpdated 9 days ago
    Frontend & DesignAuto-check passed
  • AI Image Creative Direction

    dylanfeltus/skills

    Gives prompt templates, a model-selection guide and anti-generic rules for AI-generated visuals: hero images, feature illustrations, OG cards, icons and backgrounds.

    179 GitHub stars~2.6k tokensUpdated 21 days ago
    Media & CreativeAuto-check passed

More from caorushizi/oss-client

All 8 skills in this repo
  • Full Output Enforcement

    caorushizi/oss-client

    Overrides default LLM truncation behavior. An agent skill from caorushizi/oss-client.

    113 GitHub starsUsed in 13 repos~646 tokens
    Auto-check passed
  • Design Taste Frontend

    caorushizi/oss-client

    Anti-slop frontend skill for landing pages, portfolios, and redesigns.

    113 GitHub starsUsed in 22 repos~22k tokens
    Auto-check passed
  • Image To Code

    caorushizi/oss-client

    Elite website image-to-code skill for Codex. An agent skill from caorushizi/oss-client.

    113 GitHub starsUsed in 11 repos~9.1k tokens
    Auto-check passed
  • Design Taste Frontend V1

    caorushizi/oss-client

    The original v1 taste-skill, preserved for projects depending on its exact behavior.

    113 GitHub starsUsed in 9 repos~5.3k tokens
    Auto-check passed
  • High End Visual Design

    caorushizi/oss-client

    Teaches the AI to design like a high-end agency. An agent skill from caorushizi/oss-client.

    113 GitHub starsUsed in 14 repos~2.6k tokens
    Auto-check passed
  • Industrial Brutalist UI

    caorushizi/oss-client

    Raw mechanical interfaces fusing Swiss typographic print with military terminal aesthetics.

    113 GitHub starsUsed in 14 repos~2.1k tokens
    Auto-check passed

Questions about Imagegen Frontend Web

What does Imagegen Frontend Web do?

Elite frontend image-direction skill for generating premium, conversion-aware website design references. Imagegen Frontend Web is an agent skill from caorushizi/oss-client. Elite frontend image-direction skill for generating premium, conversion-aware website design references.

When should I use Imagegen Frontend Web?

Imagegen Frontend Web fits situations like: tasks that involve Landing pages; tasks that involve Image generation.

How do I install Imagegen Frontend Web in Claude Code?

Run `npx skills add caorushizi/oss-client --skill imagegen-frontend-web -a claude-code`. Or copy the skill folder (.agents/skills/imagegen-frontend-web in caorushizi/oss-client) into .claude/skills/imagegen-frontend-web in your project. Claude Code loads it when a task matches its description.

How do I install Imagegen Frontend Web in Codex?

Run `npx skills add caorushizi/oss-client --skill imagegen-frontend-web -a codex`. Or copy the skill folder (.agents/skills/imagegen-frontend-web in caorushizi/oss-client) into .agents/skills/imagegen-frontend-web in your project. Codex loads it when a task matches its description.

Can I use Imagegen Frontend Web 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 caorushizi/oss-client --skill imagegen-frontend-web -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/imagegen-frontend-web, .gemini/skills/imagegen-frontend-web, .github/skills/imagegen-frontend-web and .opencode/skills/imagegen-frontend-web in your project.

What does Imagegen Frontend Web need to run?

SKILL.md names no scripts, command-line tools or credentials: Imagegen Frontend Web is instructions for the agent only.

Does Imagegen Frontend Web access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Imagegen Frontend Web 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. Review the folder before installing.

What licence does Imagegen Frontend Web use?

No licence was found for Imagegen Frontend Web or its repository. Without one, default copyright applies: ask the author before reusing or redistributing it.

How many tokens does Imagegen Frontend Web use?

About 9.2k tokens (SKILL.md is roughly 37k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Imagegen Frontend Web?

Skills that share tags, products or a category with Imagegen Frontend Web: Ky Design To HTML (KyrieCheungYep/ky-design-to-html-skill, 163 stars), Creating Oneshot Landing Pages (nroadley/Creating-Oneshot-Hero-Landing-Pages, 134 stars), Open Design Landing (sanqiufong/slides-from-anything, 132 stars) and Omd Media (kwakseongjae/oh-my-design, 531 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Imagegen Frontend Web?

caorushizi (a GitHub user) maintains it in caorushizi/oss-client, which has 113 GitHub stars. The repository holds 8 skills in this directory. The repository was last updated on September 7, 2026.

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