Get a week free of Claude Code →

Skills tagged "frontend" (1279)

1279 Claude Code skills tagged "frontend". Test each skill in the interactive playground.

🧪 Jest Test
This skill generates and runs Jest tests for JavaScript and TypeScript projects, streamlining unit, integration, and E2E testing.
testingunit-testsintegration-testsfrontend
🧪 Jotai Expert
This skill helps you design, implement, and optimize Jotai atom-based state in React apps, boosting performance and maintainability.
frontendperformancetestingrefactor
🎨 Jp Ui Consumer
Use when consuming jp-ui in an app: installation, CSS/theme setup, component selection, and token usage; guide Codex to the jp-ui docs and types for implementation details.
yumehikofrontend
🎨 Js Efficiency
This skill helps optimize JavaScript performance by applying caching, batch DOM updates, and loop efficiency patterns across projects.
performancedebuggingrefactorcode-review
🎨 Js Micro Utilities
This skill helps you optimize JavaScript tasks by prioritizing native APIs and lightweight utilities for objects, arrays, strings, numbers, and functions.
frontendperformancescriptingautomation
🎨 Js Ts Fp
This skill helps you apply functional programming principles to TypeScript and JavaScript by analyzing codebases first and guiding pure, immutable design.
typescriptjavascriptrefactorcode-review
🎨 Json Render Templates
This skill helps you generate UI templates like flowcharts, forms, dashboards, and galleries as ready-to-emit JSON payloads for rapid visualization.
frontenddataanalyticsdesign
🧪 Kieran Typescript Reviewer
This skill performs a rigorous TypeScript code review applying Kieran's strict conventions to ensure type safety, maintainability, and testability.
typescriptcode-reviewtestingfrontend
🎨 Kobalte
This skill helps you implement accessible, headless Kobalte components in SolidJS, ensuring proper structure and focus management with portals and roots.
solidaccessibilityfrontendux
🎨 Koota
This skill helps you build data-oriented ECS in React using Koota, enabling reactive queries and trait-driven world management.
datafrontenddebuggingperformance
🎨 Kor Ui
This skill helps you implement and themify the Universal UI library in React Native and Expo, guiding provider setup, components, theming, and troubleshooting.
frontendperformancedebuggingdocs
🎨 Ladakhride Ui Review
This skill analyzes LadakhRide UI to feel human-made, suggests subtle improvements in spacing, animation, and storytelling for authentic, professional design.
designuxfrontendaccessibility
🎨 Laravel 11 12 App Guidelines
Guidelines and workflow for working on Laravel 11 or Laravel 12 applications across common stacks (API-only or full-stack), including optional Docker Compose/Sail, Inertia + React, Livewire, Vue, Blade, Tailwind v4, Fortify, Wayfinder, PHPUnit, Pint, and Laravel Boost MCP tools. Use when implementin
thienanblogfrontend
🎨 Laravel Fullstack
This skill helps you rapidly build and debug Laravel Blade views with Alpine.js and Tailwind, boosting UI reliability and developer productivity.
fullstackfrontenddebuggingrefactor
🧪 Leapsdk Skills
This skill helps you integrate on-device AI with LEAP Edge SDK for Android and iOS, enabling streaming conversations and offline inference.
aifrontendintegration-testsperformance
🎨 Line Area Chart
This skill helps you build reusable line and area charts in Vue 3, enabling time-series visualization with flexible formatting and legends.
vuedataanalyticsfrontend
🎨 Linpingzhi
This skill helps you develop HarmonyOS NEXT native apps with ArkTS/ArkUI, delivering high-quality code and performance aligned with Huawei guidelines.
frontendperformancecode-reviewdocs
🎨 Liquid Glass
This skill helps you implement Liquid Glass UI in SwiftUI using the glassEffect API for modern, interactive, and morphing designs.
frontenddesignuxperformance
🎨 Lit Best Practices
Lit web components best practices and performance optimization guidelines. Use when writing, reviewing, or refactoring Lit web components. Triggers on tasks involving Lit components, custom elements, shadow DOM, reactive properties, or web component performance.
artmsilvafrontend
🧪 Lit Component
This skill guides you in developing lit web components for Common UI v2, enabling theme integration and Cell-driven reactivity.
frontenddebuggingdesignux
🎨 Localize
This skill helps you localize ryOS apps by extracting strings, replacing with translation keys, and syncing translations across languages.
frontendtypescriptreact
🎨 Magazine Layout
This skill converts plain text into professional magazine-style HTML pages with Tailwind CSS, offering style selection and optional PDF export.
frontenddesigncontentwriting
🧪 Magento2 Widget Creation
This skill guides building Magento 2 CMS widgets, including module setup, configuration, templates, and optional JavaScript for interactive content.
frontendbackendfullstackapi
🎨 Makepad Animation
This skill helps you implement Makepad animation patterns, generating code and answering questions about states, transitions, and timelines for dynamic UI.
frontendcode-reviewaiscripting
🎨 Makepad Event Action
This skill helps you handle Makepad events and actions, enabling widget-to-parent communication and robust event flow.
frontenddebuggingrefactordocs
🎨 Makepad Router
This skill routes Makepad questions to the appropriate sub-skills, enabling fast, accurate answers across widgets, layout, events, and shaders.
aiproductivityfrontenddesign
🎨 Managing Media
This skill helps you implement comprehensive media and file management components, enabling efficient uploads, rich galleries, adaptive players, and optimized
frontendbackendfullstackperformance
🎨 Mantine React Component Dev
Development guidelines and patterns for building React component libraries with Mantine UI, TypeScript, and modern tooling. Use this skill when creating, editing, or maintaining Mantine-based React components, implementing Styles API patterns, managing component composition, or working with TypeScri
gfaziolifrontend
🎨 Mapbox Search Integration
This skill helps you implement Mapbox search end-to-end, from discovery questions to production-ready integration with best practices.
frontendjavascriptapireact
🎨 Mapbox Store Locator Patterns
This skill helps you build interactive Mapbox store locators with markers, filtering, distance calculations, and synced lists and details.
javascriptfrontenddata
🧪 Mapbox Style Patterns
This skill provides battle-tested map style patterns and layer configurations for common use cases like restaurants, real estate, data visualization, and
frontendjavascriptdataanalytics
🎨 Marimo
Guide for creating and working with marimo notebooks, the reactive Python notebook that stores as pure .py files. This skill should be used when creating, editing, running, or deploying marimo notebooks.
maragudkfrontend
🎨 Markdown Url
This skill rewrites website URLs through markdown.new to extract clean Markdown content for notes and summaries.
docswritingcontentproductivity
🎨 Mc Map Visualize
This skill generates a zoomable HTML visualization of a spatial map, highlighting walkability, hazards, resources, and observation confidence for debugging and
pythondatadebuggingfrontend
🎨 Mermaid
This skill helps you create Mermaid diagrams for Markdown documentation, enabling quick visualizations of flows, architectures, and data models.
docsdatafrontendpython
🎨 Mermaid
This skill helps you generate and validate mermaid diagrams for flowcharts, sequences, and mind maps to document processes and architectures.
frontendbackendapidocs
🎨 Mermaid Diagramming
This skill helps you create and integrate Mermaid diagrams in Obsidian notes to visualize processes, architectures, and workflows.
designfrontenddocsproduct
🎨 Mermaidjs V11
This skill helps you create Mermaid.js v11 diagrams quickly, converting code into SVG/PNG/PDF and embedding in markdown or webpages.
frontendapidatabasedata
🎨 Microsim Add Icons
This skill adds clickable Creative Commons and fullscreen icons to a MicroSim control area, improving accessibility and navigation.
frontendaccessibilityscriptingux
🎨 Midscene Automation
This skill enables hands-free browser automation using natural language to navigate, extract data, and interact with web pages via Midscene CLI.
automationclidatadebugging
🎨 Migrate Oai App
This skill guides migrating OpenAI Apps SDK apps to MCP Apps SDK with step-by-step API mapping, CSP notes, and migration references.
migrationdocstypescriptfrontend
🎨 Miniprogram Development
This skill assists building WeChat Mini Programs with CloudBase, handling authentication, deployment, and AI model calls across miniprogram and cloudfunctions.
cloudfrontendaidebugging
🛡️ Mng Api Browser
This skill helps you operate Kuroco mng_api from a browser, enabling discovery, execution, and schema access with authenticated fetch.
apifrontendautomationsecurity
🧪 Mobbin Ux
This skill discovers Mobbin UX patterns, generates a design spec for approval, then implements research-backed interfaces.
designuxresearchfrontend
🎨 Mobile
Mobile development with React Native, Flutter, and native patterns
miles990frontend
🧪 Mobile Android
This skill helps you build native Android apps efficiently with Jetpack Compose UI, data management, Firebase integration, and Play Store deployment.
kotlinfirebasefrontendapi
🎨 Mobile App Builder
You are an expert mobile app developer, skilled in creating beautiful and high-performance applications for both iOS and Android. You are proficient with cross-platform frameworks like React Native and Flutter, as well as native development with Swift and Kotlin. You have a strong understanding of m
aibangjuxinfrontend
🎨 Mobile App Design Mastery
This skill delivers production-grade mobile UI design guidance for Flutter and native apps, improving touch targets, typography, spacing, and platform-aware
designuxperformanceproduct
🧪 Mobile Developer
This skill helps you build cross-platform mobile apps with React Native or Flutter, including offline sync, push notifications, and platform-ready deployments.
frontendfullstackapiperformance
🛡️ Mobile Developer Skill
This skill provides expert native iOS and Android development guidance to maximize performance and OS feature integration.
performancesecuritydebuggingtesting
🎨 Mobile First Design
This skill helps design mobile-first responsive interfaces by guiding breakpoints, touch targets, and progressive enhancement for performance and accessibility.
designuxfrontendperformance
🎨 Mobile Pro
This skill helps you master cross-platform mobile performance by leveraging Expo SDK 54, React Native Fabric, and Compose Multiplatform for native-like 120fps
performancedebuggingfrontendscripting
🎨 Mobile Ui
This skill helps you optimize mobile UI for responsive layouts, safe areas, touch targets, and typography across iPhone models.
frontenduxperformancetailwind
🧪 Mockzilla Mock Maker
This skill generates high-fidelity stateless mocks and dynamic schemas using Faker and JSON Schema for realistic API responses.
aiautomationapidata
🎨 Modal
This skill guides you to implement and open imperative modals with createModal from @lobehub/ui, boosting modal UX consistency.
frontendreacttypescriptux
🧪 Modern Best Practice React Components
This skill helps you build clean, modern React components using best practices for clarity, maintainability, and correct state usage.
frontendcode-reviewtestingperformance
🎨 Modern Css
This skill helps you adopt modern CSS practices for responsive layouts, color systems, and animations, boosting maintainability and visual quality across
frontendperformancerefactorcode-review
🎨 Morphing Icons
This skill helps you design morphing icons by transforming three-line SVGs between states, enabling smooth, scalable icon transitions.
frontenduxtypescriptdesign
🎨 Motion
This skill helps you implement Motion Vue animations in Vue 3 and Nuxt with motion component usage, gestures, and scroll effects.
frontenduxperformance
🎨 Motion Canvas Skills
This skill helps you create programmatic motion graphics with TypeScript using Motion Canvas to build synchronized animations for videos and presentations.
frontendproductdocs

More Tags

automation (2772) ai (1905) testing (1783) backend (1548) scripting (1540) debugging (1486) code-review (1426) docs (1343) api (1308) productivity (1166) devops (1160) data (1050) workflow (1015) cli (1007) performance (984) security (836) analytics (822) design (787) python (653) ci-cd (633)

Get the best new skills
in your inbox

Weekly roundup of top Claude Code skills, MCP servers, and AI coding tips.