搜索

PythonReactSEOPDF
GitHub Skill

design-expert

UI/UX design expertise - component design, design systems, responsive design, Figma analysis

nguyenthienthanh☆ 3 仓库 Stars2 仓库 Forks

安装与使用

请根据来源仓库和你的 AI 工具说明安装此技能。先阅读技能文件和依赖要求,再添加到工作流。

查看来源 ↗使用指南

技能说明

Skill: Design Expert

Category: Reference Skill Used By: ui-designer agent


Sub-Skills

File Purpose
component-design.md Atomic design, component anatomy, specs
design-system.md Design tokens, theming, consistency
responsive-design.md Mobile-first, breakpoints, layouts
figma-analysis.md Figma file analysis techniques

When to Use

  • Phase 3 (UI Breakdown) - Component design decisions
  • UI/UX design tasks
  • Design system setup
  • Responsive layout planning

Quick Reference

Atomic Design:

Atoms → Molecules → Organisms → Templates → Pages

Design Tokens:

  • Colors, spacing, typography, shadows, borders

Responsive Breakpoints:

  • Mobile: < 768px
  • Tablet: 768px - 1024px
  • Desktop: > 1024px

Related Skills

For implementation with specific design system libraries, use:

Design System Library: skills/design-system-library/

System File
Material UI material-ui.md
Ant Design ant-design.md
Tailwind CSS tailwind-css.md
shadcn/ui shadcn-ui.md
Chakra UI chakra-ui.md
NativeWind nativewind.md
Bootstrap bootstrap.md
Mantine mantine.md
Radix UI radix-ui.md
Headless UI headless-ui.md

Load sub-skills as needed for detailed guidance.

使用示例

查看来源仓库中的使用示例与配置说明。

查看来源 ↗

来源历史

收录时间
2026-01-20
索引更新时间
2026-01-26
Branch
main

收录与同步日期属于本站记录。源码修改历史请查看来源仓库。

GitHub ↗

chat Comments (0)

chat_bubble_outline

No comments yet. Be the first to share your thoughts!