精选 · 开放 · 免费
Flowen Me
为创意开发者打造的高对比度、字体张力强烈的作品集。
Developer ToolsPortfolioBold TypographyExperimentalGeometric
01
设计气质 DNA
大胆工业风实验性直接开发者作品集
一个霓虹灯照亮的极简主义工业仪表盘。
02
色彩
#FFFFFFInk
#161B1BBG
rgba(255, 255, 255, 1)Line
深沉的背景与明亮的白色文字形成极致对比,实现最佳可读性与视觉冲击力。
03
字体
geometric-sans · display-serif · monospace
- display
100px · 700 - body
108px · 700
所有主文本均设为大写。 · 标题使用紧凑排列的大号几何无衬线字体。 · 备选标题使用装饰性展示衬线字体。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
主要章节间采用充裕的垂直间距,以分隔大段的文字块。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 0px
无可见边框,完全依靠字号层级与空间分隔。
06
布局
不对称、以文字为主导的布局,文字决定内容流向。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
交互文本元素上的光标变为指针。 · 标准链接导航。
08
组件
- button 带下划线或箭头的文本链接。
- card 无,图像直接融入文字流中。
- chip 无。
- input 无。
- hero 大号文字堆叠搭配项目缩略图。
09
文案语气与禁用清单
- 语气 直接、自信、略带不羁。
- 标题风格 简短有力、大写的词汇垂直堆叠。
- 按钮文案 带箭头或下划线的直接文字链接。
- 不要使用居中布局——截图显示为左对齐、不对称的文本块。
- 不要使用微妙的色彩或渐变——截图显示为鲜明的高对比度色板。
- 不要使用小型或标准字号——截图显示为巨大的展示级字体。
- 不要使用圆角——截图显示为尖锐的矩形边缘。
- 不要使用复杂的图标或按钮——截图显示为简单的文本导航。
- 不要使用浅色主题——截图显示为深色背景搭配亮色文字。
- 避免: 客套话
- 避免: 复杂句式
- 避免: 柔和边缘
- 避免: 渐变背景
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个为创意开发者设计的高对比度、实验性作品集。其设计DNA由置于极深背景(#161B1B)上的大号大写文字定义,使用明亮的白色墨水(#FFFFFF)以达到最大冲击力。字体类别包括用于主标题的粗体几何无衬线字体,以及用于次要元素的装饰性展示衬线字体。布局不对称,完全由字号层级而非传统网格或卡片驱动。关键禁忌:不要使用圆角或柔和阴影,美学应是尖锐且极简主义的。不要将内容居中;保持强烈的左对齐文字节奏。避免使用标准正文字号;所有文字都应被视为展示元素。
en · zh-CN · zh-TW · ja · ko