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,476 skills, Frontend Development has 4860 skills

Categories

Showing 12 of 4860 skills

Per page
Downloads
Sort
Frontend Developmentbobmatnyc/claude-mpm-skil...

flexlayout-react

FlexLayout for React - Advanced docking layout manager with drag-and-drop, tabs, splitters, and complex window management

🇺🇸|EnglishTranslated
15
Frontend Developmenttravisjneuman/.claude

generic-react-ux-designer

Professional UI/UX design expertise for React applications. Covers design thinking, user psychology (Hick's/Fitts's/Jakob's Law), visual hierarchy, interaction patterns, accessibility, performance-driven design, and design critique. Use when designing features, improving UX, solving user problems, or conducting design reviews.

🇺🇸|EnglishTranslated
15
Frontend Developmenthopeoverture/worldbuildin...

tailwind-shadcn-ui-setup

This skill should be used when setting up, configuring, or initializing Tailwind CSS (v3 or v4) and shadcn/ui for Next.js 16 App Router projects. Configure dark mode, design tokens, base layout with header/sidebar, accessibility defaults, and generate example components. Includes comprehensive setup automation, theme customization, and production-ready patterns. Use when the user requests "setup Tailwind", "configure shadcn/ui", "add dark mode", "initialize design system", or "setup UI framework" for Next.js projects.

🇺🇸|EnglishTranslated
15
1 scripts/Checked
Frontend Developmentbear2u/my-skills

landing-page-guide

Comprehensive guide for creating effective landing pages using Next.js or React. This skill should be used when users request to create landing pages, marketing pages, or product pages that require the 11 essential elements for high-converting landing pages. Specifically designed for Next.js 14+ App Router with ShadCN UI components.

🇺🇸|EnglishTranslated
15
Frontend Developmentauth0/agent-skills

auth0-vue

Use when adding authentication to Vue.js 3 applications (login, logout, user sessions, protected routes) - integrates @auth0/auth0-vue SDK for SPAs with Vite or Vue CLI

🇺🇸|EnglishTranslated
15
Frontend Developmentalfredoperez/angular-best...

rules-reviewer

Validates Angular rules are real, accurate, and valuable. Researches best practices, validates code examples, and checks for clear decision criteria.

🇺🇸|EnglishTranslated
15
Frontend Developmentpilag6/skills-claude-code

pinia-colada

Pinia Colada expert for Vue 3 — queries, mutations, keys, invalidation, optimistic updates, pagination, and debugging.

🇺🇸|EnglishTranslated
15
Frontend Developmentalfredoperez/angular-best...

angular-best-practices-material

Angular Material & CDK best practices. Install alongside angular-best-practices.

🇺🇸|EnglishTranslated
15
Frontend Developmentcxyliuy/vibe-coding-skill...

refactor-table-alignment

Refactor UI table components to follow enterprise column alignment, formatting, and width standards while preserving sorting, filtering, and pagination.

🇺🇸|EnglishTranslated
15
Frontend Developmentpproenca/dot-skills

framer-motion

Framer Motion performance optimization guidelines. This skill should be used when writing, reviewing, or refactoring React animations with Framer Motion to ensure optimal performance patterns. Triggers on tasks involving motion components, animations, gestures, layout transitions, scroll-linked effects, and SVG animations.

🇺🇸|EnglishTranslated
15
Frontend Developmentkyuhyi/bsd_claude_skills

payment-integration

Toss Payments, Stripe 등 최신 결제 시스템을 Next.js에 통합하는 스킬. 정기결제, 보안 결제, 웹훅 처리를 전문적으로 다룹니다.

🇺🇸|EnglishTranslated
15
Frontend Developmentnitinm21/youtube_summariz...

elevated-design

Create sophisticated, Apple-inspired web interfaces with refined aesthetics and corporate elegance. Emphasizes generous whitespace, ultra-precise typography, asymmetric layouts, and purposeful interactions. Combines minimalist design philosophy with premium brand execution. Use when building premium landing pages, marketing sections, product showcases, or corporate interfaces that demand visual sophistication beyond standard business UI.

🇺🇸|EnglishTranslated
15
1...5051525354...405
Page