# Premium Color Blocking

> 高级撞色风格追求一种**时尚编辑大片**般的戏剧张力——用大胆却克制的撞色，把日常信息排版成有态度的画面。它不是花花绿绿的喧闹，而是像《Vogue》《Wallpaper》封面那样，靠两到三种高纯度色块的强力对峙，托出一种克制的高级感。整体节奏要稳、留白要狠、字体要利落，让色彩本身成为情绪的主角。

- Skill: `arcsin1/premium-color-blocking` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add arcsin1/premium-color-blocking`
- Raw SKILL.md: https://api.skillmd.com/api/skills/arcsin1/premium-color-blocking/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: arcsin1 (https://skillmd.com/u/arcsin1)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/arcsin1/premium-color-blocking

---

高级撞色风格追求一种**时尚编辑大片**般的戏剧张力——用大胆却克制的撞色，把日常信息排版成有态度的画面。它不是花花绿绿的喧闹，而是像《Vogue》《Wallpaper》封面那样，靠两到三种高纯度色块的强力对峙，托出一种克制的高级感。整体节奏要稳、留白要狠、字体要利落，让色彩本身成为情绪的主角。

## 配色
核心是"暖橙 × 冷墨"的强对峙：主暖色用珊瑚橙 `#FF6B47` 与琥珀橘 `#F5A623`，传递温度与自信；对峙冷色用深墨蓝 `#1B2A4A` 与午夜青 `#0F3B4C`，压住暖色的躁，让画面沉下来；中性背景用奶白 `#F4EFE6` 与象牙 `#EDE4D3`，给撞色留呼吸空间；强调点缀用一点正红 `#E63946` 或柠黄 `#F4D35E`，只在标题、数字、关键标点上点一下，像项链上的那颗主石。色彩比例大致是 暖 45% / 冷 30% / 中性 25%，比例失衡会立刻垮掉高级感。

## 排版
标题用粗壮的几何无衬线（思源黑 Heavy / Inter Black 之类），字重 800–900，字距收紧到 -2%，传递"我说了算"的确定感；副标题同字族降到 500，留出呼吸；正文用清爽无衬线 400 字重，行高 1.6。中文配思源黑体，英文配 Inter 或 Helvetica Neue。数字和引语可以放大成展示字，让排版有节奏起伏。

## 插画与装饰
装饰母题走"色块切割"路线：大面积平涂色块、斜向切分构图、几何形状（圆/半圆/粗线条）做视觉锚点；可以点缀极简线描（一只手、一片叶、一个抽象侧脸）增加人文气息；不要写实景插画、不要拟物阴影。色块边缘要锐利干净，像丝网印刷的质感。

## 布局
借鉴杂志版式：网格严谨但敢于破格。常见结构是左大色块右白底文字、上下撞色对半切、或中心图片被色块环绕。关键标题可以越出版心、与色块咬合。模块之间用粗实线或色带分隔，而不是细弱发丝线。整页元素不超过 5 个层级，多了就乱。

## 动画
节奏要干脆利落，像翻杂志的"啪"一下。色块用 ease-out 0.5–0.7s 滑入或淡入；文字稍滞后 0.2s 上滑 16px；强调数字可以带一点放大弹跳（scale 0.9→1，cubic-bezier(0.34, 1.56, 0.64, 1)）。避免柔长缓动——那会拖垮撞色的力量感。

## 适合场景
品牌发布、时尚潮流、年度总结、产品发布会、创意提案、视觉作品集

## 配图
品牌、产品、概念焦点和章节转场页，可用高时装式色块或单一植物线稿建立一个强视觉锚点；平面丝网感与留白优先，不把抽象图当商业信息。

数据、市场分析、流程、比较、时间线和方案表不配图。

## 不要
- 不要超过三种主色，撞色不是彩虹
- 不要柔粉、马卡龙、莫兰迪这类低饱和温柔色——它们和"高级撞色"气质相反
- 不要渐变背景或毛玻璃模糊，平涂色块才是主角
- 不要拟物阴影、不要 3D 立体效果，保持平面丝网印刷感
- 不要花体字或衬线字体做正文，会破坏现代利落感
- 不要元素挤满画面，留白是撞色高级感的另一半