Skills tagged "frontend" (1279)

🎨 Remix

This skill helps you understand and navigate Remix documentation to build robust routes, loaders, actions, and data management in your app.

remixfrontendfullstackreact

2

🎨 Report Generation

This skill generates comprehensive data analysis HTML reports by querying data, performing deep cause analysis, and delivering visualizations and insights.

dataanalyticssqldatabase

2

🎨 Researcher

This skill helps you research topics efficiently by running parallel agent queries to compare options, libraries, and implementations.

researchproductivityautomationai

2

🎨 Responsive Design

Responsive web design patterns for mobile-first development. Use for creating fluid layouts, breakpoint systems, responsive typography, flexible grids, and adaptive components. Triggers on requests for responsive layouts, mobile-first CSS, breakpoints, media queries, fluid design, or multi-device su

ibuttersfrontend

2

🛡️ Review

This skill reviews PRs using comprehensive criteria across security, correctness, performance, accessibility, i18n, and code quality to speed up reviews.

frontendcode-reviewtestingsecurity

2

🧪 Rxjs

This skill helps you implement RxJS observables, apply operators, manage memory with unsubscribe patterns, and build reactive data pipelines in Angular.

frontenddebuggingtestingrefactor

2

🧪 Scientific Luxury

This skill helps you enforce the Scientific Luxury design system for new React components, UI styling, and animations, ensuring OLED black and spectral colours.

designfrontenduxperformance

2

🎨 Sentry Setup Logging

Setup Sentry Logging in any project. Use this when asked to add Sentry logs, enable structured logging, setup console log capture, or integrate logging with Sentry. Supports JavaScript, TypeScript, Python, Ruby, React, Next.js, and other frameworks.

troykellyfrontend

2

🎨 Sentry Setup Tracing

Setup Sentry Tracing (Performance Monitoring) in any project. Use this when asked to add performance monitoring, enable tracing, track transactions/spans, or instrument application performance. Supports JavaScript, TypeScript, Python, Ruby, React, Next.js, and Node.js.

troykellyfrontend

2

🛡️ Setup

This skill sets up Clerk authentication across frameworks by following official quickstart guides and configuring keys to secure your app.

frontendbackendautomationsecurity

2

🎨 Shadcn

shadcn/ui component library patterns with Radix UI primitives and Tailwind CSS. Use when creating tables, forms, dialogs, cards, buttons, or any UI component using shadcn/ui, installing shadcn components, or styling with shadcn patterns.

blencorpfrontend

2

🎨 Shadcn Base

This skill helps you navigate and apply Base UI patterns from shadcn/ui, accelerating component usage, theming, and forms integration.

frontenddesignuxshadcn

2

🎨 Shadcn Svelte

This skill helps you implement accessible shadcn-svelte UI patterns and trigger snippets for Dialog, Tooltip, Dropdown, and Sheets.

frontendaccessibilitydesignux

2

🧪 Skill

This skill captures before-and-after screenshots for visual UI comparisons by comparing two URLs or images.

frontendtestingautomationcli

2

🎨 Slides Generator

This skill generates interactive presentation slides using React and Tailwind, orchestrating parallel subagents to deliver a complete, ready-to-run deck.

frontendautomationaidocs

2

🎨 Snippets_flutter Stream Widget

This skill helps you build reactive Flutter UIs by streaming widgets in the build method, enabling dynamic updates and efficient data handling.

flutterfrontendperformance

2

🎨 Sounds On The Web

This skill helps reviewers audit audio feedback in UI for accessibility and UX, outputting file:line findings to guide improvements.

accessibilityfrontendcode-reviewdebugging

2

🧪 Storybook

This skill helps you document UI states and design decisions with Storybook artifacts for review by engineers and QA.

designdocsuxaccessibility

2

🧪 Storybook

This skill helps you author and visualize component stories in Storybook for Svelte CSF with defineMeta, argTypes, and snippets.

frontendtestingdocsmonitoring

2

🎨 Streamdown

