MCP Server Hub
MCP Skill Hub

Skill category

Frontend

Web frameworks, components, CSS, and browser application code. Discover source-linked skills that teach agents repeatable workflows.

63 listings in this category

All Frontend listings

63 organic results

⌘

Emil Design Eng

Emil Kowalski's design-engineering philosophy for UI polish, components, animation, and production-ready frontend craft.

ui-skillsai-media
⌘

Rams

Real-time design feedback skill focused on accessibility, spacing, typography, contrast, and component quality.

ui-skillsdeveloper-tools
⌘

React Doctor

Run React Doctor to detect regressions in security, performance, correctness, and architecture, with score-based quality checks.

ui-skillssecurity
⌘

Budge

Use when making single-property CSS or Tailwind visual changes in Next.js App Router projects. Presents a floating control widget for live tuning before persisting.

ui-skillsdeveloper-tools
⌘

Vueuse Functions

Apply VueUse composables to build concise, maintainable Vue and Nuxt features.

ui-skillsdeveloper-tools
⌘

Vue Testing Best Practices

Vue testing guidance using Vitest, Vue Test Utils, component testing, mocking, and Playwright E2E.

ui-skillsbrowser-automation
⌘

Vue Router Best Practices

Vue Router 4 patterns covering navigation guards, route params, and route lifecycle interactions.

ui-skillsdeveloper-tools
⌘

Vue Best Practices

Vue.js best practices emphasizing Composition API with script setup and TypeScript.

ui-skillsdeveloper-tools
⌘

Vue

Vue 3 Composition API and reactivity guidance for SFCs, script setup macros, and built-in components.

ui-skillsdeveloper-tools
⌘

Vitepress

VitePress documentation site guidance for configuration, theming, and Markdown plus Vue content.

ui-skillsproductivity
⌘

Unocss

UnoCSS atomic CSS engine guidance for rules, shortcuts, and presets like Wind, Icons, and Attributify.

ui-skillsdeveloper-tools
⌘

Slidev

Create developer slide decks with Slidev using Markdown, Vue components, code highlighting, and animations.

ui-skillsai-media
⌘

Pinia

Pinia state management best practices for type-safe Vue stores, getters, and actions.

ui-skillsdeveloper-tools
⌘

Nuxt

Nuxt full-stack Vue framework guidance for SSR, auto-imports, file-based routing, and server routes.

ui-skillsdeveloper-tools
⌘

Swiftui Ui Patterns

Best practices and example-driven guidance for building SwiftUI views and components. Includes tab architecture and screen composition.

ui-skillsdeveloper-tools
⌘

ui-ux-pro-max

UI/UX design intelligence for web and mobile. Searchable local database with 84 styles, 192 color palettes, 74 font pairings, 192 product types, 98 UX guidelines, 104 icon entries, 16 GSAP motion presets, and 25 chart types across 22 stacks (React, Next.js, Vue, Nuxt, Svelte, Astro, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, WPF, WinUI, Avalonia, Uno Platform, UWP, Three.js, and HTML/CSS). Use when designing, building, or reviewing UI: pages, components, color schemes, typography, layout, accessibility, animation, or data visualization.

skills.shskills.sh rank 101
⌘

Svelte Code Writer

Official Svelte code-writing skill focused on modern Svelte patterns, component composition, and production-ready implementations.

ui-skillsdeveloper-tools
⌘

React Router Framework Mode

React Router framework-mode patterns for loaders, actions, middleware, route modules, and full-stack rendering flows.

ui-skillsdeveloper-tools
⌘

vercel-react-best-practices

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

skills.shskills.sh rank 4
⌘

Frontend Ui Engineering

Frontend UI engineering guidance covering component architecture, responsive design, accessibility, and maintainable implementation patterns.

ui-skillsdeveloper-tools
⌘

Next Upgrade

Upgrade Next.js to the latest version using official migration guides and codemods.

ui-skillsdeveloper-tools
⌘

Next Cache Components

Next.js 16 Cache Components guidance covering PPR, use cache directive, cacheLife, cacheTag, and updateTag.

ui-skillsdeveloper-tools
⌘

Next Best Practices

Next.js best practices: file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, and optimization.

ui-skillsdata-analytics
⌘

Vue Testing Best Practices

Testing strategies for Vue applications, including component tests, integration tests, and reliability patterns.

ui-skillsdeveloper-tools
⌘

Vue Router Best Practices

Routing architecture and navigation patterns for maintainable Vue Router applications.

ui-skillsdeveloper-tools
⌘

Vue Pinia Best Practices

Patterns for clean, scalable state management in Vue apps using Pinia stores.

ui-skillsdeveloper-tools
⌘

Vue Options Api Best Practices

Best practices for structuring and scaling Vue applications built with the Options API.

ui-skillsdeveloper-tools
⌘

Vue Jsx Best Practices

Guidance for writing robust, type-safe, and readable Vue components using JSX.

ui-skillsdeveloper-tools
⌘

Vue Debug Guides

Practical debugging workflows for diagnosing and fixing Vue reactivity, rendering, and state issues.

ui-skillsproductivity
⌘

Vue Best Practices

Core Vue development best practices for component architecture, reactivity, and maintainable code.

ui-skillsdeveloper-tools