Shopify
近黑色基底、大幅摄影展示与胶囊形控件。
Outseta
白色基底、手写字体点缀与渐变展示。
页面以白色为基底，搭配深紫色文字。字体采用 Inter Var、Kaio。视觉特点包括手写字体点缀、渐变展示、居中构图、单栏阅读排版。适合参考的场景：软件产品首页、服务说明页。
查看原始网站使用规范
建议采用
- 所有展示标题使用 Kaio 700，字号 56-80px——它是唯一的强势声音；同一视图内绝不搭配第二个粗体字体。
- 将 #df37a7（粉红信号）仅用于每个视口内的一个元素——主要行动号召按钮——且该页面中仅此一处亮粉。
- 所有阴影均需带有品牌紫色 rgba(32-41,0,36,x) 调色，绝不使用中性黑色阴影用于卡片、按钮或弹窗。
- 每个H1/H2上方的区块眉题采用JetBrains Mono和0.10em字间距，这是系统的区块转折信号。
- 仅将 145deg 夕阳渐变（粉 → 奶油 → 黄）应用于满幅延展的首屏区域；绝不用于卡片、按钮或小表面。
- 卡片默认使用 14px 圆角，按钮使用 6px；14/6/3（卡片/按钮/输入）的层级结构使表面呈现出不同的材质感。
- 首屏区域仅放置 1-3 个 Permanent Marker 注释，每个指向特定元素并配以手绘 SVG 箭头——它们是营销风格的 界面外围元素，而非导航功能。
建议避免
- 绝不将 #df37a7 用于除主要行动号召按钮之外的任何用途——不用于链接、边框或文本强调。
- 绝不同时在同一个屏幕上搭配 Kaio 与第二个展示性衬线或无衬线字体——Fraunces 和 Chakra Petch 出现在数据中的情况仅为孤立的装饰性时刻，非系统字体。
- 绝不引入第四个边框圆角——999px/14px/6px/3px 的层级已完整；增加 8px 或 10px 会破坏材质层级结构。
- 绝不将 Permanent Marker 注释放置在首屏渐变带之外——它们会失去对比度，在白色背景上读作断裂的文本。
- 绝不使用中性黑色（#000000）用于阴影、文本或边框——Aubergine #240029 是结构用墨；黑色会破坏色彩一致性。
- 绝不在一个组件中叠加超过两种文本颜色——系统仅使用 #240029（主色）和 #6d526d（次色）作为文本，加上 #d4ccd4 作为柔和辅助色。
- 绝不将首屏渐变应用于按钮、徽章或图标——它是一种页面级的氛围处理，而非组件填充。
