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 54,170 skills, Frontend Development has 5132 skills

Categories

Showing 12 of 5132 skills

Per page
Downloads
Sort
Frontend Developmentdembrandt/dembrandt-skill...

responsive-paradigms

Mobile, tablet, and desktop are different interaction paradigms — not the same layout scaled up or down. Sections can be hidden, repositioned, or made sticky on mobile. Navigation and primary actions move. Use when designing responsive layouts, adapting desktop UI for mobile, or deciding what to show on each breakpoint.

🇺🇸|EnglishTranslated
25
Frontend Developmentforcedotcom/sf-skills

validating-slds

Audit Lightning Web Components for SLDS compliance and produce a scored quality report. Runs the SLDS linter, analyzes CSS for theming hook usage and pairing, checks HTML for accessibility attributes, and scores findings across categories into an overall grade. Use when asked to "score my component", "SLDS scorecard", "quality report", "audit SLDS compliance", "how good is my SLDS", "check component quality", "rate my component", "evaluate my component", "is this component ready to ship?", "look at my LWC for issues", "audit this before I submit", "review my component before code review", or any time a user wants a quality assessment or production-readiness check on an LWC or SLDS component. Not for fixing violations (use uplifting-components-to-slds2) or building new components (use applying-slds).

🇺🇸|EnglishTranslated
25
1 scripts/Checked
Frontend Developmentabsolutelyskilled/absolut...

figma-to-code

Use this skill when translating Figma designs to code, interpreting design specs, matching visual fidelity, or bridging designer-developer handoff. Triggers on Figma implementation, design-to-code, pixel-perfect, design handoff, auto layout to flexbox, Figma tokens, component variants to props, and any task requiring faithful implementation of design mockups.

🇺🇸|EnglishTranslated
25
Frontend Developmentzzci/skills

pma-web

Frontend implementation guide for React 19 + TypeScript + Vite 8 monorepo projects. Covers tech stack, project structure (bun workspaces), state management (TanStack Query for async requests + Zustand for client state), UI (shadcn/ui + Tailwind CSS 4.2), theming (light/dark/system), i18n (react-i18next), routing (React Router 7), and coding conventions. Use when scaffolding, developing, or reviewing frontend web applications.

🇺🇸|EnglishTranslated
25
Frontend Developmentsyncfusion/react-ui-compo...

syncfusion-react-dialog

Create interactive dialogs and modal windows in React with Syncfusion DialogComponent. Implement modal/modeless dialogs with custom positioning, dragging, resizing, animations, templating, and keyboard navigation. Use this skill whenever the user needs to display dialog boxes, modal windows, confirmation prompts, forms in popups, floating panels, or complex windowed interactions.

🇺🇸|EnglishTranslated
25
Frontend Developmentsyncfusion/wpf-ui-compone...

syncfusion-wpf-percent-textbox

Use this skill when implementing Syncfusion WPF PercentTextBox controls for percentage input handling. Provides comprehensive guidance on value binding, min/max validation, number formatting with culture support, appearance customization with positive/negative/zero foregrounds, interactive features like scroll intervals and range adorners, watermark text, and data binding patterns for percentage-based input controls with international format support.

🇺🇸|EnglishTranslated
25
Frontend Developmentsyncfusion/wpf-ui-compone...

syncfusion-wpf-map

Implement Syncfusion WPF Maps (SfMap) control for geographical data visualization in Windows Presentation Foundation applications. Use this when displaying geographical data, rendering shape files, or integrating map layers with markers and bubbles. This skill covers ShapeFileLayer, ImageryLayer, map customization, legends, OpenStreetMap/Bing Maps integration, and interactive map features.

🇺🇸|EnglishTranslated
25
Frontend Developmentsyncfusion/pdf-viewer-sdk...

syncfusion-react-pdf-viewer

Implements the Syncfusion React PDF Viewer (PdfViewerComponent) for embedding, configuring, and loading PDF documents. Use this when rendering PDFs in a React application, embedding viewer controls, or generating TSX/HTML code for PDF display and interaction.

🇺🇸|EnglishTranslated
25
Frontend Developmentworkleap/wl-squide

workleap-react-best-practices

React performance optimization guidelines for Single Page Applications (SPA) at Workleap. Use when writing, reviewing, or refactoring React SPA code to ensure optimal performance patterns. Triggers on tasks involving React components, state management, bundle optimization, re-render prevention, rendering performance, or JavaScript performance improvements. Covers async waterfall elimination, bundle size reduction, re-render optimization, rendering efficiency, JS micro-optimizations, and advanced React patterns. Does NOT cover server-side rendering (SSR), Next.js, or server components.

🇺🇸|EnglishTranslated
25
Frontend Developmentl3digital-net/claude-code...

qt-qml

QML and Qt Quick — declarative UI language for modern Qt applications. Use when building a QML-based UI, embedding QML in a Python/C++ app, exposing Python/C++ objects to QML, creating QML components, or choosing between QML and widgets. Trigger phrases: "QML", "Qt Quick", "declarative UI", "QQmlApplicationEngine", "expose to QML", "QML component", "QML signal", "pyqtProperty", "QML vs widgets", "QtQuick.Controls", "Item", "Rectangle"

🇺🇸|EnglishTranslated
25
Frontend Developmenthyperb1iss/hyperskills

tui-design

This skill should be used when designing terminal user interfaces, creating TUI layouts, choosing TUI color schemes, implementing keyboard navigation, building terminal dashboards, or working with any TUI framework. Activates on mentions of TUI design, terminal UI, Ratatui layout, Ink components, Textual widgets, Bubbletea views, terminal color palette, keybinding design, panel layout, split panes, terminal dashboard, box-drawing characters, sparklines, progress bars, modal dialogs, focus management, or terminal accessibility.

🇺🇸|EnglishTranslated
25
Frontend Developmentvercel-labs/json-render

svelte

Svelte 5 renderer for json-render that turns JSON specs into Svelte component trees. Use when working with @json-render/svelte, building Svelte UIs from JSON, creating component catalogs, or rendering AI-generated specs.

🇺🇸|EnglishTranslated
25
1...6768697071...428
Page