采用包豪斯几何构成风格,整体以红黄蓝三原色在暖色画布上碰撞出强烈的视觉张力,营造理性、宣言式、充满力量感的氛围。每一个色块和线条都经过精心编排,如同蒙德里安画框中跳出的音符。
配色
主色包含深红 #991b1b、海军蓝 #1e3a5f,强调色为正红 #dc2626 与皇家蓝 #2563eb。背景采用暖色渐变 linear-gradient(160deg, #fef3c7 0%, #fef9c3 50%, #f0f9ff 100%),如同一张泛黄的画布。卡片使用 rgba(255,255,255,0.94) 承载内容,边框 rgba(0,0,0,0.3) 以清晰的黑色描边勾勒几何轮廓。
排版
标题使用粗壮的几何无衬线字体,字重偏重,字间距略宽,呈现出工业设计的精确感;正文则采用较细的几何字体,层级分明。文字本身就是几何的一部分,嵌入色块容器之中。
布局
以几何形状为画面的骨架——圆形、三角形、矩形大胆切分画面空间,原色色块占据大面积区域,内容则沿着几何分割线排列。不对称布局制造视觉张力,但每一个元素都严格对齐到隐形的网格之上。几何色块是视觉主角,正文信息保持低到中密度,不要把每个几何区域都填成内容卡片。
动画
perspective-zoom、cube-rotate-3d、morph-shape
适合场景
设计宣言、艺术史叙事、产品美学发布、品牌视觉系统展示——需要让视觉自己说话、让设计理念无需解释就能被感知的时刻。
配图
品牌主张、概念命名、产品精神、活动开场和章节转场页,可把一个产品轮廓、建筑局部或运动方向压缩成红黄蓝几何海报构图;不是照片,也不把复杂流程画成抽象图。
数据、逻辑链、步骤、比较和需要读出精确关系的页面不配图。
不要
- 不要使用复杂渐变或照片级图像
- 不要使用柔和的曲线或有机形状
- 不要使用超过三种以上的强调色
- 不要让装饰元素抢走几何构成的主角地位