Expert guidance for Vercel's Streamdown library - a streaming-optimized react-markdown replacement for AI applications. Use when: (1) Rendering AI-generated markdown from useChat/streamText, (2) Building chat UIs with streaming responses, (3) Migrating from react-markdown to streaming-friendly rende

bjornmelinfrontend

2

🎨 Super Search

This skill helps you quickly recall past coding work and decisions by querying Supermemory across sessions and repositories.

javascripttypescriptscriptingai

2

🎨 Svg Icon Best Practice

This skill unifies SVG icon management in React TypeScript projects by converting inline SVGs into reusable components and enforcing naming and migration

reacttypescriptmigrationrefactor

2

🎨 Table Filters

This skill analyzes table columns and delivers a unified header filter with adaptive filter components for an optimal filtering UX.

frontenduxdataanalytics

2

🎨 Tailwind Patterns

Apply modern Tailwind v4 practices, CSS-first configuration, and responsive patterns

vudovnantigravity-kitfrontend

2

🎨 Tailwindcss Development

This skill helps you style applications with Tailwind CSS v4 by guiding responsive, dark-mode, and component extraction patterns.

frontenddesignuxdebugging

2

🎨 Tangzhan Skill Code Simplier

This skill analyzes recently modified code to simplify and optimize clarity and consistency while preserving all functionality and behavior.

code-reviewrefactorformattinglinting

2

🎨 Tanstack Query

TanStack React Query patterns - use for data fetching, caching, mutations, optimistic updates, and server state management

ashchupliakfrontend

2

🎨 Tapforce Sveltekit

This skill helps you set up and develop SvelteKit projects with best practices for modern features, tooling, and migrations.

sveltekitsveltejavascriptfrontend

2

🎨 Taro Docs

This skill provides comprehensive Taro framework guidance, covering APIs, components, configuration, and development practices for multi-platform projects.

frontendapidocsfullstack

2

🛡️ Tauri Sidecar

This skill helps embedding and executing external binaries (sidecars) in Tauri apps, covering configuration, cross-platform naming, and Rust/JS APIs.

cliscriptingbackendfrontend

2

🎨 Tesla Dashboard Ui

This skill helps you design and implement a Tesla-inspired dashboard UI for iPad using atomic design, dark glassmorphism, MapKit navigation, and media controls.

designfrontendaccessibilityproduct

2

🧪 Test Generator

This skill automatically generates tests by detecting the project framework and applying appropriate Jest, Vitest, RTL, or Playwright templates.

testingfrontendautomationunit-tests

2

🧪 Testing

This skill helps you implement comprehensive testing and deployment workflows for Angular apps, covering unit, E2E tests, mocks, CI/CD, and production

testingci-cddevopsfrontend

2

🧪 Ti Ui

This skill guides you through Titanium SDK UI patterns, performance, and platform-specific components to optimize layouts and interactions.

frontenduxaccessibilityperformance

2

🎨 Typescript

TypeScript standards and best practices with modern tooling. Use when working with TypeScript or TypeScript React files.

siviter-xyzfrontend

2

🎨 Typescript React Reviewer

Expert code reviewer for TypeScript + React 19 applications. Use when reviewing React code, identifying anti-patterns, evaluating state management, or assessing code maintainability. Triggers: code review requests, PR reviews, React architecture evaluation, identifying code smells, TypeScript type s

dotneetfrontend

2

🎨 Typescript Rules

This skill enforces React and TypeScript frontend best practices for type safety, component design, state management, and error handling.

frontendcode-reviewlintingdebugging

2

🎨 Ui Design A11y

This skill helps you audit and fix web accessibility issues for WCAG compliance, providing actionable code fixes and guidance.

accessibilityfrontenddesigncode-review

2

🧪 Ui Design Review

This skill analyzes UI design screenshots and prompts for accessibility, consistency, and usability using Gemini multimodal capabilities to guide reviews.

designuxaccessibilityai

2

🎨 Ui Designer

