7.12 Brand Guidelines Skill - 品牌样式指南
概述
Brand Guidelines Skill 提供 Anthropic 官方品牌颜色和字体，可应用于任何需要 Anthropic 视觉风格的 artifact。它确保所有输出都符合公司的品牌标准。
适用场景
当以下情况适用时使用此 Skill：
- 品牌颜色或样式指南
- 视觉格式化
- 公司设计标准
关键词
branding、corporate identity、visual identity、post-processing、styling、brand colors、typography、Anthropic brand、visual formatting、visual design
品牌颜色
主色
| 颜色 | HEX 值 | 用途 |
|---|---|---|
| Dark | #141413 | 主要文本和深色背景 |
| Light | #faf9f5 | 浅色背景和深色上的文本 |
| Mid Gray | #b0aea5 | 次要元素 |
| Light Gray | #e8e6dc | 微妙背景 |
强调色
| 颜色 | HEX 值 | 用途 |
|---|---|---|
| Orange | #d97757 | 主要强调色 |
| Blue | #6a9bcc | 次要强调色 |
| Green | #788c5d | 第三强调色 |
颜色可视化
主色:
+------------+------------+------------+------------+
| #141413 | #faf9f5 | #b0aea5 | #e8e6dc |
| Dark | Light | Mid Gray | Light Gray |
+------------+------------+------------+------------+
强调色:
+------------+------------+------------+
| #d97757 | #6a9bcc | #788c5d |
| Orange | Blue | Green |
+------------+------------+------------+字体规范
字体家族
| 用途 | 首选字体 | 后备字体 |
|---|---|---|
| 标题 | Poppins | Arial |
| 正文 | Lora | Georgia |
智能字体应用
- 标题（24pt 及更大）：应用 Poppins 字体
- 正文文本：应用 Lora 字体
- 如果自定义字体不可用，自动回退到 Arial/Georgia
- 跨所有系统保持可读性
字体管理
- 使用系统安装的 Poppins 和 Lora 字体（如果可用）
- 提供自动回退到 Arial（标题）和 Georgia（正文）
- 无需安装字体——使用现有系统字体即可工作
- 为获得最佳效果，预先在环境中安装 Poppins 和 Lora 字体
功能特性
智能字体应用
系统会自动：
- 将 Poppins 字体应用于标题（24pt 及更大）
- 将 Lora 字体应用于正文文本
- 如果自定义字体不可用，自动回退到 Arial/Georgia
- 保持跨所有系统的可读性
文本样式
| 元素 | 字体 | 备注 |
|---|---|---|
| 标题（24pt+） | Poppins | 粗体或常规 |
| 正文 | Lora | 常规或斜体 |
| 代码 | 等宽字体 | 系统默认 |
形状和强调色
- 非文本形状使用强调色
- 在橙色、蓝色和绿色强调色之间循环
- 在保持品牌一致性的同时保持视觉趣味性
技术实现
颜色应用（Python）
python
from pptx.util import RGBColor
# Anthropic 品牌颜色
BRAND_COLORS = {
'dark': RGBColor(0x14, 0x14, 0x13),
'light': RGBColor(0xfa, 0xf9, 0xf5),
'mid_gray': RGBColor(0xb0, 0xae, 0xa5),
'light_gray': RGBColor(0xe8, 0xe6, 0xdc),
'orange': RGBColor(0xd9, 0x77, 0x57),
'blue': RGBColor(0x6a, 0x9b, 0xcc),
'green': RGBColor(0x78, 0x8c, 0x5d),
}
# 应用颜色
text_frame.paragraphs[0].font.color.rgb = BRAND_COLORS['dark']字体应用（Python）
python
from pptx.util import Pt
from pptx.dml.color import RGBColor
def apply_brand_font(paragraph, is_heading=False):
"""应用品牌字体"""
font = paragraph.font
if is_heading:
font.name = 'Poppins'
font.size = Pt(24)
else:
font.name = 'Lora'
font.size = Pt(12)CSS 实现
css
/* Anthropic 品牌样式 */
:root {
/* 主色 */
--brand-dark: #141413;
--brand-light: #faf9f5;
--brand-mid-gray: #b0aea5;
--brand-light-gray: #e8e6dc;
/* 强调色 */
--brand-orange: #d97757;
--brand-blue: #6a9bcc;
--brand-green: #788c5d;
}
/* 字体 */
h1, h2, h3, h4, h5, h6 {
font-family: 'Poppins', Arial, sans-serif;
color: var(--brand-dark);
}
body, p {
font-family: 'Lora', Georgia, serif;
color: var(--brand-dark);
}
/* 背景 */
body {
background-color: var(--brand-light);
}
/* 强调元素 */
.accent-primary {
color: var(--brand-orange);
}
.accent-secondary {
color: var(--brand-blue);
}
.accent-tertiary {
color: var(--brand-green);
}应用示例
示例 1：演示文稿幻灯片
python
from pptx import Presentation
from pptx.util import Inches, Pt
from pptx.dml.color import RGBColor
# 创建演示文稿
prs = Presentation()
# 添加幻灯片
slide_layout = prs.slide_layouts[6] # 空白布局
slide = prs.slides.add_slide(slide_layout)
# 设置背景
background = slide.background
fill = background.fill
fill.solid()
fill.fore_color.rgb = RGBColor(0xfa, 0xf9, 0xf5) # brand-light
# 添加标题
title_shape = slide.shapes.add_textbox(Inches(1), Inches(1), Inches(8), Inches(1))
title_frame = title_shape.text_frame
title_para = title_frame.paragraphs[0]
title_para.text = "Anthropic 品牌演示"
title_para.font.name = 'Poppins'
title_para.font.size = Pt(32)
title_para.font.color.rgb = RGBColor(0x14, 0x14, 0x13) # brand-dark示例 2：HTML 页面
html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Anthropic 品牌页面</title>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&family=Lora:ital,wght@0,400;1,400&display=swap" rel="stylesheet">
<style>
:root {
--brand-dark: #141413;
--brand-light: #faf9f5;
--brand-orange: #d97757;
}
body {
font-family: 'Lora', Georgia, serif;
background-color: var(--brand-light);
color: var(--brand-dark);
}
h1 {
font-family: 'Poppins', Arial, sans-serif;
color: var(--brand-dark);
}
.highlight {
color: var(--brand-orange);
}
</style>
</head>
<body>
<h1>欢迎来到 <span class="highlight">Anthropic</span></h1>
<p>使用官方品牌样式创建一致的视觉体验。</p>
</body>
</html>总结
Brand Guidelines Skill 提供了 Anthropic 官方品牌资源：
颜色系统：
- 4 种主色：Dark、Light、Mid Gray、Light Gray
- 3 种强调色：Orange、Blue、Green
字体系统：
- 标题：Poppins（回退 Arial）
- 正文：Lora（回退 Georgia）
智能应用：
- 自动字体大小检测
- 智能颜色选择
- 跨平台兼容
使用此 Skill 确保所有输出都符合 Anthropic 的品牌标准，创建专业、一致的视觉体验。