精选 · 开放 · 免费
Wrdlss Club
一个响应用户存在与交互的交互式 ASCII 艺术乐园。
Developer ToolsExperimentalTypographyMonochromeClean
01
设计气质 DNA
ASCII粗野主义终端生成式交互
黑客终端,亦是艺术画布
02
色彩
#000000Ink
#FFFFFFBG
rgba(229,231,235,1.0)Line
严格单色,白底高对比度黑
03
字体
monospace
- display
48px · 400 - body
16px · 100
所有文本使用等宽字体,建立严格的网格对齐 · 主要大量使用浅字重(100)用于主体内容 · UI 元素采用全大写转换
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
等宽字符建立起固有的字体排印网格
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 16px
pill · 999px
1px solid rgb(229,231,235)
06
布局
1440container
1columns
8pxgutter
390 / 768breakpoints
用于 ASCII 画布的全宽单栏布局
07
动效与交互
300msmicro
500mssmall
1000msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
文本元素的淡入过渡 · ASCII 字符的持续生成
鼠标指针指示可点击元素 · 触发新 ASCII 艺术字符的生成
08
组件
- button 极简大写文本按钮,鼠标指针显示
- card 作为视觉区块的 ASCII 艺术元素
- chip 以方括号包裹的元数据标签,如 [CHROME 131.0.0.0]
- input 无可见元素
- hero 大规模生成式 ASCII 艺术场域
09
文案语气与禁用清单
- 语气 技术性、艺术性、直接
- 标题风格 大型 ASCII 艺术构图
- 按钮文案 极简方括号包裹的 UI 元素
- 不使用彩色渐变——截图显示为严格黑白
- 不使用衬线字体——截图显示为全等宽字体
- 不添加投影——截图显示为完全扁平的表面
- 不使用重字重——截图显示为以字重 100 为主
- 不添加圆角 UI 元素——截图显示为尖锐的几何形态
- 不使用彩色强调色——截图显示无强调色
- 避免: 彩色渐变
- 避免: 装饰性字体
- 避免: 复杂的导航菜单
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
一个极简、粗野主义的数字画布,以 ASCII 艺术作为主要视觉语言。设计严格单色,依赖黑(#000000)与白(#FFFFFF)的配色方案,配以细微的浅灰色边框。字体排印仅使用等宽字体,采用浅字重(100),并对 UI 元素进行大写转换。布局为一个全宽单栏容器,优先展示生成式 ASCII 艺术作品。交互元素极简,使用方括号包裹的元数据标签。该站点既作为艺术宣言,也作为技术试验场,追踪用户交互如点击和长按。关键约束包括:避免所有色彩、保持严格的等宽字体排印、保留原始、受终端启发的美学。系统追踪用户存在与交互指标,并在 UI 中以带方括号的数据点形式显示。
en · zh-CN · zh-TW · ja · ko