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 53,999 skills, Frontend Development has 5111 skills

Categories

Showing 12 of 5111 skills

Per page
Downloads
Sort
Frontend Developmentsaschabrunnerch/arcgis-ma...

arcgis-coordinates-projection

Work with coordinate systems, projections, and coordinate conversion. Use for transforming coordinates and displaying position in multiple formats.

🇺🇸|EnglishTranslated
29
Frontend Developmentoguzhan18/angular-ecosyst...

rxjs

ALWAYS use when working with RxJS Observables, operators, and reactive patterns in Angular applications.

🇺🇸|EnglishTranslated
29
Frontend Developmentpatternsdev/skills

ai-ui-patterns

Design patterns for building AI-powered interfaces like chatbots and intelligent assistants in React.

🇺🇸|EnglishTranslated
29
Frontend Developmentdadbodgeoff/drift

pwa-setup

Progressive Web App setup with manifest, mobile meta tags, safe area handling for notched devices, and install prompts for app-like browser experience.

🇺🇸|EnglishTranslated
29
Frontend Developmentgohypergiant/agent-skills

accelint-nextjs-best-practices

Next.js performance optimization and best practices. Use when writing Next.js code (App Router or Pages Router); implementing Server Components, Server Actions, or API routes; optimizing RSC serialization, data fetching, or server-side rendering; reviewing Next.js code for performance issues; fixing authentication in Server Actions; or implementing Suspense boundaries, parallel data fetching, or request deduplication.

🇺🇸|EnglishTranslated
29
3 scripts/Attention
Frontend Developmentdylantarre/animation-prin...

micro-interactions

Use when designing small UI feedback moments like button states, toggles, form validation, loading indicators, or notification badges.

🇺🇸|EnglishTranslated
29
Frontend Developmentsrbhr/resume-matcher

react-patterns

React and Next.js performance optimization guidelines from Vercel Engineering, tuned for local/offline or docker-deployed apps.

🇺🇸|EnglishTranslated
29
Frontend Developmentantfu/skills

vue-router-best-practices

Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions.

🇺🇸|EnglishTranslated
29
Frontend Developmentpaulrobello/claude-office

character-sprite

Generate complete character sprite sheets for the Claude Office Visualizer agents. Creates all animation frames (idle, walking, typing, handoff, coffee) with consistent character design across all sheets. Uses iterative approval workflow and reference-based generation for consistency.

🇺🇸|EnglishTranslated
29
Frontend Developmentpopup-studio-ai/bkit-clau...

phase-5-design-system

Skill for building platform-independent design systems. Develops consistent component libraries for all UI frameworks. Use proactively when user needs consistent UI components or mentions design tokens. Triggers: design system, component library, design tokens, shadcn, 디자인 시스템, デザインシステム, 设计系统, sistema de diseño, biblioteca de componentes, tokens de diseño, système de design, bibliothèque de composants, jetons de design, Design-System, Komponentenbibliothek, Design-Tokens, sistema di design, libreria di componenti, token di design Do NOT use for: one-off UI changes, backend development, or simple static sites.

🇺🇸|EnglishTranslated
29
Frontend Developmentimgly/agent-skills

docs-react

Look up CE.SDK React reference docs, guides, and configuration pages. Use when the user needs CE.SDK docs for React — configuration, UI customization, export options, feature guides, or getting-started instructions. Also triggered by "IMG.LY", "CreativeEditor", "CE.SDK", or "cesdk" when the user needs an existing React doc page. Not for writing code (use build) or concept explanations (use explain). <example> Context: User asks about React configuration user: "How do I configure the editor in React?" assistant: "I'll use /cesdk:docs-react to look up configuration options." </example> <example> Context: User needs React component setup user: "How do I embed CE.SDK in a React component?" assistant: "Let me use /cesdk:docs-react to find the relevant documentation." </example>

🇺🇸|EnglishTranslated
29
Frontend Developmentilandahan/aid

atomic-design

Expert-level Atomic Design System development from Figma style guides. Build reusable component libraries with atoms, molecules, organisms, templates, and pages.

🇺🇸|EnglishTranslated
29
1...4647484950...426
Page