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,523 skills, Frontend Development has 4865 skills

Categories

Showing 12 of 4865 skills

Per page
Downloads
Sort
Frontend Developmentsyncfusion/angular-ui-com...

syncfusion-angular-notifications

Comprehensive guide for implementing Syncfusion Angular notification components including Message, Skeleton and Toast. Use this when displaying informational, success, warning, or error alerts with severity levels, customizing message variants (Text, Outlined, Filled), handling close events, or showing content skeletons with shimmer/pulse animations during data loading. Covers MessageModule, SkeletonModule, accessibility, RTL, and custom CSS in Angular applications.

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

clean-react-file-organization

Use when creating, moving, or splitting React files, owner folders, component folders, hooks, presenters, utils, CSS modules, common folders, or shared/private dependencies.

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

social-media-matrix-tracker-template

社媒矩阵数据追踪面板模板(Social Media Matrix Tracker)。 Use when users ask for a cinematic, data-dense social media analytics dashboard with multi-platform metrics, interactive charts, hover insights, range compare, and dark/light theme switching in a single HTML artifact.

🇺🇸|EnglishTranslated
11
Frontend Developmentbaphomet480/claude-skills

tina-schema-sync

Synchronize TinaCMS schema changes by regenerating local artifacts and committing them. Use when the Tina schema (tina/config.ts) has been modified, when adding new block types or collection fields, or when tinacms build fails with "Unable to seed" errors. Triggers on "sync tina", "rebuild tina", "tina schema changed", "regenerate tina artifacts", "tina lock file", or after any edit to tina/config.ts.

🇺🇸|EnglishTranslated
11
Frontend Developmentforcedotcom/afv-library

generating-lwc-components

Lightning Web Components with PICKLES methodology and 165-point scoring. Use this skill when the user creates or edits LWC components, builds wire service patterns, or writes Jest tests for LWC. TRIGGER when: user creates/edits LWC components, touches lwc/**/*.js, .html, .css, .js-meta.xml files, or asks about wire service, SLDS, or Jest LWC tests. DO NOT TRIGGER when: Apex classes (use generating-apex), Aura components, or Visualforce.

🇺🇸|EnglishTranslated
11
19 scripts/Checked
Frontend Developmentbytonylee/future-slide-sk...

tightened-slide

Build single-file HTML horizontal-swipe presentation decks using the Tightened Slide process with locked layouts, strict grid rules, theme presets, image slot discipline, and validation.

🇺🇸|EnglishTranslated
11
2 scripts/Attention
Frontend Developmentdylantarre/animation-prin...

micro-100-200ms

Use when building micro-interactions between 100-200ms - tooltips appearing, dropdown opens, small feedback animations that feel quick but perceptible

🇺🇸|EnglishTranslated
11
Frontend Developmentnexu-io/html-anything

docs-page

Three-column Document Page: Side Navigation + Main Content + Right TOC

🇨🇳|ChineseTranslated
11
Frontend Developmentnext-safe-action/skills

safe-action-better-auth

Use when adding authentication or authorization to safe actions with Better Auth -- covers betterAuth() middleware setup, typed session context (BetterAuthContext), custom authorize callbacks (AuthorizeFn), unauthorized() handling, nextCookies() configuration, and Next.js authInterrupts setup

🇺🇸|EnglishTranslated
11
Frontend Developmentmarcioaltoe/skills

tailwindcss

Guide for Tailwind CSS v4 patterns and best practices. Use when styling components with Tailwind CSS, creating responsive layouts, or working with Tailwind 4 features. Don't use for plain-CSS authoring, CSS-in-JS libraries (styled-components, emotion), or non-Tailwind utility frameworks.

🇺🇸|EnglishTranslated
11
Frontend Developmentpproenca/dot-skills

design-to-react-algorithms

Use this skill whenever reverse-engineering a Sketch file (or Figma export with similar shape) into pixel-perfect React + CSS — covers the iteration mental model, tree reconstruction, layout inference algorithms, geometry math, visual-regression diffing, and the style/typography/path conversions that make "improvement without regression" enforceable. Trigger even if the user doesn't explicitly mention "algorithms" but is converting a design source into web code, building a design-to-code pipeline, or struggling to make incremental fidelity improvements without breaking previously-converted output.

🇺🇸|EnglishTranslated
11
Frontend Developmenteid0lon/zero-slop

reality-skill

Turns AI-generated demo UIs into real usable product workflows. Use when building, reviewing, or finishing apps, dashboards, forms, CRUD flows, onboarding, checkout, settings, auth-like flows, or any interface that must work beyond a static mockup.

🇺🇸|EnglishTranslated
11
1...128129130131132...406
Page