Skills tagged "frontend" (1335)

🧪 Dojo Client

This skill helps you connect and bind your game clients to a Dojo world, generating bindings and enabling real-time queries.

frontendbackendapidebugging

3

🎨 Epic Forms

This skill guides you through building Epic Stack forms with Zod validation and Conform for progressive enhancement, including file uploads and honeypot

frontendfullstackreacttypescript

3

🎨 Feature Sliced Design

This skill helps you implement Feature-Sliced Design in Next.js with a custom views layer, delivering scalable, maintainable architecture.

frontenddesignuxproduct

3

🧪 Frontend Ai Guide

This skill helps frontend teams apply rigorous technical decision criteria and anti-pattern knowledge to QA, design decisions, and debugging workflows.

frontenddebuggingtestingcode-review

3

🧪 Frontend Testing Best Practices

This skill helps you implement front-end testing best practices, prioritizing end-to-end tests, minimal mocks, and behavior-focused validation across the UI.

testingfrontendintegration-testsdebugging

3

🧪 Fundamentals

This skill helps you master TypeScript fundamentals, enabling safe typing with basic types, interfaces, and type annotations for robust code.

frontendbackenddocstesting

3

🧪 Gpui

This skill helps you apply GPUI best practices to desktop UI development, improving performance, reliability, and maintainability across views, state, events,

rustfrontendperformancetesting

3

🎨 Graphics Troubleshooting

Debug and fix common issues in Three.js, React Three Fiber, and 3D asset pipelines. Use when encountering visual bugs, performance problems, loading failures, or unexpected behavior. Covers black screens, Z-fighting, memory leaks, shader errors, and physics glitches.

anthemflynnfrontend

3

🎨 Gs Zod Validation

This skill helps you enforce input shape with Zod in the presentation layer, while business rules live in entities and server actions use schemas.

backendfrontendtypescriptnextjs

3

🎨 Makepad Font

This skill helps you configure and render crisp text with Makepad fonts, layouts, and SDF-based GPU rendering.

frontendperformancedocsdesign

3

🎨 Mermaid Diagramming

This skill helps you create and integrate Mermaid diagrams in Obsidian notes to visualize processes, architectures, and workflows.

designfrontenddocsproduct

3

🧪 Mobbin Ux

This skill discovers Mobbin UX patterns, generates a design spec for approval, then implements research-backed interfaces.

designuxresearchfrontend

3

🧪 Mobile

This skill helps you develop mobile apps across iOS, Android, and cross-platform frameworks with best practices and architecture guidance.

aifrontendbackendapi

3

🎨 Modern Tailwind

This skill helps you implement clean, scalable UI with Tailwind CSS by following best practices for utilities, theming, and maintainability.

frontenddesignuxperformance

3

🧪 Openapi Ts V0

This skill generates type-safe TypeScript API clients from OpenAPI specs using @hey-api/openapi-ts with Zod validation.

frontendbackendapiautomation

3

🎨 React Patterns

This skill helps you leverage React 19 patterns including Server Components, Actions, use(), and concurrent features to build scalable, high-performance

reacttypescriptfrontendperformance

3

🎨 Reportlab

Python library for programmatic PDF generation and creation. Use when user wants to generate PDFs from scratch, create invoices, reports, certificates, labels, or custom documents with precise control over layout, fonts, graphics, tables, and charts. Supports both low-level drawing (Canvas) and high

silvainfmfrontend

3

🧪 Review

This skill opens an interactive markdown review UI to inspect content, capture feedback, and export approved changes.

code-reviewproductivityfrontend

3

🎨 Senior Fullstack

Expert full-stack development covering frontend frameworks, backend services, databases, APIs, and deployment for modern web applications.

borgheifrontend

3

🎨 Shadcn Baseui

This skill enforces Base UI patterns in shadcn/ui projects, preventing incorrect Radix UI guidance and ensuring render prop usage.

frontendreactnextjsshadcn

3

🎨 Slides

