ui-ux-design使用场景: 用户需要通过平台生成网页或 App 的 UI/UX 设计方案、验收清单并用于实现或检查时。
Install via ClawdBot CLI:
clawdbot install itsjustdri/ui-ux-designGrade Good — based on market validation, documentation quality, package completeness, maintenance status, and authenticity signals.
Calls external URL not in known-safe list
https://github.com/shadcn.pngAudited Apr 16, 2026 · audit v1.0
Generated Mar 1, 2026
A startup wants to modernize its admin dashboard to improve user engagement and accessibility. This skill guides selecting a color palette, implementing responsive grids with Tailwind, and adding Shadcn/ui components like data tables and charts, ensuring WCAG compliance for all users.
An e-commerce company is building a mobile-first shopping app. This skill helps design intuitive product pages with clear visual hierarchy, micro-interactions for cart actions, and responsive layouts that adapt from phones to tablets, using pre-build checklists for efficiency.
An online learning platform needs a user-friendly interface for courses and quizzes. This skill assists in setting up typography scales for readability, implementing accessible focus states for keyboard navigation, and using Flexbox for lesson component layouts.
A healthcare provider aims to enhance its patient portal for better accessibility and usability. This skill supports ensuring 4.5:1 text contrast ratios, integrating Shadcn/ui form components with ARIA labels, and applying mobile-first breakpoints for appointment scheduling.
A fintech firm is developing a design system for its banking app. This skill provides principles for consistent UI patterns, color systems with semantic alerts, and micro-interactions like button clicks to build trust and comply with financial accessibility standards.
Offer design consulting and implementation for clients building web or mobile apps. Use this skill to quickly set up projects with Shadcn/ui and Tailwind, ensuring modern, accessible designs that attract higher-paying contracts.
Build and sell a SaaS tool focused on design automation or accessibility testing. Leverage the skill's principles to create a user-friendly interface, driving subscriptions through efficient, beautiful UI that reduces customer churn.
Create and sell courses or tutorials on modern UI/UX design using Tailwind and Shadcn/ui. Use the skill's structured guides to develop curriculum content, attracting students seeking practical, up-to-date design knowledge.
💬 Integration Tip
Start by running the Shadcn/ui setup command in a Next.js project to quickly generate customizable components, then apply the mobile-first breakpoints and color systems from the skill for consistent, accessible designs.
Scored Apr 19, 2026
Implements UI from design mockups (Figma, Sketch, or image) with pixel-accurate layout, responsive behavior, and design tokens. Use when 还原设计图, implementing...
Complete Motion.dev documentation - modern animation library for React, JavaScript, and Vue (formerly Framer Motion)
Build immersive, cinematic 2.5D interactive websites using scroll storytelling, parallax depth, text animations, and premium scroll effects — no WebGL requir...
Figma integration. Manage Files, Projects, Teams. Use when the user wants to interact with Figma data.
Build interactive HTML prototypes. Use when creating clickable mockups, adding animations, linking pages, or exporting HTML.
Generate professional book covers and ebook covers using each::sense API with AI-powered design