NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
antv-g2-chart skill This skill guides agents through building and tuning G2 v5 visualizations, diagnosing rendering problems, and handling V4 migrations. Use it when chart code is part of the task.
CX Codex +1
1,400installs
axiom-swiftui skill A routing skill for SwiftUI work: takes a symptom like a stale view or janky scroll and points to the right reference, auditor or debugging path.
CX Codex +1
1,500installs
storefront-best-practices skill This skill guides storefront work, from product pages and carts to checkout flows. Use it when building or changing an online store interface.
CX Codex +1
4,600installs
design-review skill The skill scores a screen or flow across six weighted dimensions, runs Nielsen's heuristics and returns a prioritized findings table.
CX Codex +1
594installs
rams skill Reviews UI components for WCAG 2.1 compliance and visual styling bugs. Handy when auditing front-end code before shipping.
CX Codex +1
3,000installs
building-admin-dashboard-customizations skill Guides AI agents in building Medusa Admin dashboard extensions, widgets, and custom UI routes. Essential when customizing store management panels.
CX Codex +1
4,400installs
Frontend Responsive Design Standards skill A skill that gives your coding agent rules for mobile-first layouts: breakpoints, relative units, touch targets and content priority.
CX Codex +1
1,200installs
favicon-gen skill Generates complete favicon packages and web manifests from logos, text monograms, or brand colors. Provides clean HTML markup for site headers.
CX Codex +1
2,200installs
ui-ux skill A skill that makes the agent follow a design process: brief, 2–3 wireframes, then code. Built for dashboards, tables, forms and modals.
CX Codex +1
884installs
a11y-audit skill Audits UI and design against WCAG 2.2 and ARIA patterns. It checks contrast, keyboard navigation, and screen-reader readiness with concrete severity ratings.
CX Codex +1
550installs
frontend-design-deslop skill A skill that steers generated interfaces away from the default AI look: typography, OKLCH color, design tokens, dark mode, accessibility.
CX Codex +1
4,800installs
building-storefronts skill A skill for building Medusa storefronts: it tells the agent how to call APIs through the SDK and React Query without breaking requests.
CX Codex +1
4,200installs
sentry skill Guides an agent through Sentry error capture and performance tracing in Next.js code. Use it while adding Sentry instrumentation to an application.
CX Codex +1
2,800installs
react-doctor skill The skill scans a React codebase against 47+ rules and returns a 0-100 score with file paths and line numbers. Handy before a review or when the app drags.
CX Codex +1
2,800installs
bun skill Configures the assistant to use the Bun runtime instead of Node.js and npm. Replaces heavy npm packages with built-in APIs.
CX Codex +1
2,800installs
favicon skill Creates favicon files from one source image, then updates the web manifest and project HTML. Use it when adding or replacing site icons.
CX Codex +1
2,800installs
design-tokens skill Create, extend, and validate DTCG design tokens with a three-tier structure. Useful for palettes, typography, theming, and other interface values.
CX Codex +1
538installs
redesign skill This skill audits an existing interface and revises its design while preserving working features. Use it to refresh a website or app without changing its core behavior.
CX Codex +1
535installs
mvvm-toolkit-di
official skill Wires CommunityToolkit.Mvvm ViewModels into Microsoft.Extensions.DependencyInjection across WPF, WinUI 3, .NET MAUI, Uno, and Avalonia projects.
92installs
apply-aesthetic skill Picks a visual direction — an archetype or a named design system — and resolves it into your project's tokens. Useful when you want a specific look, not whatever the agent improvises.
CX Codex +1
529installs
experience-ui-bundle-project-generate skill Generates a ready-to-develop Salesforce UI bundle starter project from a template via Salesforce CLI. Use it when scaffolding a fresh React or Angular SFDX app.
CX Codex +1
3,200installs
platform-lightning-type-widget-coordinate skill Coordinates an Apex-backed Lightning Type with an HXL widget. Use it when a request explicitly names a Lightning Type or an @apexClassType/... schema.
CX Codex +1
3,200installs
design-code skill This skill generates component and screen code for a requested framework. Use it when you need token-based UI with accessibility checks.
CX Codex +1
525installs
shopify-liquid-themes skill Tells the agent how Shopify theme files are organised and how Liquid works, so it can write sections, blocks and snippets that fit the existing structure.
CX Codex +1
3,600installs
platform-conventions skill The skill maps what iOS and Android each mandate in their interfaces, where the two diverge, and when a single cross-platform design makes sense.
CX Codex +1
1,100installs
law-of-continuity skill A skill about the Law of Continuity: alignment, arrows and lines set the path the eye follows across an interface. Useful for forms, carousels and timelines.
CX Codex +1
1,100installs
law-of-closure skill Teaches the agent to build UI on implied boundaries: drop redundant borders, draw icons from minimal cues, and let negative space carry the structure.
CX Codex +1
1,100installs
law-of-figure-ground skill A skill that sorts out which layer of an interface reads as foreground and which as background, and helps you set that relationship on purpose.
CX Codex +1
1,100installs
law-of-similarity skill Applies the Gestalt Law of Similarity to group UI elements across distance using shared color, shape, and size. Useful for unifying components without altering layout.
CX Codex +1
1,100installs
design-component skill Produces UI component specifications covering anatomy, 8 interactive states, tokens, and accessibility. Useful when designing components in a design system before coding.
CX Codex +1
522installs
playwriter skill This skill connects an agent to the Chrome tab you already have open through the Playwriter CLI. Use it to inspect live UI, run page actions, or reproduce a frontend bug.
CX Codex +1
2,700installs
mvvm-toolkit
official skill Guides GitHub Copilot to scaffold ViewModels, source generator attributes, commands, and validation for CommunityToolkit.Mvvm.
89installs
design-qa skill This skill sets up checks for tokens, contrast, accessibility, and visual regressions. Use it to QA a component or screen before release.
CX Codex +1
516installs
vitest-midscene-e2e skill Connects Vitest with Midscene to build AI-driven UI tests across Web, Android, and iOS using natural language. It scaffolds projects and runs tests without fragile element selectors.
CX Codex +1
2,100installs
chrome-extension skill Guides agents through Chrome extension work with Manifest V3. Use it for manifests, content scripts, background logic, browser APIs, and Chrome Web Store releases.
CX Codex +1
4,500installs
brandkit skill Build a token-based design foundation from a product brief, with separate light and dark themes and contrast checks. Use it to establish shared visual rules before designing screens.
CX Codex +1
510installs
aesthetic skill A skill that walks your coding agent through interface design: reading other people's layouts, generating design images, and iterating until they hold up.
CX Codex +1
714installs
triage-frontend-issues skill A skill that clears noise from the sentry/javascript issue queue in Sentry and leaves real bugs for a human.
CX Codex +1
1,300installs
ui-designer skill Extracts a design system from UI screenshots and prepares an implementation prompt for React. Use it when a new interface needs to follow reference visuals.
CX Codex +1
1,600installs
crxjs skill A skill for building Chrome extensions with CRXJS: it walks the agent through real HMR for popup, content scripts and side panels. Useful when your extension already builds on Vite.
CX Codex +1
4,300installs
1,121–1,160 of 2,909