This skill generates a self-contained, cyberpunk-themed single-file HTML slide deck from user input, delivering a ready-to-share presentation with responsive

frontenddocspythonai

3

🧪 Standards Components

This skill guides building reusable, single-responsibility UI components with clear interfaces and composition for scalable frontend development.

frontenddesignuxaccessibility

3

🎨 Story Check

This skill provides the 12 critical story questions for screenplay evaluation. Covers concept, theme, audience reaction, beginning, ending, rising tensions, characters, protagonist, motivation, antagonist, and believability. Use when: evaluating a screenplay draft, identifying story weaknesses, prep

bybren-llcfrontend

3

🧪 Swift_combine

This skill helps you harness Swift Combine to manage asynchronous data streams with publishers, operators, and UI bindings for reactive apps.

frontenddatadebuggingtesting

3

🎨 Tailwindcss

This skill guides Tailwind CSS v4 usage with utility-first patterns, theme variables, and maintainable composition for scalable UI.

frontenddesignuxproductivity

3

🎨 Tanstack Solid

This skill helps you build type-safe, reactive Solid apps with TanStack Start, Query, Router, Table, and Form patterns.

solidfrontendtypescriptfullstack

3

🎨 Trpc

This skill helps you implement a versatile tRPC setup across backend and frontend, providing type-safe routers, clients, and error handling.

backendfrontendapitypescript

3

🎨 Velt Notifications Best Practices

This skill helps you implement robust notification systems in React and Next.js, covering panels, delivery channels, and user preferences.

reactnextjstypescriptfrontend

3

🎨 Vibefigma

This skill converts Figma designs to production-ready React components with Tailwind CSS, generating TSX files and assets from a provided Figma URL.

frontendclidesignrefactor

3

🧪 Vibium Browser Automation

This skill automates web tasks in Cursor IDE using Vibium, enabling navigation, element interaction, form filling, and screenshot capture.

automationdebuggingscriptingtesting

3

🧪 Vue Composition Api

This skill helps you master Vue's Composition API, building reusable composables and scalable patterns across Script Setup, reactivity, and provide/inject.

frontenddebuggingtestingrefactor

3

🎨 Web Performance Seo

Fix PageSpeed Insights/Lighthouse accessibility "!" errors caused by contrast audit failures (CSS filters, OKLCH/OKLAB, low opacity, gradient text, image backgrounds). Use for accessibility-driven SEO/performance debugging and remediation.

zhanlincuifrontend

3

🧪 Webapp Testing

This skill helps you test local web applications with Playwright, manage servers, and capture diagnostics to verify UI and logs.

testingautomationdebuggingfrontend

3

🧪 2389 Research Css Development

This skill reviews existing CSS for semantic naming, Tailwind @apply usage, dark mode coverage, and tests, providing actionable feedback.

frontendcode-reviewtestinglinting

2

🎨 3d Interaction

This skill helps you implement accurate 3D camera interactions in Three.js by dynamically mapping pixels to world space and enforcing visible boundaries.

frontenddebuggingperformancescripting

2

🎨 Advanced Frontend Skill

This skill helps you craft production-grade frontend interfaces that feel alive with cinematic WebGL, shaders, and premium interactions.

frontenddesignuxperformance

2

🧪 Agent Factory

This skill automates creation of production-ready Claude Code agents with enhanced frontmatter, tool patterns, and MCP integration.

aiautomationbackendfrontend

2

🎨 Agent Teams Skill

This skill coordinates small teams of Claude Code agents to parallelize work on a codebase using isolated worktrees and structured task contracts.

automationdevopsgitpython

2

🧪 Alloy Expert

This skill provides complete Titanium Alloy architecture guidance and automated project detection to design, review, and migrate Alloy projects.

frontendcode-reviewmigrationtesting

2

🧪 Angular Component

This skill helps you create Angular v20+ standalone components using modern DI, signals, and template patterns for scalable UI.

frontendcode-reviewrefactorproductivity

2

🎨 Async Boundary Optimization

