Skills and MCP tagged “ui”

impeccable pbakaus skill A skill for your coding agent that designs and reworks interfaces: landing pages, dashboards, forms, iOS and Android screens. Useful when the UI needs real design decisions, not guesswork. Claude Code CX Codex Cursor +1 359,200installs emil-design-eng emilkowalski skill This skill guides UI polish, component details, and animation choices. Use it when an interface works but its states and transitions need closer review. Claude Code CX Codex Cursor +1 385,500installs review-animations emilkowalski skill Reviews UI animation and motion code against Emil Kowalski's design standards. Flags slow easings, non-GPU properties, and unnecessary transitions. Claude Code CX Codex Cursor +1 254,100installs animation-vocabulary emilkowalski skill This skill maps a vague web animation description to the right term. Use it when you need wording for an AI prompt or a designer. Claude Code CX Codex Cursor +1 236,900installs improve-animations emilkowalski skill Surveys motion and animation code across your project, then generates self-contained fix plans. It spots janky keyframes and poor easing without altering source files. Claude Code CX Codex Cursor +1 222,000installs find-animation-opportunities emilkowalski skill Scans a codebase or UI for motion that would clarify states and interactions, while rejecting decoration that gets in the way. It is read-only. Claude Code CX Codex Cursor +1 206,800installs prototype emilkowalski skill The skill builds several genuinely different versions of one piece of UI and puts them behind a visual picker, so you flip through them live and keep the one that feels right. Claude Code CX Codex Cursor +1 172,400installs animate emilkowalski skill Builds UI animations from scratch following Emil Kowalski's motion philosophy. Use it when adding motion, transitions, or component interactions. Claude Code CX Codex Cursor +1 170,400installs hallmark Nutlope skill Enforces strict frontend design constraints to stop coding assistants from producing generic, AI-looking web pages. Claude Code CX Codex Cursor +1 69,100installs ask-sonner emilkowalski skill A guide skill for Sonner, the React toast library: mount the Toaster, pick the right toast() call, style it, fix what breaks. Claude Code CX Codex Cursor +1 138,600installs ui-styling claudekit skill A skill that helps your agent build accessible interfaces with shadcn/ui and Tailwind CSS: components, themes, dark mode, responsive layouts and canvas design. Claude Code CX Codex Cursor +1 40,200installs frontend-ui-engineering addyosmani skill Enforces production standards for component architecture, WCAG 2.1 AA accessibility, and design systems. Stops AI models from defaulting to purple buttons, heavy shadows, and arbitrary spacing. Claude Code CX Codex Cursor +1 66,600installs break-ui emilkowalski skill This skill tests a UI with realistic edge-case data and reports what breaks. Use it to stress-test a component or screen during development. Claude Code CX Codex Cursor +1 63,300installs daisyui saadeghi skill This skill hands your coding agent the daisyUI 5 reference, so it writes markup with real component classes instead of inventing its own. Claude Code CX Codex Cursor +1 12,000installs make-interfaces-feel-better jakubkrehel skill This skill guides small UI refinements, from icon alignment to motion. Use it while building components or reviewing frontend code. Claude Code CX Codex Cursor +1 73,200installs interface-design Dammyjay93 skill This skill guides product UI work for dashboards, admin panels, SaaS apps, and tools. Use it when hierarchy, states, visual direction, and design-system consistency matter. Claude Code CX Codex Cursor +1 30,700installs taste-design official google-labs-code skill Generates agent-ready DESIGN.md files for Google Stitch screens. It sets strict rules for typography, palettes, and spring motion to avoid generic UI tropes. Claude Code CX Codex Cursor +1 20,100installs nuxt-ui nuxt skill Guides AI agents in building interfaces with @nuxt/ui v4, covering semantic Tailwind CSS theming, layout patterns, and component selection. Claude Code CX Codex Cursor +1 19,700installs bmad-agent-ux-designer bmad-code-org skill Activates Sally, a dedicated UX designer persona for crafting interaction design and interface specifications. Helps teams map out user journeys and edge cases before coding. Claude Code CX Codex Cursor +1 11,600installs playground official Anthropic skill Builds interactive HTML playgrounds with controls, a live preview, and a generated prompt. Use it when a topic is easier to explore visually than through plain text. Claude Code 7,967installs better-ui jakubkrehel skill This skill sets concrete rules for surface details, icons, shadows, and motion. Use it to polish an interface after its underlying interactions work. Claude Code CX Codex Cursor +1 38,900installs frontend-design-direction affaan-m skill Sets a product-specific direction for web UI and helps check hierarchy, content states, responsive behavior, accessibility, and rendered results. Claude Code CX Codex Cursor +1 5,300installs stitch::generate-design official google-labs-code skill Turns a text prompt or an image into a finished UI screen through Stitch MCP, then edits it with targeted prompts. Claude Code CX Codex Cursor +1 10,700installs baseline-ui ibelick skill Cleans up AI-generated UI code by fixing layout issues, typography, spacing, and animations. Useful for a fast frontend polish pass before merging. Claude Code CX Codex Cursor +1 24,100installs ui-demo affaan-m skill Records demo videos of a web app with Playwright: visible cursor, steady pacing, a story-shaped flow. Handy for onboarding clips and stakeholder walkthroughs. Claude Code CX Codex Cursor +1 4,700installs make-interfaces-feel-better affaan-m skill This skill helps review and refine interface details such as spacing, typography, interaction states, and motion. Use it when a component feels unfinished or visually off. Claude Code CX Codex Cursor +1 4,600installs better-interface jakubkrehel skill Runs a cross-discipline interface review covering accessibility, layout, copy, typography, color, and UI polish into one ranked report. Claude Code CX Codex Cursor +1 29,700installs better-writing jakubkrehel skill Writes and reviews UI copy, from button labels to errors and empty states. It keeps product vocabulary consistent and guides users to the next step. Claude Code CX Codex Cursor +1 28,700installs transitions-dev Jakubantalik skill Twelve standalone CSS transitions for modals, dropdowns, badges, and card resizes. Helps coding agents wire production-ready UI animations without external libraries. Claude Code CX Codex Cursor +1 1,900installs chakra-ui-builder chakra-ui skill Build responsive, accessible interfaces with Chakra UI v3, add the library to a project, and shape its theme. Useful for components, pages, and layouts. Claude Code CX Codex Cursor +1 3,500installs figma-generate-design official openai skill Turns an app page or multi-section layout into a Figma screen built from your published design system, not hand-drawn boxes. Claude Code CX Codex Cursor +1 2,900installs shadcn-vue unovue skill Teaches coding agents shadcn-vue architecture, proper CLI runners, FieldGroup form composition, and strict Tailwind semantic token rules. Claude Code CX Codex Cursor +1 5,700installs interface-review jakubkrehel skill Audits pull requests, branches, and uncommitted edits for layout, UI, accessibility, and typography regressions. Keeps focus on what changed rather than pre-existing debt. Claude Code CX Codex Cursor +1 18,100installs flutter-build-responsive-layout flutter skill This skill guides coding agents to build adaptive Flutter UIs across mobile and desktop screens using LayoutBuilder and BoxConstraints. Claude Code CX Codex Cursor +1 42,300installs frontend-design nexu-io skill Skill for building frontend interfaces with considered typography, color and layout — from landing pages to dashboards. Claude Code CX Codex Cursor +1 4,800installs flutter-add-widget-preview flutter skill Configures interactive Flutter widget previews with package:flutter/widget_previews.dart. Useful for testing UI components in isolation without launching the whole app. Claude Code CX Codex Cursor +1 36,600installs improve-ui ibelick skill Audits an interface against its own design system, finds proven inconsistencies, and writes fix plans for another agent without touching source. Claude Code CX Codex Cursor +1 7,800installs cmux-localization manaflow-ai skill A skill for managing translations of user-facing strings in your interface. Runs an audit whenever you change button text, menus, tooltips, or error messages. Claude Code CX Codex Cursor +1 4,700installs design-review nexu-io skill Audits UI visually, fixes flaws with atomic commits, and captures before/after screenshots. Useful for tightening shipped interface code right before launch. Claude Code CX Codex Cursor +1 3,100installs popular-web-designs Hermes Agent + Teknium (design systems sourced from VoltAgent/awesome-design-md) skill 54 real-world design systems (Stripe, Linear, Vercel, Claude) with CSS tokens, typography, and components for building pages styled after known brands. Claude Code CX Codex Cursor +1 914installs