Skill catalog
872web & 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.
- customware-support-widget customware-ai/skills
Use this skill when adding, placing, configuring, or fixing the Customware support chat widget in the Customware React Router client-only SPA template. It covers root.tsx/root document script loading, route/layout place…
2,496 installs - shadcn vercel-labs/json-render
Pre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with Radix UI + Tailwind CSS components.
2,489 installs - mapbox-web-performance-patterns mapbox/mapbox-agent-skills
Performance optimization patterns for Mapbox GL JS web applications. Covers initialization waterfalls, bundle size, rendering performance, memory management, and web optimization. Prioritized by impact on user experienc…
2,485 installs - react-spring-physics freshtechbro/claudedesignskills
Physics-based animation library combining React Spring (spring dynamics, gesture integration, 60fps animations) and Popmotion (low-level composable animation utilities, reactive streams). Use when building fluid, natura…
2,483 installs - scroll-reveal-libraries freshtechbro/claudedesignskills
Simple scroll-triggered reveal animations using AOS (Animate On Scroll). Use this skill when building marketing pages, landing pages, or content-heavy sites requiring basic fade/slide effects without complex animation o…
2,470 installs - vite onmax/nuxt-skills
Vite build tool configuration, plugin API, SSR, and Vite 8 Rolldown migration. Use when working with Vite projects, vite.config.ts, Vite plugins, or building libraries/SSR apps with Vite.
2,456 installs - image-processing jezweb/claude-skills
Process images for web development — resize, crop, trim whitespace, convert formats (PNG/WebP/JPG), optimise file size, generate thumbnails, create OG card images. Uses Pillow (Python) — no ImageMagick needed. Trigger w…
2,434 installs - control-ui cursor/plugins
Build or adapt a local browser/CDP harness to drive and inspect a web, IDE, or Electron UI. Use for local UI verification, screenshots, accessibility snapshots, perf profiles, visual diffs, or reproducing UI bugs.
2,408 installs - improve-website wondelai/skills
Guided journey from a live website that underperforms to a prioritized, evidence-backed backlog of conversion, usability, message, and speed fixes - each shipped as a testable experiment. Orchestrates eight skills phase…
2,408 installs - barba-js freshtechbro/claudedesignskills
Page transitions library for creating fluid, smooth transitions between website pages. Use this skill when implementing page transitions, creating SPA-like experiences, adding animated route changes, or building website…
2,404 installs - lottie-animation iart-ai/web-animation-skills
This skill should be used when the user asks to "add a Lottie animation", "play a .lottie or .json animation", "integrate a Bodymovin/After Effects animation on web or mobile", "control Lottie playback / segments", "mak…
2,401 installs - building-omnistudio-flexcard forcedotcom/sf-skills
OmniStudio FlexCard creation and validation with 130-point scoring. Use when building at-a-glance UI cards, configuring data source bindings to Integration Procedures, or reviewing existing FlexCard definitions for acce…
2,389 installs - roblox-gui tabooharmony/roblox-brain
Use when building or fixing Roblox menus, HUDs, shops, dialogs, or UI that must work on phones, tablets, desktop and console.
2,376 installs - aframe-webxr freshtechbro/claudedesignskills
Declarative web framework for building browser-based 3D, VR, and AR experiences using HTML and entity-component architecture. Use this skill when creating WebXR applications, VR experiences, AR experiences, 360-degree m…
2,368 installs - next-bundle-optimizer vercel/next.js
Audit and reduce Next.js browser initial-load work. Use for slow route startup, oversized client bundles, duplicate browser dependencies, or features that can wait for interaction.
2,367 installs - tailwindcss-animations josiahsiegel/claude-plugin-marketplace
Tailwind CSS animations and transitions including built-in utilities and custom keyframes. PROACTIVELY activate for: (1) animate-* utilities (spin, ping, pulse, bounce), (2) custom @keyframes via @theme animate, (3) tra…
2,365 installs - playcanvas-engine freshtechbro/claudedesignskills
Lightweight WebGL/WebGPU game engine with entity-component architecture and visual editor integration. Use this skill when building browser-based games, interactive 3D applications, or performance-critical web experienc…
2,358 installs - service-digital-engagement-messaging-site-integrate forcedotcom/sf-skills
Integrates a Messaging for In-App and Web (MIAW) Embedded Messaging chat widget into an Experience Cloud site by patching the site's LWR or Aura page bundle, deploying, publishing, and verifying guest access. Use when t…
2,358 installs - threejs-performance cloudai-x/threejs-skills
Measuring and optimizing three.js speed: render statistics, memory counters, fewer draw calls via merging, instancing, batching and LOD, fill rate, shadows, CPU work per frame, shader stalls and GPU compute for particle…
2,358 installs - create-website wondelai/skills
Guided journey from a blank page to a live, high-converting website, built message-first, then design, then conversion. Orchestrates ten skills phase by phase - one-page-marketing, storybrand-messaging, made-to-stick, t…
2,350 installs - huggingface-gradio huggingface/skills
Build Gradio web UIs and demos in Python. Use when creating or editing Gradio apps, components, event listeners, layouts, or chatbots.
2,349 installs - experience-lwc-rtl-validate forcedotcom/sf-skills
Use this skill to review a Lightning Web Component (.html, .js, .css files) for right-to-left (RTL) internationalization correctness, producing a finding list with code-level fixes covering CSS logical properties, bidir…
2,344 installs - motion onmax/nuxt-skills
Use when adding animations with Motion Vue (motion-v) - provides motion component API, gesture animations, scroll-linked effects, layout transitions, and composables for Vue 3/Nuxt
2,334 installs - frontend-design jwynia/agent-skills
Create distinctive, production-grade frontend interfaces with high design quality. Provides analysis tools for auditing existing designs and generation tools for creating color palettes, typography systems, design token…
2,323 installs - react-three-fiber vercel-labs/json-render
React Three Fiber 3D renderer for json-render. Use when working with @json-render/react-three-fiber, building 3D scenes from JSON specs, rendering meshes/lights/models/environments, or integrating Three.js with json-ren…
2,321 installs - paddle-checkout-web developer.paddle.com
Add a Paddle Checkout to a Next.js web app — overlay or inline, with event handling, customer pre-fill, and dynamic line item updates.
2,303 installs - spartan spartan-ng/spartan
Manages spartan/ui, the Angular UI library - adding, composing, fixing, debugging, and styling UI with the Brain (headless primitives) and Helm (styled) layers. Provides project context, component APIs, and usage exampl…
2,301 installs - wp-patterns wordpress/agent-skills
Pattern: create or update WordPress block patterns (starter pages, templates, template parts, Query Loop layouts), review pattern registration, block markup, categories, accessibility, or i18n/escaping, or improve patte…
2,257 installs - interface-kit juliusbrussee/skills
Authoritative guide for implementing stunning, accessible, performant UI. Synthesizes design engineering philosophy, accessibility standards, animation principles, spatial design, typography, color systems, and componen…
2,244 installs - cinematic-scroll-storytelling mengto/skills
Create cinematic scroll-driven landing pages with Lenis smooth scrolling, GSAP ScrollTrigger, scroll-linked progression, staggered text reveals, sticky card stacks, parallax backgrounds, scroll-scrubbed transitions, foo…
2,239 installs - favicon-gen jezweb/claude-skills
Generate custom favicons from logos, text, or brand colours. Produces favicon.svg, favicon.ico, apple-touch-icon.png, icon-192/512.png, and web manifest. Use whenever the user wants a favicon, mentions replacing a CMS d…
2,235 installs - paddle-pricing-pages developer.paddle.com
Render country-localized prices on a Next.js pricing page using Paddle.js PricePreview — country detection, billing frequency toggle, and currency formatting.
2,235 installs - threejs-react-three-fiber cloudai-x/threejs-skills
Building three.js scenes from React with React Three Fiber and drei: renderer setup, the scene graph as JSX, frame-loop, state and loading hooks, pointer events, and adaptive performance, on WebGL or with WebGPU and TSL…
2,229 installs - edgeone aahl/skills
Deploy HTML content to EdgeOne Pages, return the public URL.
2,204 installs - nextjs-app-router-fundamentals wsimmonds/claude-nextjs-skills
Guide for working with Next.js App Router (Next.js 13+). Use when migrating from Pages Router to App Router, creating layouts, implementing routing, handling metadata, or building Next.js 13+ applications. Activates for…
2,200 installs - threejs-asset-pipeline cloudai-x/threejs-skills
Shrinking glTF assets for three.js with gltf-transform: inspect, validate and optimize commands, Draco, meshopt and quantization, KTX2, WebP and AVIF textures, the loader setup each output needs, and gltfjsx for React.…
2,199 installs - experience-ui-bundle-localize forcedotcom/sf-skills
MUST activate to localize / internationalize a uiBundles/*/src/ project (React or Angular): extract hardcoded user-facing strings into Custom Labels, wire a runtime i18n library over the Platform SDK backend, add labels…
2,184 installs - astro-framework delineas/astro-framework-agents
Astro framework specialist for building fast, content-driven websites with islands architecture. Use when creating Astro components, configuring hydration (client:load/idle/visible/media), using server:defer (server isl…
2,177 installs - r3f-fundamentals enzed/r3f-skills
Set up React Three Fiber scenes, Canvas, typed JSX, hooks, and resource ownership. Use for scene architecture and render-loop setup, rather than detailed materials or effects.
2,173 installs - clone-website julianromli/ai-skills
Reverse-engineer and clone one or more websites in one shot — extracts assets, CSS, and content section-by-section and proactively dispatches parallel builder agents in worktrees as it goes. Use this whenever the user w…
2,157 installs - gsap-performance nexu-io/open-design
Official GSAP skill for performance — prefer transforms, avoid layout thrashing, will-change, batching. Use when optimizing GSAP animations, reducing jank, or when the user asks about animation performance, FPS, or smoo…
2,156 installs - gsap-plugins nexu-io/open-design
Official GSAP skill for GSAP plugins — registration, ScrollToPlugin, ScrollSmoother, Flip, Draggable, Inertia, Observer, SplitText, ScrambleText, SVG and physics plugins, CustomEase, EasePack, CustomWiggle, CustomBounce…
2,153 installs - gsap-frameworks nexu-io/open-design
Official GSAP skill for Vue, Svelte, and other non-React frameworks — lifecycle, scoping selectors, cleanup on unmount. Use when the user wants animation in Vue, Nuxt, Svelte, SvelteKit, or asks about GSAP with Vue/Svel…
2,149 installs - frontend-design vercel-labs/agent-eval
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, landin…
2,146 installs - 21st-cli-use 21st-dev/skill
Search, install and pull code from the 21st.dev catalog with the `21st` CLI (`@21st-dev/cli`): find React/shadcn components, themes and templates, print a component's code or a theme's CSS, install an item into the proj…
2,145 installs - 21st-ai 21st-dev/skill
Generate and iterate on UI with 21st AI from the terminal via the `21st` CLI (`@21st-dev/cli`): sketch a UI from a prompt, preview the variants in the browser, edit any variant in place with a natural-language change, a…
2,136 installs - sentry-svelte-sdk getsentry/sentry-for-ai
Full Sentry SDK setup for Svelte and SvelteKit. Use when asked to "add Sentry to Svelte", "add Sentry to SvelteKit", "install @sentry/sveltekit", or configure error monitoring, tracing, session replay, or logging for Sv…
2,126 installs - senior-frontend davila7/claude-code-templates
Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and U…
2,120 installs - animation-on-scroll mengto/skills
Create an on-scroll animation trigger using IntersectionObserver with Tailwind-friendly animation classes and keyframes. Use when asked for scroll-reveal, animate-on-scroll, or sequencing element animations when they en…
2,115 installs - tailwindcss-mobile-first josiahsiegel/claude-plugin-marketplace
Mobile-first responsive design patterns with Tailwind CSS v4 (2025-2026). PROACTIVELY activate for: (1) mobile-first design with Tailwind breakpoints (sm:, md:, lg:, xl:, 2xl:), (2) responsive utility ordering (default…
2,099 installs