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,503 skills, Frontend Development has 4863 skills

Categories

Showing 12 of 4863 skills

Per page
Downloads
Sort
Frontend Developmentjezweb/claude-skills

responsive-images

Implement performant responsive images with srcset, sizes, lazy loading, and modern formats (WebP, AVIF). Covers aspect-ratio for CLS prevention, picture element for art direction, and fetchpriority for LCP optimization. Use when: adding images to pages, optimizing Core Web Vitals, preventing layout shift, implementing art direction, or converting to modern formats.

🇺🇸|EnglishTranslated
13
Frontend Developmentassistant-ui/skills

setup

Setup and configure assistant-ui in a project. Use when installing packages, configuring runtimes, or troubleshooting setup issues.

🇺🇸|EnglishTranslated
13
Frontend Developmentjosiahsiegel/claude-plugi...

tailwindcss-mobile-first

Comprehensive mobile-first responsive design patterns with 2025/2026 best practices for Tailwind CSS v4

🇺🇸|EnglishTranslated
13
Frontend Developmentenzed/r3f-skills

r3f-physics

React Three Fiber physics with Rapier - RigidBody, colliders, forces, joints, sensors. Use when adding physics simulation, collision detection, character controllers, or creating interactive physics-based experiences.

🇺🇸|EnglishTranslated
13
Frontend Developmentpatricio0312rev/skills

framer-motion-animator

Creates smooth animations and micro-interactions using Framer Motion including page transitions, gestures, scroll-based animations, and orchestrated sequences. Use when users request "add animation", "framer motion", "page transition", "animate component", or "micro-interactions".

🇺🇸|EnglishTranslated
13
Frontend Developmentenzed/r3f-skills

r3f-textures

React Three Fiber textures - useTexture, texture loading, environment maps, texture configuration. Use when loading images, working with PBR texture sets, cubemaps, HDR environments, or optimizing texture usage.

🇺🇸|EnglishTranslated
13
Frontend Developmentpproenca/dot-skills

ui-design

UI/UX and frontend design best practices guidelines (formerly frontend-design). This skill should be used when writing, reviewing, or designing frontend code to ensure accessibility, performance, and usability. Triggers on tasks involving HTML structure, CSS styling, responsive layouts, form design, animations, or accessibility improvements.

🇺🇸|EnglishTranslated
13
Frontend Developmentgithub/awesome-copilot

legacy-circuit-mockups

Generate breadboard circuit mockups and visual diagrams using HTML5 Canvas drawing techniques. Use when asked to create circuit layouts, visualize electronic component placements, draw breadboard diagrams, mockup 6502 builds, generate retro computer schematics, or design vintage electronics projects. Supports 555 timers, W65C02S microprocessors, 28C256 EEPROMs, W65C22 VIA chips, 7400-series logic gates, LEDs, resistors, capacitors, switches, buttons, crystals, and wires.

🇺🇸|EnglishTranslated
13
Frontend Developmentehmo/platform-design-skil...

web-design-guidelines

Web platform design and accessibility guidelines. Use when building web interfaces, auditing accessibility, implementing responsive layouts, or reviewing web UI code. Triggers on tasks involving HTML, CSS, web components, WCAG compliance, responsive design, or web performance.

🇺🇸|EnglishTranslated
13
Frontend Developmentexistential-birds/beagle

react-flow-code-review

Reviews React Flow code for anti-patterns, performance issues, and best practices. Use when reviewing code that uses @xyflow/react, checking for common mistakes, or optimizing node-based UI implementations.

🇺🇸|EnglishTranslated
13
Frontend Developmentaj-geddes/useful-ai-promp...

frontend-routing

Implement client-side routing using React Router, Vue Router, and Angular Router. Use when building multi-page applications with navigation and route protection.

🇺🇸|EnglishTranslated
13
Frontend Developmentexistential-birds/beagle

react-router-code-review

Reviews React Router code for proper data loading, mutations, error handling, and navigation patterns. Use when reviewing React Router v6.4+ code, loaders, actions, or navigation logic.

🇺🇸|EnglishTranslated
13
1...8182838485...406
Page