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,539 skills, Frontend Development has 4868 skills

Categories

Showing 12 of 4868 skills

Per page
Downloads
Sort
Frontend Developmentnexu-io/open-design

after-hours-editorial-template

Luxury dark-editorial HyperFrames template for three-page cinematic storyboards, inspired by haute couture title cards and magazine chapter spreads. Use when the user asks for premium fashion-style motion pages, moody serif-led storytelling, or a high-end dark presentation aesthetic with rich transitions.

🇺🇸|EnglishTranslated
10
Frontend Developmentgosukiwi/clean-code-react

clean-react-hooks

Use when writing, fixing, editing, or refactoring React hooks, custom hooks, useEffect, dependency arrays, stale closures, subscriptions, refs, or memoization.

🇺🇸|EnglishTranslated
10
Frontend Developmentgosukiwi/clean-code-react

clean-css

Use when writing, fixing, editing, or refactoring CSS, CSS Modules, CSS-in-JS, styled-components, StyleX, Tailwind class usage, inline style props, design tokens, layout, visual accessibility, or responsive UI styling.

🇺🇸|EnglishTranslated
10
Frontend Developmentgarrytan/gstack

design-html

Design finalization: generates production-quality Pretext-native HTML/CSS. Works with approved mockups from /design-shotgun, CEO plans from /plan-ceo-review, design review context from /plan-design-review, or from scratch with a user description. Text actually reflows, heights are computed, layouts are dynamic. 30KB overhead, zero deps. Smart API routing: picks the right Pretext patterns for each design type. Use when: "finalize this design", "turn this into HTML", "build me a page", "implement this design", or after any planning skill. Proactively suggest when user has approved a design or has a plan ready. (gstack) Voice triggers (speech-to-text aliases): "build the design", "code the mockup", "make it real".

🇺🇸|EnglishTranslated
10
1 scripts/Checked
Frontend Developmentluisitoluis/agent-skills

animejs

Trigger: animejs animation, anime.js, stagger, timeline, scroll animation. Anime.js reference for animations, timelines, stagger, scroll sync, SVG, and text effects.

🇺🇸|EnglishTranslated
10
Frontend Developmenttristanmanchester/agent-s...

nextjs-framer-motion-animations

Adds production-safe Motion for React or Framer Motion animations to Next.js apps, including reveal, hover and tap micro-interactions, whileInView, stagger, AnimatePresence, layout and layoutId transitions, reorder, scroll-linked UI, and lightweight route-content transitions. Use when the user asks to add, refactor, or debug Motion or Framer Motion in App Router or Pages Router codebases, especially around server/client boundaries, reduced motion, LazyMotion, bundle size, hydration, or route transitions. Avoid for GSAP-style timelines, WebGL or 3D scenes, heavy scroll storytelling, or CSS-only effects unless Motion is explicitly requested.

🇺🇸|EnglishTranslated
10
6 scripts/Attention
Frontend Developmentnexu-io/open-design

remotion

Programmatic video creation with React. Useful for branded explainers, social cuts, dashboards-to-video, and reproducible motion graphics.

🇺🇸|EnglishTranslated
10
Frontend Developmentnexu-io/open-design

gsap-react

GSAP React integration with useGSAP hook, refs, gsap.context(), cleanup, and SSR. Ships safe motion in React + Next.js apps.

🇺🇸|EnglishTranslated
10
Frontend Developmentaffaan-m/everything-claud...

make-interfaces-feel-better

Apply concrete design-engineering details that make interfaces feel polished. Use when reviewing or improving UI spacing, typography, borders, shadows, motion, hit areas, icons, text wrapping, and interaction states.

🇺🇸|EnglishTranslated
10
Frontend Developmentbaphomet480/claude-skills

print-css

Write production-ready print stylesheets. Covers @page rules, page breaks, visibility, color management, typography, images, links, tables, and framework-specific gotchas for Next.js/React/Tailwind. Use when the user asks to add print styles, make a page printable, or create a print-friendly layout.

🇺🇸|EnglishTranslated
10
Frontend Developmentnexu-io/open-design

gsap-core

Core GSAP API with gsap.to(), from(), fromTo(), easing, duration, stagger, and defaults. Production-grade web animation primitives.

🇺🇸|EnglishTranslated
10
Frontend Developmentnexu-io/open-design

gsap-scrolltrigger

GSAP ScrollTrigger for scroll-linked animations, pinning, scrub, and refresh handling. Useful for editorial sites and product pages.

🇺🇸|EnglishTranslated
10
1...176177178179180...406
Page