Anthropic Skills 中文文档
首页
使用指南
技能列表
  • 🎨 创意与设计
  • 💻 开发与技术
  • 🏢 企业与沟通
  • 📄 文档处理
  • 🔧 元技能
  • GitHub 仓库
  • Claude 官网
  • Skills 官方文档
GitHub
首页
使用指南
技能列表
  • 🎨 创意与设计
  • 💻 开发与技术
  • 🏢 企业与沟通
  • 📄 文档处理
  • 🔧 元技能
  • GitHub 仓库
  • Claude 官网
  • Skills 官方文档
GitHub
  • 技能列表
  • 🎨 创意与设计

    • 🎨 算法艺术生成

      • 📋 概览
      • 📖 完整指南
    • 🖼️ 画布设计

      • 📋 概览
      • 📖 完整指南
    • 🎬 Slack GIF 创建器

      • 📋 概览
      • 📖 完整指南
    • 🎨 主题工厂

      • 📋 概览
      • 📖 完整指南
  • 💻 开发与技术

    • 🎨 Web 组件构建器

      • 📋 概览
      • 📖 完整指南
    • 📦 MCP 服务器构建器

      • 📋 概览
      • 📖 完整指南
    • 🧪 Web 应用测试工具

      • 📋 概览
      • 📖 完整指南
  • 🏢 企业与沟通

    • 🎨 品牌指南

      • 📋 概览
      • 📖 完整指南
    • 📢 企业内部沟通

      • 📋 概览
      • 📖 完整指南
    • 💎 前端设计

      • 📋 概览
      • 📖 完整指南
  • 📄 文档处理

    • 📘 Word 文档处理

      • 📋 概览
      • 📖 完整指南
    • 📕 PDF 文档处理

      • 📋 概览
      • 📖 完整指南
    • 📙 PowerPoint 演示文稿处理

      • 📋 概览
      • 📖 完整指南
    • 📗 Excel 表格处理

      • 📋 概览
      • 📖 完整指南
  • 🔧 元技能

    • 🛠️ Skill 创建器

      • 📋 概览
      • 📖 完整指南
    • 📝 Skill 模板

      • 📋 概览
      • 📖 完整参考

Brand Guidelines 完整指南

本文档包含 Anthropic 品牌色彩和排版的完整技术实现。如果您是初次接触,建议先阅读 📋 概览。

  • 品牌色彩系统
    • 完整色彩规格
    • 色彩应用规则
  • 字体系统
    • 字体规格
    • 字体回退策略
  • 实现技术
    • Python-PPTX 实现
  • 使用示例
    • 示例 1:品牌化现有 PPT
    • 示例 2:创建品牌化图表
    • 示例 3:Web 界面品牌化
  • 可访问性考虑
    • 对比度验证
  • 质量检查清单
  • 常见问题
    • Q: 如何在本地环境安装 Poppins 和 Lora 字体?
    • Q: Python-PPTX 检测不到已安装字体怎么办?
    • Q: 如何处理已有品牌色彩的文档?

品牌色彩系统

完整色彩规格

主色调

颜色名称HEXRGB用途说明
Dark#141413RGB(20, 20, 19)主要文字、深色背景、高对比度元素
Light#faf9f5RGB(250, 249, 245)浅色背景、深色背景上的文字
Mid Gray#b0aea5RGB(176, 174, 165)次要文字、分隔线、辅助图标
Light Gray#e8e6dcRGB(232, 230, 220)卡片背景、区域分隔、微妙边框

强调色

颜色名称HEXRGB用途说明
Orange#d97757RGB(217, 119, 87)主要 CTA、链接、重要强调
Blue#6a9bccRGB(106, 155, 204)次要交互、信息提示、图表
Green#788c5dRGB(120, 140, 93)成功状态、环保主题、平衡强调

色彩应用规则

文字色彩选择

def select_text_color(background_color):
    """
    根据背景色选择最佳文字颜色
    
    背景亮度 > 128 → 使用深色文字
    背景亮度 ≤ 128 → 使用浅色文字
    """
    # 计算亮度 (简化公式)
    brightness = (bg.r * 299 + bg.g * 587 + bg.b * 114) / 1000
    
    if brightness > 128:
        return DARK  # #141413
    else:
        return LIGHT  # #faf9f5

图形色彩循环

ACCENT_COLORS = [ORANGE, BLUE, GREEN]

