Brand Guidelines Generator by claude-office-skills/skills
npx skills add https://github.com/claude-office-skills/skills --skill 'Brand Guidelines Generator'创建全面的品牌指南,以确保视觉和语言身份的一致性。
此技能可帮助您:
"为 [公司名称] 创建品牌指南"
"帮助我记录我们的品牌身份"
"根据我们的徽标和颜色生成风格指南"
"将社交媒体指南添加到我们的品牌指南中"
"更新我们的调色板文档"
"定义语调和语气指南"
# [品牌名称] 品牌指南
## 目录
1. 品牌概述
2. 徽标使用
3. 调色板
4. 字体排版
5. 图像
6. 语调和语气
7. 应用
8. 注意事项
---
## 1. 品牌概述
### 使命
[一句话:品牌为何存在?]
### 愿景
[一句话:品牌渴望的未来是什么?]
### 价值观
- [价值观 1]:[简要描述]
- [价值观 2]:[简要描述]
- [价值观 3]:[简要描述]
### 品牌个性
[描述品牌的 3-5 个形容词]
示例:创新、平易近人、值得信赖
### 目标受众
[主要和次要受众描述]
---
## 2. 徽标使用
### 主要徽标
[徽标图像占位符]
### 徽标变体
- **主要**:全彩,水平
- **次要**:堆叠/垂直
- **图标/标记**:仅符号
- **文字标识**:仅文字
### 净空区域
徽标周围的最小净空区域:[X] 乘以 [元素] 的高度
### 最小尺寸
- 印刷:[X] 英寸 / [Y] 毫米
- 数字:[X] 像素
### 徽标颜色
| 版本 | 使用场景 |
|---------|----------|
| 全彩 | 在白色/浅色背景上的主要使用 |
| 反白 | 在深色背景上 |
| 单色 | 单色印刷 |
### 徽标禁忌
- ❌ 请勿拉伸或扭曲
- ❌ 请勿旋转
- ❌ 请勿更改颜色
- ❌ 请勿添加效果(阴影、渐变)
- ❌ 请勿放置在杂乱的背景上
---
## 3. 调色板
### 主要颜色
| 颜色 | Hex | RGB | CMYK | Pantone |
|-------|-----|-----|------|---------|
| [名称] | #XXXXXX | R, G, B | C, M, Y, K | XXXX C |
### 次要颜色
[同上格式]
### 强调色
[同上格式]
### 颜色使用
- **主要蓝色**:标题、行动号召、主要元素
- **次要灰色**:正文、边框
- **强调绿色**:成功状态、高亮显示
### 可访问性
所有文本必须满足 WCAG 2.1 AA 对比度要求:
- 正常文本:最低 4.5:1
- 大文本:最低 3:1
---
## 4. 字体排版
### 主要字体
**[字体名称]** - [来源/许可证]
| 样式 | 字重 | 用途 |
|-------|--------|-----|
| 标题 1 | 粗体 (700) | 页面标题 |
| 标题 2 | 半粗体 (600) | 章节标题 |
| 正文 | 常规 (400) | 段落文本 |
| 说明文字 | 细体 (300) | 小文本、说明文字 |
### 次要字体
**[字体名称]** - [使用时机]
### 字体大小
| 元素 | 桌面端 | 移动端 |
|---------|---------|--------|
| H1 | 48px | 32px |
| H2 | 36px | 24px |
| H3 | 24px | 20px |
| 正文 | 16px | 16px |
| 小号 | 14px | 14px |
### 行高
- 标题:1.2
- 正文:1.5
- 小文本:1.4
---
## 5. 图像
### 摄影风格
- [光线]:自然、明亮
- [构图]:干净、简约
- [主体]:真实人物、真实瞬间
- [氛围]:[有抱负的/专业的/友好的]
### 插图风格
[如果适用 - 描述风格、颜色、线条粗细]
### 图标
- 风格:[描边/填充/双色调]
- 描边宽度:[X]px
- 圆角半径:[X]px
- 网格尺寸:[24x24, 16x16]
### 图像禁忌
- ❌ 不使用看起来摆拍的图库照片
- ❌ 不使用过时的技术
- ❌ 不使用与品牌价值观冲突的图像
---
## 6. 语调和语气
### 品牌语调
我们的语调是:[形容词]、[形容词]、[形容词]
| 我们是 | 我们不是 |
|--------|------------|
| 友好 | 随意 |
| 自信 | 傲慢 |
| 清晰 | 过于简单 |
| 乐于助人 | 咄咄逼人 |
### 不同场景的语气
| 场景 | 语气 | 示例 |
|---------|------|---------|
| 营销 | 鼓舞人心 | "改变您的工作流程" |
| 支持 | 同理心 | "我们理解这很令人沮丧" |
| 错误信息 | 有帮助的 | "让我们一起解决这个问题" |
| 法律 | 清晰 | "您的数据受到保护" |
### 写作指南
- 使用主动语态
- 保持句子简短(15-20 个单词)
- 除非必要,避免使用术语
- 直接称呼读者("您")
---
## 7. 应用
### 名片
[规格和布局]
### 电子邮件签名
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
[姓名] [职位] [公司] [电话] | [电子邮件] [网站]
### 社交媒体
| 平台 | 个人资料图片 | 封面尺寸 |
|----------|---------------|------------|
| LinkedIn | 400x400px | 1128x191px |
| Twitter | 400x400px | 1500x500px |
| Facebook | 170x170px | 820x312px |
### 演示文稿模板
[幻灯片规格和示例]
---
## 8. 注意事项
### 应做事项 ✅
- 使用批准的颜色组合
- 保持徽标周围的净空区域
- 遵循字体排版层级
- 使用高质量图像
- 在所有渠道保持一致
### 禁止事项 ❌
- 更改徽标比例
- 使用非品牌颜色
- 混合使用过多字体
- 使用低分辨率素材
- 未经批准擅自偏离
## 快速参考卡
🔵 主要:#XXXXXX ⚪ 次要:#XXXXXX 🟢 强调:#XXXXXX
标题:[字体] 粗体 正文:[字体] 常规
[3 个关键形容词]
## 限制
* 无法创建视觉素材(徽标、图像)
* 颜色规格应进行验证
* 字体排版许可由用户负责
* 建议对使用权进行法律审查
每周安装数
0
代码仓库
[claude-office-s…s/skills](https://github.com/claude-office-skills/skills "claude-office-skills/skills")
GitHub 星标数
5
首次出现时间
1970年1月1日
安全审计
[Gen Agent Trust HubPass](/claude-office-skills/skills/brand-guidelines-generator/security/agent-trust-hub)[SocketFail](/claude-office-skills/skills/brand-guidelines-generator/security/socket)[SnykPass](/claude-office-skills/skills/brand-guidelines-generator/security/snyk)
Create comprehensive brand guidelines to ensure consistent visual and verbal identity.
This skill helps you:
"Create brand guidelines for [Company Name]"
"Help me document our brand identity"
"Generate a style guide based on our logo and colors"
"Add social media guidelines to our brand guide"
"Update our color palette documentation"
"Define voice and tone guidelines"
# [Brand Name] Brand Guidelines
## Table of Contents
1. Brand Overview
2. Logo Usage
3. Color Palette
4. Typography
5. Imagery
6. Voice & Tone
7. Applications
8. Do's and Don'ts
---
## 1. Brand Overview
### Mission
[One sentence: Why does the brand exist?]
### Vision
[One sentence: What future does the brand aspire to?]
### Values
- [Value 1]: [Brief description]
- [Value 2]: [Brief description]
- [Value 3]: [Brief description]
### Brand Personality
[3-5 adjectives that describe the brand]
Example: Innovative, Approachable, Trustworthy
### Target Audience
[Primary and secondary audience descriptions]
---
## 2. Logo Usage
### Primary Logo
[Logo image placeholder]
### Logo Variations
- **Primary**: Full color, horizontal
- **Secondary**: Stacked/vertical
- **Icon/Mark**: Symbol only
- **Wordmark**: Text only
### Clear Space
Minimum clear space around logo: [X] times the height of [element]
### Minimum Sizes
- Print: [X] inches / [Y] mm
- Digital: [X] pixels
### Logo Colors
| Version | Use Case |
|---------|----------|
| Full Color | Primary use on white/light backgrounds |
| Reversed | On dark backgrounds |
| Monochrome | Single-color printing |
### Logo Don'ts
- ❌ Don't stretch or distort
- ❌ Don't rotate
- ❌ Don't change colors
- ❌ Don't add effects (shadows, gradients)
- ❌ Don't place on busy backgrounds
---
## 3. Color Palette
### Primary Colors
| Color | Hex | RGB | CMYK | Pantone |
|-------|-----|-----|------|---------|
| [Name] | #XXXXXX | R, G, B | C, M, Y, K | XXXX C |
### Secondary Colors
[Same format as above]
### Accent Colors
[Same format as above]
### Color Usage
- **Primary Blue**: Headlines, CTAs, primary elements
- **Secondary Gray**: Body text, borders
- **Accent Green**: Success states, highlights
### Accessibility
All text must meet WCAG 2.1 AA contrast requirements:
- Normal text: 4.5:1 minimum
- Large text: 3:1 minimum
---
## 4. Typography
### Primary Font
**[Font Name]** - [Source/License]
| Style | Weight | Use |
|-------|--------|-----|
| Heading 1 | Bold (700) | Page titles |
| Heading 2 | Semi-bold (600) | Section headers |
| Body | Regular (400) | Paragraph text |
| Caption | Light (300) | Small text, captions |
### Secondary Font
**[Font Name]** - [When to use]
### Font Sizes
| Element | Desktop | Mobile |
|---------|---------|--------|
| H1 | 48px | 32px |
| H2 | 36px | 24px |
| H3 | 24px | 20px |
| Body | 16px | 16px |
| Small | 14px | 14px |
### Line Heights
- Headings: 1.2
- Body text: 1.5
- Small text: 1.4
---
## 5. Imagery
### Photography Style
- [Lighting]: Natural, bright
- [Composition]: Clean, minimal
- [Subjects]: Real people, authentic moments
- [Mood]: [Aspirational/Professional/Friendly]
### Illustration Style
[If applicable - describe style, colors, line weights]
### Iconography
- Style: [Outline/Filled/Duotone]
- Stroke width: [X]px
- Corner radius: [X]px
- Grid size: [24x24, 16x16]
### Image Don'ts
- ❌ No stock photos that look staged
- ❌ No outdated technology
- ❌ No images that conflict with brand values
---
## 6. Voice & Tone
### Brand Voice
Our voice is: [Adjective], [Adjective], [Adjective]
| We Are | We Are Not |
|--------|------------|
| Friendly | Casual |
| Confident | Arrogant |
| Clear | Simplistic |
| Helpful | Pushy |
### Tone by Context
| Context | Tone | Example |
|---------|------|---------|
| Marketing | Inspiring | "Transform your workflow" |
| Support | Empathetic | "We understand this is frustrating" |
| Error Messages | Helpful | "Let's fix this together" |
| Legal | Clear | "Your data is protected" |
### Writing Guidelines
- Use active voice
- Keep sentences short (15-20 words)
- Avoid jargon unless necessary
- Address the reader directly ("you")
---
## 7. Applications
### Business Cards
[Specifications and layout]
### Email Signature
[Name] [Title] [Company] [Phone] | [Email] [Website]
### Social Media
| Platform | Profile Image | Cover Size |
|----------|---------------|------------|
| LinkedIn | 400x400px | 1128x191px |
| Twitter | 400x400px | 1500x500px |
| Facebook | 170x170px | 820x312px |
### Presentation Templates
[Slide specifications and examples]
---
## 8. Do's and Don'ts
### Do's ✅
- Use approved color combinations
- Maintain clear space around logo
- Follow typography hierarchy
- Use high-quality images
- Stay consistent across channels
### Don'ts ❌
- Alter logo proportions
- Use off-brand colors
- Mix too many fonts
- Use low-resolution assets
- Deviate without approval
# [Brand] Quick Reference
## Colors
🔵 Primary: #XXXXXX
⚪ Secondary: #XXXXXX
🟢 Accent: #XXXXXX
## Fonts
Headlines: [Font] Bold
Body: [Font] Regular
## Logo
- Minimum size: XXpx
- Clear space: Xpx
- File formats: SVG, PNG, PDF
## Voice
[3 key adjectives]
Weekly Installs
0
Repository
GitHub Stars
5
First Seen
Jan 1, 1970
Security Audits
shadcn/ui 框架:React 组件库与 UI 设计系统,Tailwind CSS 最佳实践
51,500 周安装