精选 · 开放 · 免费

Intercom

这款高端的AI原生帮助台，优先考虑清晰度、克制力与优雅的功能性。

SaaSCleanProductivityCalmRefined
Intercom 网站截图
↓ 下载设计系统包 (25 MB)在 OpenDesign 中打开

原站: https://www.intercom.com

📦 浏览包内文件 →

01

设计气质 DNA

帮助台AI客户支持自动化企业

一个精致的现代化企业仪表板，融合了高端编辑摄影与简洁的软件界面。

02

色彩

#0007cbAccent
#111111Ink
rgba(17,17,17,0.7)Ink soft
#ffffffBG
#f1eee9BG soft
#d3cec6BG quiet
rgba(17,17,17,0.4)Muted

以高对比度的单色为基础，搭配温暖的米色中性色，以及一个用于交互高亮的深蓝色点缀色。

03

字体

geometric-sans · humanist-sans · monospace

04

间距

4px
8px
12px
16px
24px
32px
48px
64px
96px

以4px为基础单位，搭配充足的垂直间距以提升可读性。

05

表面 (圆角 / 阴影 / 边线)

sm · 4px
md · 8px
lg · 12px
pill · 999px

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全宽响应式布局，内容列设有最大宽度限制。

07

动效与交互

220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

在颜色、背景颜色和边框颜色属性上实现平滑过渡。 · 在hover状态下实现微妙的背景尺寸动画。

平滑的颜色和背景颜色过渡。 · 立即响应，带有微妙的缩放或颜色变化。

08

组件

09

文案语气与禁用清单

10

包内真实截图

Intercom — 桌面首屏（hero）
桌面首屏（hero）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Intercom — 移动首屏
移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Intercom的主页是现代SaaS设计的典范，融合了高端编辑美学与简洁、功能性的界面。其核心身份是专业的、以AI为中心的，使用以白色（#ffffff）、温暖的米色（#d3cec6）和近黑色（#111111）文字为锚点的克制配色方案。字体主要为简洁的几何与人文主义无衬线字体，主标题使用54px的醒目显示尺寸，搭配紧凑的字间距。关键交互采用平滑的0.4秒过渡。关键设计原则：优先考虑充足的留白，避免过度装饰的元素，并以单色基础搭配微妙的温暖中性色，让产品图像和深蓝色（#0007cb）点缀色得以突出。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效，整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko