Generate accessible, responsive UI design systems with color palettes, tonal scales, typography scales, spacing systems, layout grids, and visual hierarchies from brand inputs or descriptions. Use commands to design full screens, create type systems, produce palettes with dark mode variants, and audit responsiveness across breakpoints.
Generate a full color palette with semantic mapping and accessibility checks.
Design a complete screen layout from a description or requirements.
Audit a design for responsive behavior across breakpoints.
Create a complete typography system from brand fonts or requirements.
Build a comprehensive color system with palette generation, semantic mapping, and accessibility compliance.
Design effective dark mode interfaces with proper color adaptation, contrast, and elevation.
Design clear, accessible data visualizations with appropriate chart selection and styling.
Define an illustration style guide with visual language, color usage, and application rules.
Define responsive layout grid systems with columns, gutters, margins, and breakpoint behavior.
Based on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
npx claudepluginhub owl-listener/designer-skills --plugin ui-designBuild, document, and maintain scalable design systems — from tokens and components to accessibility and theming.
Owl-ListenerCraft polished user interfaces with layout grids, color systems, typography scales, responsive patterns, and visual hierarchy.
sethdfordConnect Claude Code to TypeUI MCP for curated design systems, UI prompts, and layout variations.
bergsideExpert UI/UX design guidance for unique, accessible interfaces. Always-ask-first protocol for visual decisions, colors, typography, layouts.
benciumStreamline design operations with critique frameworks, handoff specs, sprint planning, review processes, and team workflows.
Owl-ListenerBuild, document, and maintain scalable design systems — from tokens and components to accessibility and theming.
Owl-ListenerUser research skills for designers: personas, empathy maps, journey maps, interview scripts, usability testing, and card sorting.
Owl-ListenerPlan and execute design validation through prototyping strategies, usability testing, heuristic evaluation, and A/B experiments.
Owl-ListenerEssential designer utilities for writing rationale, building presentations, crafting case studies, UX writing, and driving adoption.
Owl-ListenerUI/UX design intelligence. 107 styles, 127 palettes, 107 font pairings, 106 charts, 131 reasoning rules, 129 UX guidelines, 16 stacks (React, Next.js, Vue, Nuxt.js, Svelte, Astro, Angular, Remix, SolidJS, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Nuxt UI). 8 Python scripts: BM25 search, contrast checker, palette generator, token generator, type scale calculator, design system generator, UI auditor, CLI. Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, liquid glass, cyberpunk, spatial UI, data brutalism. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient, design tokens, contrast checker.
saifyxproUI/UX design intelligence. 84 styles, 161 palettes, 73 font pairings, 25 charts, 17 stacks (React, Next.js, Vue, Nuxt.js, Nuxt UI, Svelte, Astro, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, Three.js). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient.
nextlevelbuilderOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claim'%20stop-opacity%3D'0.16'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'rgb(200%2C90%2C60)'%20stop-opacity%3D'0.03'%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D'320'%20height%3D'200'%20fill%3D'url(%23g)'%2F%3E%3Ccircle%20cx%3D'250'%20cy%3D'56'%20r%3D'92'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.06'%2F%3E%3Ccircle%20cx%3D'64'%20cy%3D'172'%20r%3D'58'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.05'%2F%3E%3C%2Fsvg%3E)