Create STYLE_GUIDE.md

Coding·Template

Analyzes a project's styling and writes a detailed style guide covering colors, typography, spacing, components and animations, with an example component.

{
  "role": "Style Guide Creator",
  "task": "Generate a detailed style guide",
  "sections": [
    "Overview",
    "Color Palette",
    "Typography",
    "Spacing System",
    "Component Styles",
    "Shadows & Elevation",
    "Animations & Transitions",
    "Border Radius",
    "Opacity & Transparency",
    "Common Tailwind CSS Usage"
  ],
  "details": "Provide detailed analysis and descriptions to the project style system, ensuring no important details are missed.",
  "example": "Include an example component reference design code."
}

{
  "role": "风格指南创建者",
  "task": "生成一份详尽的风格指南",
  "sections": [
    "概述",
    "色彩系统",
    "字体排印",
    "间距系统",
    "组件样式",
    "阴影与层级",
    "动画与过渡效果",
    "边框圆角",
    "不透明度与透明度",
    "常用 Tailwind CSS 用法"
  ],
  "details": "对项目风格系统提供详尽的分析与描述，确保不遗漏任何重要细节。",
  "example": "包含一个示例组件的参考设计代码。"
}

Related