This skill optimizes async boundaries in React 18 to balance responsiveness, streaming, and error containment across components.

frontendperformancedebuggingux

2

🎨 Aurora Origin Merge

This skill helps you merge new .origin.ts files into Angular projects without breaking custom logic, preserving behavior and enabling safe regeneration.

angularfrontendcode-reviewrefactor

2

🧪 Auto Generated

This skill helps apply coding patterns from easy_stat_edu to improve JavaScript projects with clear structure and maintainable patterns.

frontendbackendfullstackcode-review

2

🎨 Bar Chart

This skill helps you build and customize bar chart components for grouped, stacked, and horizontal layouts across datasets.

vuedataanalyticsfrontend

2

🎨 Beautiful Reader

This skill renders markdown content in a beautiful, readable layout with theme and display options for distraction-free reading.

docsfrontenduxdesign

2

🛡️ Blazor

This skill helps you build and configure Blazor WASM components with MudBlazor across server and client render modes for admin UIs.

frontendfullstackbackenddevops

2

🎨 Bootstrap Components

This skill should be used when the user asks about Bootstrap components, "how to create a modal", "navbar not collapsing", "carousel autoplay", "responsive card grid", "toast notifications", "dropdown menu", "accordion FAQ", "offcanvas sidebar", "tab navigation", "tooltip not showing", "popover not

sjnimsfrontend

2

🎨 Bootstrap Layout

This skill should be used when the user asks about Bootstrap grid system, Bootstrap containers, Bootstrap breakpoints, Bootstrap columns, Bootstrap rows, Bootstrap gutters, Bootstrap responsive layout, Bootstrap CSS Grid, Bootstrap z-index, Bootstrap row-cols, Bootstrap offset classes, Bootstrap col

sjnimsfrontend

2

🧪 Browser Automation

This skill automates browser testing, design-to-code generation, and accessibility checks to speed web development and quality assurance.

automationtestingfrontenddebugging

2

🧪 Browser Tools

This skill enables automated browser interactions using Chrome DevTools Protocol to navigate pages, extract data, and debug frontends.

frontendtestingdebuggingautomation

2

🎨 Cc10x Router

This skill executes cc10x router workflows by detecting intent, loading memory, and continuously updating state to complete tasks.

automationbackendfrontendcode-review

2

🎨 Chatbot Widget Creator

This skill helps you deploy a production-ready ChatGPT-style chatbot widget with SSE streaming, RAG backend, and performance monitoring.

frontendbackendaiperformance

2

🎨 Check Refine Trpc

This skill identifies components that directly use trpc or react-query hooks and guides replacing them with refine hooks for consistent data access.

frontendreacttypescriptrefactor

2

🌐 Chrome Devtools

This skill enables powerful browser automation and debugging with Chrome DevTools, capturing screenshots, profiling performance, and analyzing network traffic

debuggingautomationfrontendperformance

2

🧪 Code Review

This skill provides structured TypeScript code review guidelines to assess correctness, quality, and performance in pull requests and reviews.

code-reviewtestinglintingrefactor

2

🧪 Code Simplifier

This skill simplifies and clarifies recently changed HTML code by applying project-specific best practices, preserving functionality and improving readability.

frontendrefactorcode-reviewformatting

2

🎨 Code Simplifier

This skill refines recently changed code for readability and maintainability without altering functionality, following project standards.

refactorcode-reviewtypescriptjavascript

2

🎨 Code Style

This skill enforces idiomatic Effect TypeScript style, guiding you to use schemas, pattern matching, and functional patterns for clean, maintainable code.

backendfrontendfullstackcode-review

2

🎨 Codebase Analysis

This skill systematically analyzes a codebase to reveal structure, dependencies, and architectural patterns, helping plan changes and onboard developers

code-reviewanalyticsfrontendbackend

2

🎨 Console Frontend Review

This skill performs focused frontend code reviews for the depot console, enhancing WebSocket teleop reliability, 3D rendering performance, and state-management

frontenddebuggingperformancecode-review

2