跳到正文
第一组原创风格,现已开放预览。看看效果
c.Collected Skills
EN浏览 Skills

可交互预览移动鼠标,试试画面里的细节。

瑞士动态网格
样稿中的虚构产品为 Tessera。
原创风格

瑞士动态网格

让字体、网格和信号红说话。

网页瑞士排版动态网格信号红
先看效果

这是一份原创风格样稿。Skill 文件正在准备中,发布后可在这里安装或下载。

打开完整预览

窄体粗字与严整的十二列网格。文字从下方升起,红色色块横扫画面,关键数字随柱状图一起显现。适合简洁而有冲击力的产品表达。

预览形式
HTML · GSAP
配色
#eeede9#0e0e0e#ff3b1f
使用指南

动效细节

  • 网格线与标题错峰进场
  • 红色块横扫与数字计数
  • 柱状图随节奏升起

适合用来做

  • 产品发布与开发者工具
  • 需要突出关键数据的首页

创作提示示例

可以用这段话向 Agent 描述你想要的方向。完整 Skill 发布后,会提供对应的模板与用法。

为我的产品设计瑞士动态网格风格的首屏:米灰背景、十二列网格、黑色窄体粗字与一种信号红。标题分行,重点单词放在红色块上,右侧用数字与柱状图展示一个真实数据。动效简短有节奏,尊重减少动态效果设置。