Claude skills and agent skills

QinghongLinSkill

frontend-design

QinghongLin/data2story-skill/skills/frontend-design/SKILL.md

Reusable UI/visual-design system for building polished, distinctive, multimedia-rich self-contained HTML stories. A shared reference library that the Data2Story Designer and Programmer borrow from so every blog looks intentional and editorial rather than generic. Not a pipeline stage — a design source.

Often used withbrief-to-tasks·file-reading·albert-dm

rongxinzySkill

frontend-design

rongxinzy/RongxinAI/SKILLs/frontend-design/SKILL.md

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.

Often used withbrief-to-tasks·file-reading·albert-dm

zeuikliSkill

frontend-design

zeuikli/claude-code-workspace/.claude/skills/frontend-design/SKILL.md

引導 Claude 產出高品質的前端設計，避免 AI 生成的通用風格（AI slop）。包含字型、色彩、動態、背景的設計指引。

Often used withbrief-to-tasks·file-reading·albert-dm

exelearningSkill

frontend-module

exelearning/exelearning/.agents/skills/frontend-module/SKILL.md

Change vanilla JavaScript UI modules in public/app/, including DOM state, events and localization.

hamzafarooqSkill

frontend-slides

hamzafarooq/claude-code-starter/.claude/skills/frontend-slides/SKILL.md

Create stunning, animation-rich single-file HTML presentations from scratch or by converting a PowerPoint (.pptx) file. Use when the user wants to build a presentation, convert a PPT to web format, or create slides for a talk, pitch, or demo. Shows 3 visual style previews before building the full deck — no design experience needed.

Often used witheverything-claude-code·everything-claude-code-conventions·nextjs-turbopack

vstorm-coSkill

frontend-feature

vstorm-co/agenticos/.claude/skills/frontend-feature/SKILL.md

Build or change a page, view or data-driven feature in the Next.js frontend — a route under the dashboard, wiring UI to a backend endpoint, a Zustand store, a permission that must hide a control, or localized copy. Use for any work in frontend/src, including "the page renders but shows an empty state" and "this button should not be visible to a Viewer".

happycapy-aiSkill

frontend-slides

happycapy-ai/Happycapy-skills/skills/frontend-slides/SKILL.md

Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual exploration rather than abstract choices.

Often used witheverything-claude-code·everything-claude-code-conventions·nextjs-turbopack

DongDuong2001Skill

frontend-code

DongDuong2001/pudo-code-system/skills/code/frontend/SKILL.md

Frontend architecture, UI/UX implementation, and web performance

lza6Skill

frontend-ui-ux

lza6/claw-code-tingfeng/skills/frontend-ui-ux/SKILL.md

Designer-developer for UI/UX work

luongnv89Skill

frontend-design

luongnv89/skills/skills/frontend-design/SKILL.md

Build production-grade frontend interfaces with distinctive aesthetics and working code. Use for UI components, pages, or frontend features. Don't use for backend/API work or usability-only audits.

Often used withbrief-to-tasks·file-reading·albert-dm

xenitV1Skill

frontend-design

xenitV1/Antigravity-Workflows/skills/frontend-design/SKILL.md

Design thinking and decision-making for web UI. Use when designing components, layouts, color schemes, typography, or creating aesthetic interfaces. Teaches principles, not fixed values.

Often used withbrief-to-tasks·file-reading·albert-dm

pwndocSkill

test-frontend-e2e

pwndoc/pwndoc/.claude/skills/test-frontend-e2e/SKILL.md

Generates Playwright E2E specs for PwnDoc. Tests run against the full stack (frontend + backend + MongoDB) with pre-authenticated browser sessions. Run with ./pwndoc-cli test --frontend-e2e.

Ilm-AlanSkill

frontend-design

Ilm-Alan/frontend-design/SKILL.md

Build a frontend with a deliberate visual direction held through palette, typography, structure, and texture, with on-screen strings that name real information rather than fabricated demo data or filler labels. Use when building or restyling a frontend.

Often used withbrief-to-tasks·file-reading·albert-dm

avibebuilderSkill

frontend-design

avibebuilder/claude-prime/.claude/skills/frontend-design/SKILL.md

Builds distinctive, production-grade UIs that avoid generic AI aesthetics. Use whenever the user wants to build, restyle, or give visual direction to any interface — pages, dashboards, landing pages, components, onboarding flows, mobile screens, or design systems — even without an explicit 'design' request. Also triggers for: picking an aesthetic direction, improving the look of a dull/generic existing page, adding visual personality, or choosing colors/typography. Includes a bundled design intelligence database for concrete guidance across web (React, Next.js, Vue, Tailwind) and mobile (React Native, Flutter, SwiftUI).

Often used withbrief-to-tasks·file-reading·albert-dm

itseffiSkill

frontend-design

itseffi/agentic-os/.agents/skills/frontend-design/SKILL.md

Design implementation-ready frontend solutions with UX intent, component structure, responsive behavior, accessibility, and handoff criteria.

Often used withbrief-to-tasks·file-reading·albert-dm

butterbase-aiReads credentialsSkill

journey-frontend

butterbase-ai/butterbase-plugin/skills/journey-frontend/SKILL.md

Use as the frontend build stage of the Butterbase journey. Implements the Frontend section of 02-plan.md by delegating to deploy-frontend. Scaffolds (if needed) and deploys via create_frontend_deployment + manage_frontend (start_deployment). Sets VITE_API_URL and VITE_APP_ID env. Skipped if the plan is API-only.

actionow-aiSkill

frontend-brand

actionow-ai/frontier/skills/frontend-brand/SKILL.md

为已有前端项目做品牌视觉交付：Logo 生图提示词包（prompt 交付，用户自选模型生图）、OG 社交分享图（1200x630 代码渲染）、Landing page 设计（调度 graphite landing 骨架）。当用户说「做个 logo」「设计 logo」「生成 OG 图/分享图」「做落地页/landing」「品牌视觉」时触发。基于项目既有设计体系提取品牌基因（brand-profile.md），不凭空设计。与 brandkit（纯出图引擎）分工：本 skill 交付工程集成的 prompt 包与代码产物，需要直接生成品牌板图片时可转 brandkit。

GladiarnReads credentialsSkill

glad-frontend

Gladiarn/Glad-Personal/skills/glad-frontend/SKILL.md

Make frontend UI backend-ready by construction — no hardcoded display data anywhere, everything flows through state backed by a swappable mock/real data layer via a repository pattern, with loading/error/empty states genuinely exercised. This skill owns data architecture only, never visual design — pair it with frontend-design/impeccable/web-design-guidelines (or whatever design skill is active) for how the UI should look. Use whenever the user asks to build a new page, component, table, list, dashboard, or form before a backend/API exists, wants the frontend "ready to plug in the backend later," or is scaffolding UI ahead of API availability.

skyelan1999Skill

aide-frontend

skyelan1999/aide/.agents/skills/aide-frontend/SKILL.md

Implement or inspect Aide browser UI, settings, styles, accessibility, localization, and file viewers. Load for frontend or visual interaction changes.

Zenobia000Skill

frontend-spec

Zenobia000/agent-skills-starter/.claude/skills/frontend-spec/SKILL.md

為有 UI 的規格產出前端規格書與 Pencil 設計稿：路由表、每頁 design brief、四態畫面（Loading/Empty/Error/Success）的 .pen mockup。在 /to-spec 之後、/to-tickets 之前跑，可選。