Menu
Swiss-grid statistic anchor — giant number, red accent, growing bars, black data bar. Rational and editorial.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
A native Remotion data frame — bars grow from zero by real data via spring physics while the figures roll 0→target in sync. The numbers come alive in a way a static HTML chart can't.
A 1970s European editorial poster in motion — a red rule draws across, a giant tilted figure drops in, a three-line headline rises line-by-line, an italic serif standfirst fades.
Bold colored card on a dark gradient — big section number, nav breadcrumb, orange card sliding in, title rising.
Luxury-minimal whitespace hero — single word reveals letter by letter, warm-gold hairline, breathing indicators.
Electric split with hand-drawn script — offset panels slide in, display title rises with an outlined word, script strokes itself in.
Two-panel split with quote as hero — white/blue panels open from center, accent bar grows, quote reveals line by line.
| name | frame-pentagram-stat |
| zh_name | 瑞士网格数据帧 |
| en_name | Pentagram Stat Frame |
| emoji | 📊 |
| description | Swiss-grid statistic anchor — giant number, red accent, growing bars, black data bar. Rational and editorial. |
| zh_description | 瑞士网格数据帧:巨大数字锚点 + 红色强调 + 生长条形图 + 黑色数据底栏, 理性克制的编辑风 |
| en_description | Swiss-grid statistic anchor — giant number, red accent, growing bars, black data bar. Rational and editorial. |
| category | video |
| scenario | video |
| aspect_hint | 1920×1080 (16:9) |
| featured | 0 |
| recommended | 8 |
| tags | ["stat","swiss-grid","editorial","data","pentagram","number","frame"] |
| example_id | sample-frame-pentagram-stat |
| example_name | 瑞士数据帧 · 95.7 |
| example_format | markdown |
| example_tagline | 巨大红黑数字 + 瑞士网格 + 生长条形图 |
| example_desc | 单一关键指标锚点 + 网格线扫入 + 黑色数据底栏滑入 |
| example_source_url | https://github.com/alchaincyf/huashu-design |
| example_source_label | huashu-design · Pentagram (MIT) |
| od | {"mode":"video","surface":"video","scenario":"video","featured":0,"upstream":"https://github.com/alchaincyf/huashu-design","preview":{"type":"html","entry":"index.html","reload":"debounce-100"},"design_system":{"requires":false},"example_prompt":"Use the Pentagram Stat Frame template to turn my key metric into a Swiss-grid data reveal — a giant number anchor, red accent, growing bar chart, and a black data bar. Preserve the template's visual signature, use real numbers, and avoid lorem ipsum or placeholder images.","example_prompt_i18n":{"zh-CN":"用「瑞士网格数据帧」模板把我的关键指标做成一段瑞士风数据揭示:巨大数字锚点 + 红色强调 + 生长条形图 + 黑色数据底栏。保持模板的视觉签名,使用真实数字,避免 lorem ipsum 和占位图片。"}} |
【模板: 瑞士网格数据帧 (Pentagram Stat)】 【意图】单一关键指标 / benchmark 揭示 / 编辑风数据页。视觉提炼自 huashu-design 的 Pentagram 流派 (MIT, © alchaincyf)。
【画布】1920×1080, 纯白底 #ffffff; 叠瑞士网格 — 水平/垂直细线 (黑, opacity 0.04-0.06), 开场 0.7s 内 scaleX/scaleY 从 0 扫入。
【字体】西文 Archivo (900/700/500) 或 Helvetica Neue; 中文 Noto Sans SC Bold。理性、紧凑、负字距。
【主结构 (时间轴, 默认 4s)】
#E63946) fadeUp。#E63946 红强调。#999) fadeUp。#E63946 红 + opacity 0.85, 其余黑 opacity 0.12。【配色纪律】仅用 黑 / 白 / #E63946 红 / 中性灰 #999。严禁其他彩色。红色是唯一强调色, 用在 label / 主数字标点 / center rule / 中间条 / 数据底栏数字。
【内容纪律】
@keyframes, prefers-reduced-motion 下全部停在终态 (静态成图)。