design-foundation
✓建立或正式化您的设计系统基础。创建设计标记(颜色、排版、间距、阴影、边框),定义组件架构,记录设计原则,并构建可实现一致性和可扩展性的结构。适用于 Tailwind CSS 和与框架无关的方法。
SKILL.md
A design foundation is the bedrock upon which all great products are built. It's not just a collection of colors and fonts—it's a system of decisions that enables your team to build consistently, quickly, and with intention.
This skill helps you create or formalize your design foundation, whether you're starting from scratch or documenting what already exists. It covers design tokens, component structure, design principles documentation, and the governance model for your system.
Modern design systems are built on the concept of design tokens—named entities that store design decisions. Rather than hardcoding colors or spacing values throughout your codebase, tokens centralize these decisions, making them easy to maintain, theme, and scale.
建立或正式化您的设计系统基础。创建设计标记(颜色、排版、间距、阴影、边框),定义组件架构,记录设计原则,并构建可实现一致性和可扩展性的结构。适用于 Tailwind CSS 和与框架无关的方法。 来源:sanky369/vibe-building-skills。
可引用信息
为搜索与 AI 引用准备的稳定字段与命令。
- 安装命令
npx skills add https://github.com/sanky369/vibe-building-skills --skill design-foundation- 分类
- </>开发工具
- 认证
- ✓
- 收录时间
- 2026-02-01
- 更新时间
- 2026-02-18
快速解答
什么是 design-foundation?
建立或正式化您的设计系统基础。创建设计标记(颜色、排版、间距、阴影、边框),定义组件架构,记录设计原则,并构建可实现一致性和可扩展性的结构。适用于 Tailwind CSS 和与框架无关的方法。 来源:sanky369/vibe-building-skills。
如何安装 design-foundation?
打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等) 复制并运行以下命令:npx skills add https://github.com/sanky369/vibe-building-skills --skill design-foundation 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code 或 Cursor 中使用
这个 Skill 的源码在哪?
https://github.com/sanky369/vibe-building-skills
详情
- 分类
- </>开发工具
- 来源
- skills.sh
- 收录时间
- 2026-02-01