用途:制作视频片尾或品牌闭幕的 Logo 收尾帧,通过 Logo 分块拼装、glow bloom、tagline 上浮与 CTA 完成品牌 reveal。
主要能力:画布为 1920×1080,黑色 #08090c 或品牌深色背景,配微妙 vignette 径向渐变;中心 Logo 用纯 CSS 或内联 SVG 几何绘制,由 4-8 个几何块(圆、方、三角、hairline)组成。入场时各块从屏幕外 ±100px 不同方向滑入,配合 scale 1.4→1.0、opacity 0→1,错峰 80ms,总时长 1.2s;入场完成后整体加 glow bloom(filter: drop-shadow(0 0 24px <accent>40)),并有一道 shimmer 横扫 Logo(500ms)。品牌名位于 Logo 下方 6-8%,字号 48-72px,字重 700,letter-spacing -0.02em,1.4s 开始以打字机或上浮方式入场;tagline 在品牌名下方一行,24-28px、字重 400、opacity 0.7,1.8s 淡入;底部为双行 CTA 与元数据,11px 大写、letter-spacing 0.16em、opacity 0.4,并用 hairline 分隔。
配色:四选一且不混用——Midnight Indigo(bg #08090c,accent #7c5cff)、Solar Amber(bg #0e0a08,accent #ffb547)、Forest Mint(bg #0a1410,accent #5fb38a)、Bone & Ink(bg #f1efea,accent #0a0a0b,无 neon,glow 改为阴影)。
使用方式:需提供品牌名与 tagline,否则使用 fallback “HTML Anything” / “Anything → beautiful HTML”;字体可用 Inter Tight、SF Pro Display、Manrope,中文用 Noto Sans SC 字重 700;入场用 @keyframes 加 animation-delay,可通过 prefers-reduced-motion 关闭;顶部可选 5px 品牌色 ribbon。输出为单文件 HTML,动画完成后 freeze,不循环。
限制:不得使用外链 Logo 图片,Logo 必须由纯 CSS 或内联 SVG 几何绘制。资料未提供具体安装命令、依赖与平台支持信息。