Skills and MCP tagged “tailwind”

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 design-system claudekit skill This skill builds design tokens, component specs, and presentation slides. Use it when an interface and its slides need to follow one visual system. Claude Code CX Codex Cursor +1 42,200installs design claudekit skill Generates logos, brand identity assets, design tokens, Chart.js HTML slides, and multi-platform banners using Python scripts and AI providers. Claude Code CX Codex Cursor +1 40,800installs 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 brand claudekit skill Keeps brand voice, visual rules and design tokens in one markdown file, then feeds them to your agent's prompts and to your CSS variables. Claude Code CX Codex Cursor +1 39,500installs design-md official google-labs-code skill Extracts screens and styles from Google Stitch via MCP to synthesize a semantic design system into a DESIGN.md file. Claude Code CX Codex Cursor +1 64,700installs stitch::react-components official google-labs-code skill Turns Stitch designs into modular Vite and React components. Can also sync existing components with updated Stitch designs. Claude Code CX Codex Cursor +1 50,400installs 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 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 stitch::extract-design-md official google-labs-code skill Extracts a complete DESIGN.md design system directly from frontend source files without building or rendering the project. Useful for styling audits and Stitch exports. Claude Code CX Codex Cursor +1 10,500installs design-system affaan-m skill Builds a design system out of the styles already in your repo, or audits them: tokens, a ten-point UI score, and a check for generic AI styling. Claude Code CX Codex Cursor +1 4,900installs better-typography jakubkrehel skill Reviews interface typography and applies fixes through the project’s styling system. Use it to check text hierarchy, wrapping, truncation and punctuation. Claude Code CX Codex Cursor +1 33,800installs 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 better-colors jakubkrehel skill Audits color systems, generates ramps, and maps semantic tokens to roles. Use it when hardcoded hex values pile up or text contrast needs verifiable measurement. Claude Code CX Codex Cursor +1 32,200installs ai-elements vercel skill React component library for AI interfaces: messages, conversation history, prompt inputs, tool call displays. Built on shadcn/ui. Claude Code CX Codex Cursor +1 20,400installs shadcn-svelte huntabyte skill A skill for working with shadcn-svelte: adding components, building interfaces, fixing styles, and debugging projects. Use it if you're building UI with shadcn-svelte on Svelte or planning to start. Claude Code CX Codex Cursor +1 6,700installs 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 chakra-ui-refactor chakra-ui skill Reviews components against Chakra UI v3 patterns and converts markup from HTML, Tailwind, or styled-components. Useful for UI refactoring and accessibility audits. Claude Code CX Codex Cursor +1 2,800installs unocss Anthony Fu skill A skill that gives the agent reference material on UnoCSS configuration, rules, shortcuts and presets. Useful when setting up UnoCSS or reusing Tailwind knowledge in it. Claude Code CX Codex Cursor +1 16,000installs visual-design-foundations Seth Hobson skill This skill helps define typography, color, spacing, and icon rules for a project. Use it when setting up design tokens or bringing an interface into visual consistency. Claude Code CX Codex Cursor 13,566installs material-ui-nextjs mui skill A skill for wiring Material UI into Next.js: SSR, Emotion cache, next/font, CSS layers, Link, and useSearchParams. Use it when setting up or debugging MUI in a Next.js app. Claude Code CX Codex Cursor +1 725installs web-artifacts-builder nexu-io skill Builds HTML artifacts for claude.ai with React and Tailwind — Anthropic's reference workflow for embeddable interfaces. Claude Code CX Codex Cursor +1 2,800installs magic-ui magicuidesign skill The magic-ui skill teaches Claude Code to work with Magic UI components in React and Next.js: select animations, install via shadcn registry, and check accessibility. Claude Code CX Codex Cursor +1 1,200installs figma-design-to-code official Figma skill Guides an agent through implementing a Figma node in a project’s existing stack. Use it before calling get_design_context. CX Codex GP ChatGPT 30installs geist official Vercel Labs skill This skill guides you through adding Geist Sans, Geist Mono, and Geist Pixel to a Next.js project. Use it when setting up typography or deciding where each family belongs. CX Codex GP ChatGPT 6installs email official Vercel Labs skill Configures email sending via Resend and React Email templates for Vercel apps. It covers API routes and domain verification. CX Codex GP ChatGPT 6installs v0-dev official Vercel Labs skill Generates React components with v0, integrates them into Next.js projects via CLI, and automates deployments using the v0 SDK. CX Codex GP ChatGPT 5installs AEM Front-End Specialist official github subagent Builds Adobe Experience Manager components using HTL and Tailwind CSS v4, extracting design tokens directly from Figma. GitHub Copilot ★ 40,369repo stars