Skills real projects publish on GitHub, most starred first. Each one says what it will make an agent do before you copy it.
leadgenjaySkillleadgenjay/claude-skills/skills/senior-frontend/SKILL.md
Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features, optimizing performance, implementing UI/UX designs, managing state, or reviewing frontend code.
tsukhaniSkilltsukhani/jclaw/skills/frontend-design/SKILL.md
Provides distinctive, opinionated visual design guidance for building UIs that avoid templated defaults through deliberate aesthetic choices.
daymadeSkilldaymade/claude-code-skills/frontend-visual-qa/SKILL.md
Audits already-rendered UI — web app, deck/slide, dashboard, design-system, or Electron/native app — via real-browser/native-app journeys and a Playwright sweep. Use after UI implementation to find typography, overflow, responsive, routing, data-viz, browser-output, or native-shell defects, or to compare a render against a reference. Not for greenfield UI design (use ui-designer) or QA-program setup (use qa-expert).
Hassaan146SkillHassaan146/claude-skills/senior-frontend/SKILL.md
Frontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications. Use when building React components, optimizing Next.js performance, analyzing bundle sizes, scaffolding frontend projects, implementing accessibility, or reviewing frontend code quality.
minh2004pdSkillminh2004pd/chatbotfullpipeline/.claude/skills/deploy-frontend/SKILL.md
Build frontend and deploy to S3 + CloudFront. Run manually from local machine when you want to deploy without waiting for CI. Requires AWS credentials and CF_DISTRIBUTION_ID env var.
ulises-jeremiasSkillulises-jeremias/agent-toolkit/skills/design/frontend-design/SKILL.md
Guidance for distinctive, intentional visual design when building new UI or reshaping an
enze00Skillenze00/uniapp-frontend-skills/SKILL.md
uni-app cross-platform frontend development with Vue 3 + TypeScript. Use for: (1) Creating new uni-app projects or pages, (2) Integrating UI libraries (uView Plus, uni-ui, TuniaoUI), (3) Implementing multi-theme design systems, (4) Building WeChat Mini Programs, H5, and other platforms, (5) Setting up SCSS theming and global styles, (6) Configuring Vite build system. Includes reusable templates, component patterns, and best practices applicable to any uni-app project.
maikCyphlockSkillmaikCyphlock/skills/styles/SKILL.md
Designer-turned-developer who crafts stunning UI/UX even without design mockups
mariano-agueroSkillmariano-aguero/claude-code-config/.claude/skills/web3/SKILL.md
Web3 frontend integration with Viem, Wagmi, and Reown AppKit for Ethereum dApps. Use when building blockchain-connected UIs, implementing wallet connections, reading/writing smart contracts, or handling transactions. Triggers on tasks involving Viem clients, Wagmi hooks, Reown/RainbowKit configuration, multicall, or ERC-20/ERC-721 interactions.
NzettodessSkillNzettodess/Awesome-Agent-Skills/Skills/Frontend/frontend-ui-ux/SKILL.md
Designer-turned-developer who crafts stunning UI/UX even without design mockups
seanmcgarySkillseanmcgary/claude-skills/ship-frontend/SKILL.md
Use when taking a frontend/UI feature from idea or spec all the way to a review-ready pull request in a repo, without a driving GitHub issue. Same pipeline as ship-feature, with the frontend profile (visual verification, design review, accessibility) pinned.
Skeln-ioSkillSkeln-io/skillkit/skills/frontend-eval/SKILL.md
Frontend design evaluator — audit current components and guide redesigns using your brand's design system. Brand-aware — reads design tokens and aesthetic from brand config.
talgacapriSkilltalgacapri/pm-os/.claude/skills/test-frontend/SKILL.md
Write, review, and audit frontend tests for a React + Vitest + Playwright codebase. Applies ISTQB CTFL v4.0 standards (black-box techniques, test pyramid, risk-based prioritization, defect taxonomy) combined with E2E-first philosophy and AAA structure. Triggers on "write tests", "test this component", "test coverage", "Playwright", "Vitest", "RTL", "E2E for", or any request to write or review React/frontend tests.
wangxiaohuiboySkillwangxiaohuiboy/lean-agent-skills/skills/frontend-a11y/SKILL.md
Audit and fix web accessibility to WCAG 2.2 AA with a practical, ordered pass over keyboard access, names and roles, focus, contrast, forms, and motion. Use when shipping UI, reviewing a component, or when a user reports that something cannot be reached or read. Not for native desktop or mobile app accessibility.
wangxiaohuiboySkillwangxiaohuiboy/lean-agent-skills/skills/frontend-perf/SKILL.md
Diagnose and fix front-end performance with a measure-first loop covering Core Web Vitals, bundle size, and render cost. Use when a page is slow, a bundle grew, INP or LCP regressed, or before shipping a performance-sensitive change. Not for backend or database performance.
zwy123zwySkillzwy123zwy/agent/skills/frontend-algo/SKILL.md
前端面试之算法与手写。考查常见算法（数组、字符串、链表等）及手写实现题。适用于考我算法、手写题、前端算法 面试时调用。
zwy123zwySkillzwy123zwy/agent/skills/frontend-html/SKILL.md
前端面试之 HTML/CSS。考查语义化、盒模型、BFC、Flex/Grid、居中、响应式、CSS 变量、动画等。适用于考我 HTML、考我 CSS、前端面试 CSS 时调用。
LeonxlnxSkillLeonxlnx/taste-skill/skills/imagegen-frontend-web/SKILL.md
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 palette across all images. Optimized for landing pages, marketing sites, and product comps that developers or coding models can accurately recreate.
LeonxlnxSkillLeonxlnx/taste-skill/skills/taste-skill/SKILL.md
Anti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable, audit-first on redesigns, strict pre-flight check.
alebgl77Skillalebgl77/claude-inc/skills/frontend-design/SKILL.md
Writes production-grade, distinctive interface code — one strong art direction (editorial, brutalist, soft-depth, retro-terminal), a real typographic scale, custom details (cursor, selection, focus states), semantic HTML, delivered as a single file or as components. Ships with an anti-AI-slop checklist so nothing leaves looking template-made. Use when the user says "build this page", "code the UI", "make me a beautiful front-end", or "this looks like every AI site — redo it".
A folder with a SKILL.md file: a name, a description of when to use it, and instructions. Claude loads a skill only when the task matches its description.
Copy the folder into your project's .claude/skills/ directory, or into your own skills folder to use it everywhere.
We read each file for commands that read secrets, delete things or pipe downloads into a shell, and say so before you copy it. No warning is not a promise that a file is safe.
Open a skill to see its discussion. Reports from people and their agents are coming.