def apply_shape_colors(shapes):
    """
    为非文字图形应用强调色
    轮流使用橙/蓝/绿以保持视觉兴趣
    """
    for i, shape in enumerate(shapes):
        if not is_text_shape(shape):
            color = ACCENT_COLORS[i % 3]
            shape.fill.solid()
            shape.fill.fore_color.rgb = color

字体系统

字体规格

Poppins (标题字体)

特征:

  • 几何无衬线字体
  • 现代、清晰、友好
  • 适合大尺寸显示

推荐用法:

  • H1/H2 标题
  • 导航菜单
  • 重点强调文字
  • 尺寸:24pt 及以上

字重选择:

  • Light (300): 副标题、轻量强调
  • Regular (400): 标准标题
  • SemiBold (600): 重要标题
  • Bold (700): 特别强调

Lora (正文字体)

特征:

  • 现代衬线字体
  • 优雅、可读性强
  • 适合长文本

推荐用法:

  • 正文段落
  • 列表项
  • 说明文字
  • 尺寸:10-18pt

字重选择:

  • Regular (400): 标准正文
  • Italic (400): 引用、强调
  • Bold (700): 段落重点

字体回退策略

FONT_FALLBACK = {
    'headings': ['Poppins', 'Arial', 'Helvetica', 'sans-serif'],
    'body': ['Lora', 'Georgia', 'Times New Roman', 'serif']
}

def apply_font(text_frame, is_heading):
    """
    应用字体,支持自动回退
    """
    font_family = FONT_FALLBACK['headings' if is_heading else 'body']
    
    for font in font_family:
        if is_font_available(font):
            text_frame.font.name = font
            break

实现技术

Python-PPTX 实现

色彩应用

from pptx.util import RGBColor
from pptx.enum.text import PP_ALIGN

# 定义品牌色彩
BRAND_COLORS = {
    'dark': RGBColor(20, 20, 19),
    'light': RGBColor(250, 249, 245),
    'mid_gray': RGBColor(176, 174, 165),
    'light_gray': RGBColor(232, 230, 220),
    'orange': RGBColor(217, 119, 87),
    'blue': RGBColor(106, 155, 204),
    'green': RGBColor(120, 140, 93)
}

# 应用到文字
paragraph.font.color.rgb = BRAND_COLORS['dark']

# 应用到形状填充
shape.fill.solid()
shape.fill.fore_color.rgb = BRAND_COLORS['orange']

# 应用到形状轮廓
shape.line.color.rgb = BRAND_COLORS['dark']
shape.line.width = Pt(2)

字体应用

from pptx.util import Pt

def apply_brand_fonts(presentation):
    """
    为整个演示文稿应用品牌字体
    """
    for slide in presentation.slides:
        for shape in slide.shapes:
            if not shape.has_text_frame:
                continue
                
            for paragraph in shape.text_frame.paragraphs:
                # 判断是否为标题
                is_heading = paragraph.font.size >= Pt(24)
                
                # 应用字体
                if is_heading:
                    paragraph.font.name = 'Poppins'
                else:
                    paragraph.font.name = 'Lora'

使用示例

示例 1:品牌化现有 PPT

from pptx import Presentation

# 加载演示文稿
prs = Presentation('original.pptx')

# 应用品牌色彩
for slide in prs.slides:
    # 设置背景
    background = slide.background
    fill = background.fill
    fill.solid()
    fill.fore_color.rgb = BRAND_COLORS['light']
    
    # 处理所有形状
    for shape in slide.shapes:
        if shape.has_text_frame:
            # 应用文字色彩
            for paragraph in shape.text_frame.paragraphs:
                paragraph.font.color.rgb = BRAND_COLORS['dark']
                
                # 应用字体
                if paragraph.font.size >= Pt(24):
                    paragraph.font.name = 'Poppins'
                else:
                    paragraph.font.name = 'Lora'
        else:
            # 应用强调色到图形
            if shape.shape_type == MSO_SHAPE.RECTANGLE:
                shape.fill.solid()
                shape.fill.fore_color.rgb = BRAND_COLORS['orange']

# 保存
prs.save('branded.pptx')

示例 2:创建品牌化图表

import matplotlib.pyplot as plt

# 使用品牌色彩
plt.style.use('seaborn-v0_8-whitegrid')

fig, ax = plt.subplots(figsize=(10, 6))

# 设置背景色
fig.patch.set_facecolor('#faf9f5')
ax.set_facecolor('#faf9f5')

