gh-overlord-z-claudeshack/skills/style-master/References/style-guide-template.md

{Project Name} Style Guide

Last Updated: {Date}

Design Tokens

Colors

Primary Colors

• --color-primary: #007bff
• --color-primary-hover: #0056b3
• --color-primary-active: #004085

Semantic Colors

• --color-success: #28a745
• --color-warning: #ffc107
• --color-error: #dc3545
• --color-info: #17a2b8

Neutral Colors

• --color-gray-50: #f8f9fa
• --color-gray-900: #212529

Typography

• --font-sans: 'Inter', system-ui, sans-serif
• --font-mono: 'Fira Code', monospace
• --font-size-xs: 0.75rem
• --font-size-base: 1rem
• --font-size-xl: 1.25rem
• --line-height-tight: 1.25
• --line-height-normal: 1.5

Spacing

• --spacing-xs: 0.25rem (4px)
• --spacing-sm: 0.5rem (8px)
• --spacing-md: 1rem (16px)
• --spacing-lg: 1.5rem (24px)
• --spacing-xl: 2rem (32px)

Breakpoints

• sm: 640px
• md: 768px
• lg: 1024px
• xl: 1280px
• 2xl: 1536px

Components

[Document component patterns here]

Guidelines

[Project-specific guidelines]