精选 · 开放 · 免费

Stytch

一个简洁、排版驱动的开发者平台身份，用于安全的认证API。

devauth
Stytch 网站截图
↓ 下载设计系统包 (10 MB)在 OpenDesign 中打开

原站: https://stytch.com

📦 浏览包内文件 →

01

设计气质 DNA

身份认证平台开发者API

一个强大、面向开发者的工具包，用于构建安全的身份层，平衡了技术深度与企业级可靠性。

02

色彩

#1D1D1DInk
#525151Ink soft
#FBFAF9BG
#F2F0EEBG soft
#CECECEMuted
rgba(29,29,29,0.15)Line

以暖白色为基础的高对比度单色调色板，优先考虑易读性和专业克制。

03

字体

humanist-sans · monospace

在主视觉展示和主要标题中使用Booton/BootonUncommon字体。 · 在所有正文文本、导航、按钮和技术元素中使用Chivo Mono字体。 · 为大号展示型文字保持紧凑的字间距（-1px到-2px）。

04

间距

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

一致的基于4px的空间节奏，主视觉区域采用充足的内边距（48px）。

05

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

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

使用墨迹色和柔和色调的1px实线边框，通常按方向（底部/右侧）应用。

rgba(0, 0, 0, 0.5) 0px 8px 10px 0px

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

居中的内容容器，主视觉区域采用简洁的单栏流式布局。

07

动效与交互

150msmicro
300mssmall
800msmedium
cubic-bezier(0.87, 0, 0.13, 1)easing

交互元素微妙的transform过渡。 · hover状态和焦点变化的平滑缓动曲线。

细微的透明度或背景色变化。 · 最小化的视觉反馈，依赖状态变化。

08

组件

09

文案语气与禁用清单

10

包内真实截图

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

抓自真实页面 · 真 computed styles

11

System Prompt

Stytch是一个专业的、面向开发者的身份平台，使用高对比度的单色调色板。主要颜色是暖白色（#FBFAF9）和近黑色墨迹（#1D1D1D），柔和的灰色（#525151, #CECECE）用于次要文本。排版以展示用的人文无衬线字体（Booton）和用于正文及技术UI的简洁等宽字体（Chivo Mono）为主。避免鲜艳的颜色点缀、复杂的渐变或俏皮、异想天开的元素。关键设计约束：优先为所有功能文本使用等宽字体排版，采用基于4px的间距并在主视觉区域使用充足的内边距，并保持严格的平面、高对比度视觉语言。确保所有UI组件保持简洁、带边框且易读。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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