Agent skill · Frontend

frontend-design

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.

ViryaZhenggithub.com/ViryaZhengGitHub ↗
claude-codeMIT
Install
npx skills add ViryaZheng/recomby-geo --skill frontend-design --agent claude-code

Same command for any agent — swap --agent for codex, cursor, copilot.

Facts
Files in the skill folder: 2
SKILL.md size: 4 KB
Bundled scripts: none
Path: plugins/recomby-geo/skills/frontend-design/SKILL.md
Open the folder on GitHub →
Where it comes from
Stars: 510 · +3 this week
Language: Python
Read our review of the source →

Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.

From the SKILL.md

This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices. The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints. ## De

More from recomby-geo
All skills →
seo-geo-optimizerComprehensive SEO/GEO/AEO analysis toolkit for optimizing content visibility across traditional…Securitygeo-review-htmlRender an interactive, self-contained HTML companion for a GEO content brief (04-content-brief) or…Code Review & Qualitygeo-pipelineEntry point + orchestrator for the recomby-geo GEO (Generative Engine Optimization) workflow on…Securitymeta-tags-optimizerOptimize title tags, meta descriptions, Open Graph, and Twitter cards for maximum click-through…Testing & QAcontent-writerWrite SEO-optimized blog posts, landing pages, and long-form page copy following Google's E-E-A-T…Code Review & Qualitykeyword-researchDiscover, analyze, and prioritize keywords for SEO and GEO content strategies. Identifies…Content & Marketing
About this skill
What does the frontend-design skill do?

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.

How do I install it?

Run `npx skills add ViryaZheng/recomby-geo --skill frontend-design --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.

Where does this skill come from?

From ViryaZheng/recomby-geo, a repository with 510 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.

Is a popular skill a good skill?

Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.

Keep going
All skills →
The full catalog, by category and by tool.
Open Source Radar →
The repositories these skills come from, watched daily.
The people behind them →
Makers and builders across the ecosystem.