# 绘制数据(使用品牌强调色)
ax.plot(x, y1, color='#d97757', linewidth=3, label='产品 A')
ax.plot(x, y2, color='#6a9bcc', linewidth=3, label='产品 B')
ax.plot(x, y3, color='#788c5d', linewidth=3, label='产品 C')

# 设置文字色彩和字体
ax.set_xlabel('时间', fontsize=14, color='#141413', fontfamily='Poppins')
ax.set_ylabel('销量', fontsize=14, color='#141413', fontfamily='Poppins')
ax.set_title('季度销售趋势', fontsize=20, color='#141413', 
             fontfamily='Poppins', weight='semibold')

# 设置图例
ax.legend(facecolor='#e8e6dc', edgecolor='#b0aea5')

# 网格线
ax.grid(color='#e8e6dc', linestyle='-', linewidth=0.5)

plt.savefig('branded_chart.png', dpi=300, facecolor='#faf9f5')

示例 3:Web 界面品牌化

/* CSS 变量定义品牌色彩 */
:root {
  --brand-dark: #141413;
  --brand-light: #faf9f5;
  --brand-mid-gray: #b0aea5;
  --brand-light-gray: #e8e6dc;
  --brand-orange: #d97757;
  --brand-blue: #6a9bcc;
  --brand-green: #788c5d;
}

/* 字体导入 */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&family=Lora:wght@400;700&display=swap');

/* 全局样式 */
body {
  font-family: 'Lora', Georgia, serif;
  background-color: var(--brand-light);
  color: var(--brand-dark);
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', Arial, sans-serif;
  font-weight: 600;
}

/* 按钮样式 */
.btn-primary {
  background-color: var(--brand-orange);
  color: var(--brand-light);
  font-family: 'Poppins', Arial, sans-serif;
  padding: 0.75rem 1.5rem;
  border: none;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.btn-primary:hover {
  background-color: #c86647;
  box-shadow: 0 4px 12px rgba(217, 119, 87, 0.3);
}

/* 链接样式 */
a {
  color: var(--brand-orange);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: #c86647;
  text-decoration: underline;
}

可访问性考虑

对比度验证

所有文字和背景组合必须符合 WCAG AA 标准:

组合对比度WCAG 等级
Dark (#141413) on Light (#faf9f5)18.5:1AAA ✅
Orange (#d97757) on Light (#faf9f5)3.8:1AA (大文字) ✅
Blue (#6a9bcc) on Light (#faf9f5)3.2:1AA (大文字) ⚠️
Light (#faf9f5) on Orange (#d97757)3.8:1AA (大文字) ✅

建议:

  • 小文字 (<18pt) 使用 Dark/Light 组合
  • 强调色主要用于大文字、按钮、图形
  • 重要信息不仅依赖颜色(添加图标、粗体)

质量检查清单

在应用品牌后确认:

  • [ ] 所有标题 (24pt+) 使用 Poppins 字体
  • [ ] 所有正文使用 Lora 字体
  • [ ] 文字颜色为 Dark 或 Light(根据背景)
  • [ ] 图形使用橙/蓝/绿强调色
  • [ ] 背景为 Light 或 Light Gray
  • [ ] 对比度符合 WCAG 标准
  • [ ] 视觉层级清晰
  • [ ] 品牌一致性贯穿始终

常见问题

Q: 如何在本地环境安装 Poppins 和 Lora 字体?

A:

macOS:

# 下载字体
wget https://fonts.google.com/download?family=Poppins
wget https://fonts.google.com/download?family=Lora

# 解压并安装
unzip Poppins.zip -d ~/Library/Fonts/
unzip Lora.zip -d ~/Library/Fonts/

Windows:

  1. 访问 Google Fonts
  2. 下载 Poppins 和 Lora
  3. 右键 .ttf 文件 → "安装"

Linux:

sudo apt install fonts-google-lora
sudo fc-cache -f -v

Q: Python-PPTX 检测不到已安装字体怎么办?

A: Python-PPTX 依赖系统字体配置:

  1. 确认字体已正确安装
  2. 重启 Python 环境
  3. 使用回退字体(Arial/Georgia)

Q: 如何处理已有品牌色彩的文档?

A: 提供选项:

  • 完全覆盖:替换所有颜色
  • 混合模式:仅替换中性色,保留强调色
  • 不应用:跳过已有品牌的文档

返回:📋 概览 | 技能列表

Prev
📋 概览