Skip to content

Skill catalog

867web & frontend agent skills synced from skills.sh, with their install counts. Read them here, or let your agent fetch the right one through the Graph-of-Skills MCP server.

Want your agent to use these? Set up Graph-of-Skills or get a free key. How these skills are sourced and what we check. Cannot find one? Your agent can write a skill for your own library. Have skills of your own? Install one on another machine. A skill that comes from GitHub shows its npx skills add command on its page.

  1. nextjs-react-typescript mindrally/skills

    Expert in TypeScript, Node.js, Next.js App Router, React, Shadcn UI, Radix UI and Tailwind

    5,242 installs
  2. high-perf-browser wondelai/skills

    Optimize web performance through network protocols, resource loading, and browser rendering internals. Use when the user mentions "my site is slow", "Core Web Vitals", "HTTP/2 or HTTP/3", "resource hints", "network late…

    5,239 installs
  3. answer-me-with-html qingyuna/answer-me-with-html

    Turns an answer into a one-page visual HTML explainer: the model writes a short Markdown draft and the bundled CLI builds one page. Use it proactively and liberally, without being asked, whenever a page would help the r…

    5,223 installs
  4. MUST activate whenever a uiBundles/*/src/ project reads, writes, or displays Salesforce data — INCLUDING building a page, list, table, card grid, dashboard, or form that shows, filters, counts, or edits records of any o…

    5,219 installs
  5. MUST activate when the project contains a uiBundles/*/src/ directory and the task involves creating or configuring a Custom Application for hosting a UI bundle in Lightning Experience. Use this skill when creating a Cus…

    5,213 installs
  6. motion-ui affaan-m/ecc

    Production-ready UI motion system for React/Next.js. Use when implementing animations, transitions, or motion patterns.

    5,205 installs
  7. angular-tooling analogjs/angular-skills

    DEPRECATED - this skill is unmaintained. Use the official Angular skills at https://github.com/angular/skills instead. Use Angular CLI and development tools effectively in Angular v20+ projects. Use for project setup, c…

    5,196 installs
  8. pixijs-rendering gamedev-skills/awesome-gamedev-agent-skills

    Build a PixiJS v8 render layer: create the async Application, load textures with Assets, compose the scene graph with Container and Sprite, drive the ticker loop, wire pointer events, and group draws with render groups.…

    5,195 installs
  9. 3d-web-experience sickn33/agentic-awesome-skills

    Use when building or debugging web 3D scenes, product configurators or portfolios with Three.js, React Three Fiber or Spline; review assets, loading, controls, fallbacks and performance.

    5,176 installs
  10. MUST activate when the project contains a uiBundles/*/src/ directory and the task involves uploading, attaching, or dropping files. Use this skill when adding file upload functionality to a UI bundle app. Provides progr…

    5,159 installs
  11. setup-multiplayer-services unity-technologies/skills

    Guides real-time online multiplayer with Unity Multiplayer Services. Use when the user asks about network topology, hosting, matchmaking, or session-based play such as rooms, parties, and lobbies, not backend features.

    5,104 installs
  12. event-landing-page samber/dev-event-organizer-skills

    Build a technical event's public front door and the small site around it - the page shape for the funding model (a ticketed event's single-CTA hero, or a free event's stats hero with no registration to sell), the sectio…

    5,091 installs
  13. MUST activate when the project contains a uiBundles/*/src/ directory (React or Angular) and the user wants to add a pre-built feature — such as authentication (login, logout, protected routes, session management) or sea…

    5,075 installs
  14. hairline-create lucasmarkes/hairline

    Use when someone asks for a new Hairline figure, or runs /hairline-create with an idea. Draws one isometric line figure that answers the pointer, in the style and on the engine of @lucasmarkes/hairline, and hands it ove…

    5,060 installs
  15. shopify-expert jeffallan/claude-skills

    Builds and debugs Shopify themes (.liquid files, theme.json, sections), develops custom Shopify apps (shopify.app.toml, OAuth, webhooks), and implements Storefront API integrations for headless storefronts. Use when bui…

    5,025 installs
  16. MUST activate when the project contains a uiBundles/*/src/ directory and the task involves creating or configuring site infrastructure. Use this skill when creating or configuring a Salesforce Digital Experience Site fo…

    5,007 installs
  17. Use this skill when the user asks to add, embed, integrate, configure, style, or remove an agent, chatbot, chat widget, conversation client, or AI assistant in a UI Bundle project (React or Angular). TRIGGER when: proje…

    4,979 installs
  18. nextjs-cache-architecture mohamed-hossam1/nextjs-skills

    Use this skill whenever the user wants to design or implement caching in a Next.js 16+ App Router project — setting up the "use cache" directive, building a cache tag registry, wiring mutations to invalidation utilities…

    4,959 installs
  19. tanstack-router tanstack-skills/tanstack-skills

    Type-safe routing for React and Solid applications with first-class search params, data loading, and seamless integration with the React ecosystem.

    4,942 installs
  20. premium-frontend-ui github/awesome-copilot

    A comprehensive guide for GitHub Copilot to craft immersive, high-performance web experiences with advanced motion, typography, and architectural craftsmanship.

    4,890 installs
  21. nextjs-performance giuseppe-trisciuoglio/developer-kit

    Expert Next.js performance optimization skill covering Core Web Vitals, image/font optimization, caching strategies, streaming, bundle optimization, and Server Components best practices. Use when optimizing Next.js appl…

    4,850 installs
  22. vue-patterns affaan-m/ecc

    Vue.js 3 Composition API patterns, component architecture, reactivity best practices, Pinia state management, Vue Router navigation, and Nuxt SSR patterns. Activates for Vue, Nuxt, Vite, or Pinia projects. Use when buil…

    4,826 installs
  23. react-navigation callstackincubator/agent-skills

    Provides React Navigation UI patterns for stacks, tabs, drawers etc. Use when building navigation UIs with React Navigation, configuring headers, bottom sheets or handling safe areas and insets.

    4,819 installs
  24. angular-architect jeffallan/claude-skills

    Generates Angular 17+ standalone components, configures advanced routing with lazy loading and guards, implements NgRx state management, applies RxJS patterns, and optimizes bundle performance. Use when building Angular…

    4,818 installs
  25. cmux-custom-sidebar manaflow-ai/cmux

    Build a custom cmux sidebar from a plain-language request. Use when the user asks for a custom sidebar, a sidebar that shows their workspaces/tabs/PRs/clock, a vibe-coded sidebar, or anything involving files in ~/.confi…

    4,808 installs
  26. frontend-design nexu-io/open-design

    Create distinctive, production-grade frontend interfaces with strong visual direction, polished typography, considered layout, and working HTML/CSS/JS or framework code. Use for websites, landing pages, dashboards, Reac…

    4,762 installs
  27. rails-expert jeffallan/claude-skills

    Rails 7+ specialist that optimizes Active Record queries with includes/eager_load, implements Turbo Frames and Turbo Streams for partial page updates, configures Action Cable for WebSocket connections, sets up Sidekiq w…

    4,728 installs
  28. react-patterns giuseppe-trisciuoglio/developer-kit

    Provides comprehensive React 19 patterns for Server Components, Server Actions, useOptimistic, useActionState, useTransition, concurrent features, Suspense boundaries, and TypeScript integration. Generates executable co…

    4,720 installs
  29. wp-playground wordpress/agent-skills

    Use as the WordPress Playground routing wrapper for ambiguous Playground work, local CLI runs with @wp-playground/cli, playground.wordpress.net share links, browser previews, WebMCP site tools, snapshots, mounts, versio…

    4,675 installs
  30. web-search brave/brave-search-skills

    USE FOR web search. Returns ranked results with snippets, URLs, thumbnails. Supports freshness filters, SafeSearch, Goggles for custom ranking, pagination. Primary search endpoint.

    4,672 installs
  31. Integrate Salesforce B2B Commerce open source components from GitHub into B2B Commerce stores. Use when users mention "integrate open code components", "open source B2B commerce", "add open code components", "forcedotco…

    4,627 installs
  32. i18n lobehub/lobehub

    Use for user-facing strings and react-i18next locale keys, namespaces, interpolation, translations or bun run i18n.

    4,620 installs
  33. browser-preview starchild-ai-agent/official-skills

    Preview panel and iframe diagnostics: registry, ports, paths, blank screens. Use when a preview tab is broken or missing (e.g. white screen, tab disappeared, 404 on assets, preview not loading, list running services).

    4,618 installs
  34. coss cosscom/coss

    Build with coss.com (transactional and marketing email, SMS, webhooks, Hooks and Risk) through its SDKs and API. Use when adding coss.com to a project or changing code that uses it, when the user mentions coss.com, the…

    4,616 installs
  35. storefront-best-practices medusajs/medusa-agent-skills

    ALWAYS use this skill when working on ecommerce storefronts, online stores, shopping sites. Use for ANY storefront component including checkout pages, cart, payment flows, product pages, product listings, navigation, ho…

    4,616 installs
  36. artifacts-builder composiohq/awesome-claude-skills

    Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or…

    4,599 installs
  37. clawdirect-dev napoleond/clawdirect

    Build agent-facing web experiences with ATXP-based authentication, following the ClawDirect pattern. Use this skill when building websites that AI agents interact with via MCP tools, implementing cookie-based agent auth…

    4,596 installs
  38. Replace OOTB (out-of-the-box) B2B Commerce components with open source equivalents in site metadata content.json files, or look up the equivalent open code `site:` component for OOTB definitions. Use when users mention…

    4,585 installs
  39. threejs-webgl freshtechbro/claudedesignskills

    Comprehensive skill for Three.js 3D web development. Use this skill when building interactive 3D scenes, WebGL/WebGPU applications, product configurators, 3D visualizations, or immersive web experiences. Triggers on tas…

    4,562 installs
  40. vue-expert jeffallan/claude-skills

    Builds Vue 3 components with Composition API patterns, configures Nuxt 3 SSR/SSG projects, sets up Pinia stores, scaffolds Quasar/Capacitor mobile apps, implements PWA features, and optimises Vite builds. Use when creat…

    4,469 installs
  41. pixijs-html-source pixijs/pixijs-skills

    Use this skill when rendering live HTML/DOM elements (or frozen snapshots of them) as PixiJS v8 textures via the EXPERIMENTAL HTML-in-Canvas browser APIs. Covers the pixi.js/html-source import, feature detection with ca…

    4,464 installs
  42. site-launch-checklist samber/cc-skills

    Pre-launch checklist for shipping a new website or web app. Scope: analytics (GA4, PostHog, Google Search Console, Ahrefs), DNS, TLS and backups, legal and CNIL/GDPR compliance, security headers, SEO and GEO (robots.txt…

    4,435 installs
  43. chrome-extension samber/cc-skills

    Build Chrome extensions with Manifest V3. Use this skill whenever the user mentions Chrome extension, browser extension, manifest.json, content script, service worker (in extension context), popup, side panel, chrome.ru…

    4,379 installs
  44. tanstack-form tanstack-skills/tanstack-skills

    Headless, performant, and type-safe form state management for TS/JS, React, Vue, Angular, Solid, Lit, and Svelte.

    4,335 installs
  45. i18n-localization sickn33/agentic-awesome-skills

    Internationalization and localization patterns. Detecting hardcoded strings, managing translations, locale files, RTL support.

    4,243 installs
  46. django-expert jeffallan/claude-skills

    Use when building Django web applications or REST APIs with Django REST Framework. Invoke when working with settings.py, models.py, manage.py, or any Django project file. Creates Django models with proper indexes, optim…

    4,236 installs
  47. crxjs samber/cc-skills

    CRXJS Chrome extension development — true HMR for popup, options, content scripts, side panels, manifest-driven builds, dynamic content script imports (`?script`, `?script&module`), and `defineManifest` for type-safe ma…

    4,223 installs
  48. modal lobehub/lobehub

    Use for modals, dialogs and confirmations with createModal, confirmModal, ModalHost or base-ui modal APIs.

    4,205 installs
  49. wp-interactivity-api wordpress/agent-skills

    Use when building or debugging WordPress Interactivity API features (data-wp-* directives, @wordpress/interactivity store/state/actions, block viewScriptModule integration, wp_interactivity_*()) including performance, h…

    4,159 installs
  50. building-storefronts medusajs/medusa-agent-skills

    Load automatically when planning, researching, or implementing Medusa storefront features (calling custom API routes, SDK integration, React Query patterns, data fetching). REQUIRED for all storefront development in ALL…

    4,151 installs