Skill4Agent
Skill4Agent
All SkillsSearchTools
|
Explore
Skill4Agent
Skill4Agent

AI Agent Skills Directory with categorization, English/Chinese translation, and script security checks.

Sitemap

  • Home
  • All Skills
  • Search
  • Tools

About

  • About Us
  • Disclaimer
  • Copyright

Help

  • FAQ
  • Privacy
  • Terms
Contact Us:osulivan147@qq.com

© 2026 Skill4Agent. All rights reserved.

All Skills

Total 50,306 skills, Frontend Development has 4853 skills

Categories

Showing 12 of 4853 skills

Per page
Downloads
Sort
Frontend Developmentaddyosmani/web-quality-sk...

core-web-vitals

Optimize Core Web Vitals (LCP, INP, CLS) for better page experience and search ranking. Use when asked to "improve Core Web Vitals", "fix LCP", "reduce CLS", "optimize INP", "page experience optimization", or "fix layout shifts".

🇺🇸|EnglishTranslated
24
Frontend Developmenthairyf/skills

hairy-react-lib

Comprehensive skills for working with @hairy/react-lib React hooks and components

🇺🇸|EnglishTranslated
24
Frontend Developmentpatricio0312rev/skills

animation-micro-interaction-pack

Provides reusable interaction patterns and motion presets that make UI feel polished. Includes hover effects, transitions, entrance animations, gesture feedback, and reduced-motion support. Use when adding "animations", "transitions", "micro-interactions", or "motion design".

🇺🇸|EnglishTranslated
24
Frontend Developmentgithub/awesome-copilot

react18-string-refs

Provides exact migration patterns for React string refs (ref="name" + this.refs.name) to React.createRef() in class components. Use this skill whenever migrating string ref usage - including single element refs, multiple refs in a component, refs in lists, callback refs, and refs passed to child components. Always use this skill before writing any ref migration code - the multiple-refs-in-list pattern is particularly tricky and this skill prevents the most common mistakes. Use it for React 18.3.1 migration (string refs warn) and React 19 migration (string refs removed).

🇺🇸|EnglishTranslated
24
Frontend Developmentshopify/shopify-ai-toolki...

shopify-storefront-graphql

Use for custom storefronts requiring direct GraphQL queries/mutations for data fetching and cart operations. Choose this when you need full control over data fetching and rendering your own UI. NOT for Web Components - if the prompt mentions HTML tags like <shopify-store>, <shopify-cart>, use storefront-web-components instead.

🇺🇸|EnglishTranslated
24
2 scripts/Attention
Frontend Developmentfigma/mcp-server-guide

figma-implement-design

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 `use_figma`, use `figma-use`.

🇺🇸|EnglishTranslated
24
Frontend Developmentmindrally/skills

vue-typescript

Expert in Vue.js TypeScript development with Vite, Pinia, and modern UI frameworks

🇺🇸|EnglishTranslated
23
Frontend Developmentvinayakkulkarni/vue-nuxt-...

nuxt-best-practices

Nuxt 3/4 performance optimization and architecture guidelines for building fast, maintainable full-stack applications. This skill should be used when writing, reviewing, or refactoring Nuxt code to ensure optimal patterns. Triggers on tasks involving data fetching, server routes, auto-imports, rendering modes, or Nuxt-specific features.

🇺🇸|EnglishTranslated
23
2 scripts/Checked
Frontend Developmenthairyf/skills

uniapp

uni-app 跨平台应用开发框架。适用于使用 Vue 语法开发 App、H5、各端小程序时的能力与用法。

🇺🇸|EnglishTranslated
23
Frontend Developmentantfu/skills

tsdown

Bundle TypeScript and JavaScript libraries with blazing-fast speed powered by Rolldown. Use when building libraries, generating type declarations, bundling for multiple formats, or migrating from tsup.

🇺🇸|EnglishTranslated
23
Frontend Developmentvuejs-ai/skills

create-adaptable-composable

Create a library-grade Vue composable that accepts maybe-reactive inputs (MaybeRef / MaybeRefOrGetter) so callers can pass a plain value, ref, or getter. Normalize inputs with toValue()/toRef() inside reactive effects (watch/watchEffect) to keep behavior predictable and reactive. Use this skill when user asks for creating adaptable or reusable composables.

🇺🇸|EnglishTranslated
23
Frontend Developmentalinaqi/claude-bootstrap

react-web

React web development with hooks, React Query, Zustand

🇺🇸|EnglishTranslated
23
1...1314151617...405
Page