1# Brand Guidelines Template
2 
3Use this template to create comprehensive brand guidelines for any project.
4 
5## Document Structure
6 
7```markdown
8# Brand Guidelines v{X.Y}
9 
10## Quick Reference
11- **Primary Color:** #XXXXXX
12- **Secondary Color:** #XXXXXX
13- **Primary Font:** {font-family}
14- **Voice:** {3 key traits}
15 
16## 1. Color Palette
17 
18### Primary Colors
19| Name | Hex | RGB | Usage |
20|------|-----|-----|-------|
21| {Name} | #{hex} | rgb({r},{g},{b}) | Primary brand color, CTAs, headers |
22| {Name} | #{hex} | rgb({r},{g},{b}) | Supporting accent |
23 
24### Secondary Colors
25| Name | Hex | RGB | Usage |
26|------|-----|-----|-------|
27| {Name} | #{hex} | rgb({r},{g},{b}) | Secondary elements |
28| {Name} | #{hex} | rgb({r},{g},{b}) | Highlights |
29 
30### Neutral Palette
31| Name | Hex | RGB | Usage |
32|------|-----|-----|-------|
33| Background | #{hex} | rgb({r},{g},{b}) | Page backgrounds |
34| Text Primary | #{hex} | rgb({r},{g},{b}) | Body text |
35| Text Secondary | #{hex} | rgb({r},{g},{b}) | Captions, muted text |
36| Border | #{hex} | rgb({r},{g},{b}) | Dividers, borders |
37 
38### Accessibility
39- Text/Background Contrast: {ratio}:1 (WCAG {level})
40- CTA Contrast: {ratio}:1
41- All interactive elements meet WCAG 2.1 AA
42 
43## 2. Typography
44 
45### Font Stack
46```css
47--font-heading: '{Font}', sans-serif;
48--font-body: '{Font}', sans-serif;
49--font-mono: '{Font}', monospace;
50```
51 
52### Type Scale
53| Element | Font | Weight | Size (Desktop/Mobile) | Line Height |
54|---------|------|--------|----------------------|-------------|
55| H1 | {font} | 700 | 48px / 32px | 1.2 |
56| H2 | {font} | 600 | 36px / 28px | 1.25 |
57| H3 | {font} | 600 | 28px / 24px | 1.3 |
58| H4 | {font} | 600 | 24px / 20px | 1.35 |
59| Body | {font} | 400 | 16px / 16px | 1.5 |
60| Small | {font} | 400 | 14px / 14px | 1.5 |
61| Caption | {font} | 400 | 12px / 12px | 1.4 |
62 
63## 3. Logo Usage
64 
65### Variants
66- **Primary:** Full horizontal logo with wordmark
67- **Stacked:** Vertical arrangement for square spaces
68- **Icon:** Symbol only for favicons, app icons
69- **Monochrome:** Single color for limited palettes
70 
71### Clear Space
72Minimum clear space = height of logo mark
73 
74### Minimum Size
75- Digital: 80px width minimum
76- Print: 25mm width minimum
77 
78### Don'ts
79- Don't rotate or skew
80- Don't change colors outside approved palette
81- Don't add effects (shadows, gradients)
82- Don't crop or modify proportions
83- Don't place on busy backgrounds
84 
85## 4. Voice & Tone
86 
87### Brand Personality
88{Trait 1}: {Description}
89{Trait 2}: {Description}
90{Trait 3}: {Description}
91 
92### Voice Chart
93| Trait | We Are | We Are Not |
94|-------|--------|------------|
95| {Trait} | {Description} | {Anti-description} |
96 
97### Tone by Context
98| Context | Tone | Example |
99|---------|------|---------|
100| Marketing | {tone} | "{example}" |
101| Support | {tone} | "{example}" |
102| Error Messages | {tone} | "{example}" |
103| Success | {tone} | "{example}" |
104 
105### Prohibited Terms
106- {term 1} (reason)
107- {term 2} (reason)
108 
109## 5. Imagery Guidelines
110 
111### Photography Style
112- {Lighting preference}
113- {Subject guidelines}
114- {Color treatment}
115 
116### Illustrations
117- Style: {description}
118- Colors: Brand palette only
119- Stroke: {weight}px
120 
121### Icons
122- Style: {outlined/filled/duotone}
123- Size: 24px base grid
124- Corner radius: {value}px
125```
126 
127## Usage
128 
1291. Copy template above
1302. Fill in brand-specific values
1313. Save as `docs/brand-guidelines.md`
1324. Reference in content workflows
133 
134## Extractable Fields
135 
136Scripts can extract:
137- `colors.primary`, `colors.secondary`, `colors.neutral`
138- `typography.heading`, `typography.body`
139- `voice.traits`, `voice.prohibited`
140- `logo.variants`, `logo.minSize`
141