14,074 tagged Frontend, measured the same way as everything else here.
Browse within: skills 136agent 125agentic-ai 98javascript 95LLM 86nextjs 79agents 62design-system 62cli 56copilot 54agentic 49claude-code-plugin 45chatgpt 43open-source 42
Skill Claude Code
Frontend design conventions for {{ projectname }} -- layout hierarchy, spacing, typography, anti-slop rules. Auto-activates when creating or modifying templates, CSS, or frontend components.
Skill Claude Code
Use when building React components with @n4s/xcomponent, converting MobX observer/useEffect code to X, X.useState, Value, Value.Async, Value.Boxed, Value.Bool, lifecycle hooks, observable props, or component composition with .with().
yinyucheng0601/pto-design-system
Skill Claude CodeCodex
A set of rules for building or changing PTO pages with shared layouts, design tokens, components, and patterns. A design system is a reusable collection of interface rules and building blocks.
HelenSong/AI-Explorer-Lab-skill
Skill Claude CodeCodex
Use when building AI Explorer Lab or AI+PBL course HTML pages that need a landing page, five module pages, and a certificate page with inquiry-based interactions and a consistent claymorphism visual system.
newsun-boki/literature-gallery-skill
Skill Codex
Create and maintain lightweight static literature-management gallery websites for academic papers. Use when the user wants a paper library, literature gallery, research database frontend, paper cards with covers/teasers, tags such as year/venue/area/keywords, paper detail pages, real paper cover screenshots, or…
tbshiki/260704kansaiwordpressmeetup
Skill Codex
Use when Codex needs to create or update WordPress Playground fixed-page layouts, front page layouts, landing pages, or page block HTML without changing theme files. Triggers on requests for front page layout, page layout creation, block HTML page sections, setting a page as the homepage, publishing a layout to a…
demoniksem/superpowers-hermes-skills
Skill Claude CodeCodex
Senior UI/UX Engineer. Architect digital interfaces overriding default LLM biases. Enforces metric-based rules, strict component architecture, CSS hardware acceleration, and balanced design engineering.
verygoodsecurity/collect-js-react
Skill Claude CodeCodex
Help VGS customers integrate, implement, migrate, troubleshoot, or review the public @vgs/collect-js-react wrapper. Use when users ask to add VGS Collect to React apps, create cards with Card Management Platform through VGSCollectSession, configure VGSCollectSession or VGSCollectForm, render secure React field…
Skill Claude CodeCodex
Orchestrates the safe, reliable integration of third-party libraries (TailwindCSS, Angular Material, NgRx, etc.) into an Angular project. Generates and uses standardized llms.txt documentation files for accurate context and prevents hallucinated commands.
vanessamarely/ai-playbook-reposito
Skill Claude CodeCodex
Audit React components for WCAG 2.2 compliance and suggest fixes. Use when the user wants an accessibility review of existing React component code (as opposed to running automated CI checks or building new components).
Staxing799/ui-page-generation-skills
Skill Claude CodeCodex
Orchestrate high-quality front-end page generation from short product prompts. Use when Codex needs a single main skill that coordinates UI structure, visual hierarchy, and natural product copy for landing pages, dashboards, app screens, workspaces, settings pages, analytics views, tables, and similar interfaces.
Skill Claude CodeCodex
A coding workflow for implementing both back-end and front-end tasks from a shared task-splitting file. It follows each part of the existing project’s coding rules and labels AI-generated code.
Skill Claude Code
Generate favicon.ico and a complete icon set from a source PNG. Optimised for Next.js App Router but works for any web project.
gyh333/element-plus-vue3-skill
Skill Claude CodeCodex
Build, modify, review, or troubleshoot production Vue 3 applications that use Element Plus. Use for Element Plus installation with pnpm-first setup, Vite auto-import configuration, component implementation, enterprise admin systems such as OA, MES, CRM, CMS, ERP, commerce/mall, forms, tables, dialogs, drawers…
itsdishant/senior-angular-architect
Skill Claude CodeCodex
Senior Angular architecture guidance for enterprise Angular applications. Use when an AI agent needs to design, review, optimize, secure, test, migrate, or govern Angular applications, including standalone-first architecture, signals, RxJS, NgRx/ComponentStore, SSR, zoneless readiness, module boundaries, and…
Skill Codex
Integrate and use argon-router in React web applications with Effector. Use when tasks involve creating routes and routers, wiring RouterControls/history adapters, composing routes with chainRoute/group/createVirtualRoute, rendering views with RouterProvider/createRoutesView/Outlet, building links with Link/useLink…
Skill Claude CodeCodex needs its repo
Write, configure, migrate, and review modern Tailwind CSS v4 (CSS-first) in any stack or none — framework-agnostic, examples are plain HTML + CSS/SCSS. Use whenever setting up Tailwind, doing a v3->v4 migration (@tailwind->@import, JS config->@theme), defining a reusable design-token / color system + dark mode via…
Skill Codex
Assist HBuilderX and uni-app project development with the local HBuilderX CLI. Use when Codex or another AI agent needs to locate HBuilderX cli.exe from common Windows install paths, inspect uni-app or uni-app x projects, run or publish to Web/H5, mini program, App Android/iOS/Harmony targets, collect logs, list…
Skill Codex
Translates Figma designs into production-ready application code with 1:1 visual fidelity. Use when implementing UI code from Figma files, when user mentions "implement design", "generate code", "implement component", provides Figma URLs, or asks to build components matching Figma specs. For Figma canvas writes via…
Skill Claude CodeCodex
Implements "Architectural Constructional Interface Design" (ACID) — the dark, technical-blueprint/engineering-schematic UI aesthetic used by dev portfolios and component registries such as chanhdai.com (full-bleed hairline rules, diagonal-stripe section dividers, bordered panel grids with persistent vertical rail…
shahid0/mobile-development-ai-skills
Skill Codex
Quality-first agy UI operator for rough user intent: inspect product/code context, gather web or pwm research when useful, write decisive creative briefs, run agy, review harshly, and refine until the visible Flutter, SwiftUI, or web UI is genuinely strong. Use for premium UI generation, redesigns, design systems…
Indium-AI-Labs/indium-agentkit
Skill Claude CodeCodex
Audit user interfaces for WCAG 2.1/2.2 AA/AAA conformance, ARIA semantics, keyboard operability, screen reader compatibility, and color contrast.
Skill Claude CodeCodex
This is a Vue performance best practices knowledge base optimized for AI coding assistants.
scania-digital-design-system/tegel-ui-skills
Skill Claude CodeCodex
Install, integrate, and avoid the gotchas of @scania/tegel-lite. Use when adopting tegel-lite in a new project, debugging "why does this look broken?" symptoms, or porting Tegel-Lite conventions. Covers the -tag CSS loading pattern (bundlers like Lightning CSS / Turbopack reject the package's CSS), the copy-tegel.mjs…
At most 3 mods per repository are shown here, and a mod shipped inside a plugin is left to that plugin's page — the rest are on their repository pages: