Shopify
近黑色基底、大幅摄影展示与胶囊形控件。
Designmodo
近白色基底、胶囊形控件与紧密字距。
页面以近白色为基底，搭配深蓝色文字。局部操作控件以绿色强调。字体采用 InterVariable。视觉特点包括胶囊形控件、紧密字距、分屏构图、产品图像展示。适合参考的场景：产品介绍页、品牌展示页。
查看原始网站使用规范
建议采用
- 所有主要交互元素（CTA 按钮、激活状态、成功徽章）在深色与浅色区域均使用 #27ae60——这是系统中唯一允许作为按钮填充的绿色。
- 所有 CTA 胶囊按钮统一设置 999px 的边框圆角；次级操作和导航标签保留 17px 的圆角；大尺寸产品卡片使用 32px 圆角。
- 首屏标题（48–57px）设置为 700 字重，字间距为 -0.022em 至 -0.028em，并启用 InterVariable 特性设置 '"cv03" on, "cv04" on, "cv06" on, "cv09" on, "ss03" on'。
- 导航「注册」按钮仅使用 #f49a40（琥珀色）——系统内其他元素均不得使用此色。该色不得用于页面内任何内容区域的 CTA。
- 仅对产品截图图像应用绿色调阴影（rgba(17, 50, 38, 0.14) 14px 17px 40px 0px）——切勿用于卡片、弹窗或按钮。
- 首屏与页脚交替使用 #0e231c 深色与浅色 #f4f7f2/#ffffff，以统一调色板贯穿页面内容，形成视觉闭环。
- 仅在标题内以行内词级强调使用 #5c51e0（虹色）和 #defaca（草语）——切勿作为按钮填充或背景色块。
建议避免
- 切勿将琥珀色导航按钮（#f49a40）用于正文 CTA 或功能区域——该色仅属于顶部导航，用以独特标识账户创建行为。
- 切勿在卡片或面板上应用绿色调阴影——卡片边界仅由背景色对比（青色、白色、页面灰）定义。
- 切勿在未启用 OpenType 特性设置的情况下使用 Inter 字体——必须启用 'cv03'、'cv04'、'cv06'、'cv09'、'ss03' 才能匹配品牌专属字形变体。
- 切勿在任一文本大于 12px 时使用正字间距（字间距）——+0.118em 值仅限于 11px 的大写微标签使用。
- 切勿引入除 400、500、600、700 之外的额外字重——四档字重已足够，增加 300 或 800 会破坏排版体系。
- 切勿使用除 #ff5722 之外的任何颜色用于文章分类徽章——紫色、绿色或蓝色徽章将与色彩层级语义冲突。
- 切勿在功能产品卡片上使用卡片阴影或边框——青色背景（#edf9f2）与白色或灰色页面背景的对比是唯一的边界界定方式。
