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,817 skills, Frontend Development has 4879 skills

Categories

Showing 12 of 4879 skills

Per page
Downloads
Sort
Frontend Developmentaradotso/trending-skills

json-render-generative-ui

Generative UI framework that renders AI-generated JSON specs into type-safe UI components across React, Vue, Svelte, Solid, React Native, video, PDF, and email.

🇺🇸|EnglishTranslated
7
Frontend Developmentjezweb/claude-skills

react-patterns

React 19 performance patterns and composition architecture for Vite + Cloudflare projects. 50+ rules ranked by impact — eliminating waterfalls, bundle optimisation, re-render prevention, composition over boolean props, server/client boundaries, and React 19 APIs. Use when writing, reviewing, or refactoring React components. Triggers: 'react patterns', 'react review', 'react performance', 'optimise components', 'react best practices', 'composition patterns', 'why is it slow', 'reduce re-renders', 'fix waterfall'.

🇺🇸|EnglishTranslated
7
Frontend Developmentthebushidocollective/han

vue-component-patterns

Use when Vue component patterns including props, emits, slots, and provide/inject. Use when building reusable Vue components.

🇺🇸|EnglishTranslated
7
Frontend Developmentvercel-labs/vercel-plugin

satori

Expert guidance for Satori — Vercel's library that converts HTML and CSS to SVG, commonly used to generate dynamic OG images for Next.js and other frameworks.

🇺🇸|EnglishTranslated
7
Frontend Developmentabsolutelyskilled/absolut...

motion-design

Use this skill when implementing animations, transitions, micro-interactions, or motion design in web applications. Triggers on CSS animations, Framer Motion, GSAP, keyframes, transitions, spring animations, scroll-driven animations, page transitions, loading states, and any task requiring motion or animation implementation.

🇺🇸|EnglishTranslated
7
Frontend Developmenttdimino/claude-code-minoa...

shadcn

This skill should be used when adding shadcn/ui components, initializing shadcn projects, building custom registries, theming with Tailwind v4 OKLCH colors, or customizing installed components. Also use when working with components.json, presets, monorepo setup, or shadcn CLI commands. Pairs with minoan-frontend-design for creative direction.

🇺🇸|EnglishTranslated
7
3 scripts/Attention
Frontend Developmentbuainoai/remotion-skills

remotion-best-practices

Remotion Best Practices - Create Videos with React

🇨🇳|ChineseTranslated
7
Frontend Developmentsolinkz/micro-interaction...

micro-interactions

Expert micro-interaction architect for mobile apps, web applications, and responsive websites. Use this skill when the user asks to add, build, fix, audit, or consult on micro-interactions, animations, transitions, motion design, gesture feedback, haptics, loading states, skeleton screens, pull-to-refresh, swipe actions, scroll animations, button states, form validation feedback, toast notifications, modals, dropdowns, toggles, progress indicators, shared element transitions, spring physics, easing curves, motion tokens, or any interaction that provides visual/haptic/auditory feedback to user actions. Triggers on: "micro-interaction", "animation", "transition", "motion", "easing", "spring", "gesture", "haptic", "feedback", "loading state", "skeleton", "shimmer", "pull to refresh", "swipe", "drag", "hover effect", "press state", "focus ring", "scroll animation", "parallax", "stagger", "orchestration", "reduced motion", "View Transitions", "layout animation", "shared element", "hero animation", "morphing", "Framer Motion", "GSAP", "Lottie", "Rive", "React Spring", "anime.js", or any request to make an interface "feel better", "feel alive", "feel snappy", "feel responsive", or "feel polished".

🇺🇸|EnglishTranslated
7
Frontend Developmentdfinity/icskills

asset-canister

Deploy frontend assets to the IC. Covers certified assets, SPA routing with .ic-assets.json5, custom domains, content encoding, and programmatic uploads. Use when hosting a frontend, deploying static files, configuring custom domains, or setting up SPA routing on IC. Do NOT use for canister-level code patterns.

🇺🇸|EnglishTranslated
7
Frontend Developmentnotque/claude-code-toolki...

perses-plugin-create

Perses plugin scaffolding and creation: select plugin type (Panel, Datasource, Query, Variable, Explore), generate with percli plugin generate, implement CUE schema and React component, test with percli plugin start, build archive with percli plugin build. Use for "create perses plugin", "new panel plugin", "new datasource plugin", "perses plugin scaffold". Do NOT use for dashboard creation (use perses-dashboard-create).

🇺🇸|EnglishTranslated
7
Frontend Developmentdrupal-canvas/skills

canvas-data-fetching

Fetch and render Drupal content in Canvas components with JSON:API and SWR patterns. Use when building content lists, integrating with SWR, or querying related entities. Covers JsonApiClient, DrupalJsonApiParams, relationship handling, and filter patterns.

🇺🇸|EnglishTranslated
7
Frontend Developmentashwinikarnik/rds-skills

button-skill

Reusable workflow for implementing and validating the RDS Button component using @rds-vue-ui packages from the private registry, including theme wiring, examples, and QA checks.

🇺🇸|EnglishTranslated
7
1...325326327328329...407
Page