Textla 网站预览
Textla 网站预览

Textla

黄色基底、手绘图形与胶囊形控件。

页面以黄色为基底,搭配深绿色文字。字体采用 National 2 Condensed、RethinkSans。视觉特点包括手绘图形、胶囊形控件、圆角卡片、大字排版。适合参考的场景:软件产品首页、服务说明页。

查看原始网站

使用规范

建议采用

  • #10380b(Forest Ink)用于全部正文、边框、图标和主要操作填充;它是系统唯一的墨色。
  • 抬升卡片和产品模型图采用8px 8px 0 0 #10380b硬偏移阴影,绝不要用于按钮或输入框。
  • 标题采用56px+的National 2 Condensed,每个字号都保留-0.03em letter-spacing。
  • 每个填充胶囊CTA都配一个无填充文字链接作为同级操作,形成填充加尖括号文字的双按钮节奏。
  • 所有默认分区以#f2ee98(Sunlit Cream)作为页面画布;#fefde6(Parchment)只用于需要提升一级的卡片表面。
  • #fce519(Marigold)应克制使用,只用于星级评分、首屏CTA和装饰图标点缀,绝不要用于正文或大面积填充。
  • 所有按钮圆角保持1440px完整胶囊形,所有卡片和图像圆角保持40px;这组圆角定义系统的柔软感。

建议避免

  • 正文不要使用#fce519;Marigold在奶油色上对比度不合格,绝不应承载段落。
  • 不要采用柔和高斯阴影;唯一的抬升语言是Forest Ink的8px硬偏移。
  • 窄体展示字体National 2 Condensed不要低于20px;它作为UI文字时会变得难以辨认。
  • 不要引入蓝、紫或任何非绿黄的色相;系统严格保持温暖植物气质。
  • 任何容器都不要采用0px直角;系统始终圆润,最小为16px。
  • RethinkSans不要低于600字重;字体没有轻字重,更轻的设置会错误渲染。
  • 页面背景不要采用白色(#ffffff);画布始终是Sunlit Cream,白色只出现在产品模型图内部和深绿色表面上。