UI design system toolkit for Senior UI Designer including design token generation, component documentation, responsive design calculations, and developer handoff tools. Use for creating design systems, maintaining visual consistency, and facilitating design-dev collaboration.

majiayu000frontend

2

🎨 Ui Engineer

This skill helps you transform PRD-based UI concepts into production-ready HTML/CSS with Tailwind, ensuring minimalist, responsive interfaces.

frontenddesignuxtailwind

2

🎨 Ui Ux Design

UI/UX design reference database. 50+ styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: web

samhvw8frontend

2

🎨 Ui Ux Pro Max

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, l

intrusive-memoryfrontend

2

🎨 United Airlines Baggage Fee Calculator

This skill opens the United Airlines baggage fee calculator page for quick access to check potential bag costs.

apifrontendproductdocs

2

🎨 Use_interesting_fonts

This skill helps you elevate frontend typography by selecting high-impact Google Font pairings and enforcing distinctive, consistent styles.

frontenddesignbrandingux

2

🎨 Using Sentry

This skill helps you instrument applications with Sentry by capturing exceptions, adding context, tracing performance, and enabling structured logging.

backendfrontendobservabilityperformance

2

🛡️ Vercel Deploy

This skill guides you through deploying to Vercel with zero-configuration builds, secure environments, and production-ready workflows.

devopscloudfrontendci-cd

2

🧪 Viewcomponents Specialist

This skill helps you implement robust Rails ViewComponents with proper method exposure, slots, and previews, ensuring clean isolation and safe view access.

frontendbackendcode-reviewtesting

2

🎨 Visualizing With Mermaid

This skill helps you create clear, professional Mermaid diagrams with dark mode styling and semantic colors for focused architecture visuals.

frontendapidocsdesign

2

🎨 Vite

Vite next-gen frontend tooling: dev server, HMR, build, config, plugins, Environment API, Rolldown. Keywords: vite.config, bundler.

itechmeatfrontend

2

🎨 Vue

This skill helps you develop Vue 3 applications using the Composition API, reactivity, and best practices from official Vue documentation.

frontenddocsdebuggingrefactor

2

🎨 Vue Best Practices

Vue.js 3 best practices guidelines covering Composition API, component design, reactivity patterns, Tailwind CSS utility-first styling, PrimeVue component library integration, and code organization. This skill should be used when writing, reviewing, or refactoring Vue.js code to ensure idiomatic pat

dedalus-erp-pasfrontend

2

🧪 Vue Dev

This skill helps you generate modern Vue TypeScript components using Composition API, VueUse, Tailwind, accessibility, performance patterns, and Vitest testing.

vuetypescripttailwindfrontend

2

🎨 Vue Fsd

This skill helps you structure large Vue 3 projects with Feature-Sliced Design, enforcing layers, public API, and scalable boundaries.

frontenddesignrefactorcode-review

2

🧪 Vue Testing

This skill helps you master Vue testing with Vitest, Vue Test Utils, and Playwright to deliver reliable unit, component, and e2e tests.

testingunit-testsintegration-testsfrontend

2

🎨 Vue3 Best Practices

This skill helps you adopt modular, type-safe Vue 3 practices with composition API, Pinia, and performance tips for scalable apps.

vuefrontendperformancerefactor

2

🎨 Vuejs

This skill helps you answer Vue.js questions clearly by applying best practices, built-ins, and component concepts from official guidance.

vuefrontendjavascriptdocs

2

🧪 Web Design Builder

This skill generates accessible, responsive HTML/JS web designs from descriptions, with automated verification and optional framework support.

frontenduxaccessibilitytesting

2

🎨 Web Design Mastery

This skill helps you craft production-grade UI with consistent spacing, typography, color, and depth using Refactoring UI-inspired principles.

designuxfrontendaccessibility

2

🎨 Web Development

Master modern web development. Learn HTML/CSS/JavaScript fundamentals, React/Vue/Angular frameworks, Node.js backend, databases, APIs, and full-stack architectures. Use when building web applications, learning web technologies, or choosing tech stacks.

pluginagentmarketplacefrontend

2