Superpower

白色基底、大幅摄影展示与紧密字距。

页面以白色为基底，搭配近黑色文字。字体采用 NB International Pro、NB International Mono Pro。视觉特点包括大幅摄影展示、紧密字距、细线分隔、宽松留白。适合参考的场景：摄影作品集、视觉内容展示页。

查看原始网站

使用规范

建议采用

仅使用晨曦珊瑚色（#fc5f2b）作为填充型主要操作按钮和品牌标识——禁止用于正文、图标或装饰背景
展示标题使用400字重，字间距-0.025em，行高1.0——轻盈字重是其标志性特征
将导航以深色胶囊形式悬浮于图像之上，绝不可作为扁平顶部栏呈现
所有按钮和导航CTA均使用9999px圆角半径以维持胶囊形态
表面层级堆叠顺序为：白色 → 雾灰 → 碳黑——禁止使用中性色调的彩色表面
仅将大理石珊瑚渐变用于会员视觉卡片——这是独一无二的品牌资产，不可复用为通用图案
每个主要CTA必须配以信任徽标行（HSA/FSA、支付图标）紧随其下，高度为11–13px的锌灰色

建议避免

不要使用厚重的投影阴影——系统最多仅使用单层2px细线阴影，大多数卡片完全无阴影
不要在展示标题中使用700字重——56–66px时应使用400字重，700仅用于小标签和按钮文本
不要引入额外的彩色元素——该系统刻意采用双色体系（珊瑚色+中性色）
卡片不得使用方形角——最小圆角为5px，卡片默认为15px
在首屏区域图像上放置正文内容时，必须有深色遮罩或足够对比度——首屏区域图像本意为深色，以确保文字可读性
不要使用晨曦珊瑚色CTA的描边或透明描边变体——它始终为填充式胶囊形态
不要将大理石渐变扩展至背景或区块分隔线——它仅属于会员卡片的艺术作品

正在读取模板权限…

使用指南

# Superpower — Style Reference
> Bioluminescent health command center
 
**Theme:** light
 
Source measurements are normalized; roles and recommendations are interpreted. Font summary lists are independent, not paired by position. HTML examples are reconstructions, not source components.
 
Superpower wraps a serious clinical promise in cinematic, atmospheric UI: full-bleed dark photography heroes transition into crisp white content surfaces, with one vivid sunrise-orange accent pulsing through the system. Typography carries the brand — a proprietary geometric sans at whisper-tight negative tracking, scaling from 11px metadata to 66px display with line-heights that compress as sizes grow (1.00 at display, 1.40–1.50 at body). A floating dark pill navigation bar hovers over imagery, and pill-shaped CTAs create a tension between clinical precision and warm vitality. Surfaces are mostly flat — the system relies on generous white space, hairline zinc dividers, and a single faint shadow pattern rather than heavy elevation. Color is rationed: nearly everything is black, white, or zinc-gray, and the orange appears only as functional punctuation on actions and brand marks.

Superpower

使用规范

建议采用

建议避免

相似设计语言

Letters

WHOOP

Augen Pro

Chat for impact

Function

Ameba