Home
暖白色基底、大幅摄影展示与细线分隔。
HubSpot
白色基底、衬线字形与细线分隔。
页面以白色为基底，搭配近黑色文字。局部操作控件以橙色强调。字体采用 HubSpot Sans、HubSpot Serif。视觉特点包括衬线字形、细线分隔、分屏构图、大幅摄影展示。适合参考的场景：软件产品首页、服务说明页。
查看原始网站使用规范
建议采用
- 所有行动号召、激活状态、品牌图标及功能强调点均应使用Sprout Orange（#ff4800）——绝不可用于装饰性背景或大面积填充。
- 所有按钮保持8px圆角，所有卡片和图片保持16px圆角——这一双圆角系统是整个界面的结构性语言。
- 为每个主要的填充型行动号召（CTA）配一个透明描边型行动号召（CTA），使用相同的橙色——它们始终在首屏和区块级行动号召中成对出现
- 正文使用HubSpot Sans 16px字重400，行高1.56——16/25的节奏是页面的默认阅读基准。
- 所有24px及以上标题使用HubSpot Serif（500字重，单字重）——衬线与无衬线字体的搭配是该系统的标志性对比。
- 在区块背景之间交替使用Canvas Cream（#fcfcfa）和Warm Parchment（#f8f5ee）以营造纸张质感的节奏——绝不可使用纯白（#ffffff）
- 仅将HubSpot Serif Page Header Human设定为80px用于首屏标题——它是最响亮的声音，若重复使用将削弱其影响力。
建议避免
- 不要引入第二个色彩——该系统建立在2%的色彩度之上，加入蓝色、绿色或紫色会破坏编辑风格的信号。
- 不要在卡片上使用阴影或厚重的堆叠效果——Warm Parchment上的1px细线边框是整个深度系统的体现；添加盒阴影会破坏纸张质感。
- 不要在小于24px时使用HubSpot Serif——衬线字体的曲线需要足够尺寸才能被识别；在正文尺寸下，它会与HubSpot Sans竞争，造成视觉噪音。
- 不要将纯白（#ffffff）作为页面背景——Canvas Cream和Warm Parchment更温暖且更具辨识度；纯白会让界面显得冷冰冰。
- 不要在衬线字体中使用多种字重——HubSpot Serif仅存在于500字重；层级关系由尺寸决定，而非字重。
- 不要将Sprout Orange用于大面积装饰性背景、插图或首屏渐变背景——渐变系统是唯一例外，即便如此，其不透明度也仅为0.3。
- 不要在按钮或输入框上使用16px的圆角——按钮与卡片之间8px/16px的圆角差异是视觉层级结构中的关键支撑。
