精选 · 开放 · 免费

Socio Type

一个极简主义字体铸造厂，通过高对比度摄影首图与充足的字体样张展示，呈现当代字体家族。

TypographyPortfolioPhotographicCleanEditorial

Socio Type 网站截图

↓ 下载设计系统包 (47 MB)在 OpenDesign 中打开

原站: https://socio-type.com

📦 浏览包内文件 →

01

设计气质 DNA

字体铸造厂字体样张当代编辑风格高端

一个在混凝土墙面上展示字体的画廊

02

色彩

#000000Ink

#ffffffBG

#f7f7f6BG quiet

#818181Muted

rgba(0,0,0,0.16)Line

采用黑、白及中性暖灰的严格单色调色板

03

字体

humanist-sans

display250px · 400
headline26px · 400
body14px · 400
caption12px · 400

所有文字使用 400 字重，并赋予充足的字间距 · 导航标签使用大写字母 · 展示尺寸极为巨大，常超过 200px

04

间距

4px

8px

12px

16px

24px

32px

48px

64px

96px

120px

基于 4px 网格，采用宽敞的大块间距

05

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

sm · 0px

md · 0px

lg · 0px

pill · 0px

使用 1px 虚线作为分隔线，无圆角

06

布局

1280container

12columns

24pxgutter

768 / 1024breakpoints

全幅出血摄影首图，后接非对称多栏字体样张网格

07

动效与交互

220msmicro

500mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

所有过渡效果应用于 transform 和 opacity · 颜色状态变化采用自定义属性过渡

文本元素的颜色过渡 · 交互元素使用标准指针光标

08

组件

button 基于文本的极简按钮，带虚线下划线
card 无卡片组件；内容以开放式网格布局呈现
chip 未使用标签组件
input 无可见的输入组件
hero 全幅出血摄影背景，上覆巨幅白色排版文字

09

文案语气与禁用清单

语气客观、描述性且具权威感
标题风格 大胆、大尺度的字体样张展示，让字体自身发声
按钮文案 低调，使用“更多信息”并配以虚线下划线

勿用圆角——截图显示严格为 0px 尖角
勿用投影——截图显示完全扁平的表面
勿用鲜艳的强调色——截图显示严格的黑/白/灰色调
勿用粗体或较重字重——截图显示通篇使用 400 字重
勿用居中对齐文本——截图显示以左对齐排版为主
勿用繁杂的背景图案——截图显示干净的纯色或全幅出血摄影
避免: 营销术语
避免: 过多颜色
避免: 装饰性 UI 元素

10

包内真实截图

Socio Type — 桌面首屏（hero） — 桌面首屏（hero）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Socio Type — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Socio Type 是一个当代字体铸造厂网站，具有极简、编辑风格的美学。设计基因建立在严格的单色调色板上，以纯黑 (#000000) 和纯白 (#ffffff) 为主色，辅以中性暖灰 (#818181, #f7f7f6)。排版仅使用 humanist-sans 字体家族，字重为 400，并赋予充足的字间距。布局采用全幅出血摄影首图，上覆巨幅白色字体样张文字，后接简洁的字体样张网格。关键约束：绝不使用圆角，避免所有投影，并绝不引入鲜艳的强调色。设计依靠极致的排版尺度与充足的空白，营造出高端的编辑品质感。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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