← 全部模板

照片封面 <PhotoCover />

一张图铺满整页,暗角加左下渐变压暗,白色大标题、副题和一行元信息放在左下。图片缓慢推近。

在示例演示里查看 →

分组
开场 · 用一张图定调
组件
PhotoCover · #photo-cover

适合

  • 有一张能代表主题的氛围图:风景、场景、物件
  • 公开演讲、科普、品牌故事的第一页

不适合

  • 没有合适的图:用 Cover
  • 要在封面放数字和关键事实:用 Cover 或 NumberOpener

内容上限

1title ≤ 2 行 × 10 字
2sub ≤ 40 字
3meta 0–3 项,每项 ≤ 12 字
4image.credit ≤ 20 字
5必须配 tone: 'dark'

字段

字段类型
image · 必填{ src, alt, credit?, focus? }import 进来的 decor- 插图或截图;credit 显示在右下
kicker · 必填string小节名
title · 必填string | string[]主标题
substring副题
metastring[]底部小字:时长、场合等
sourcestring事实出处

示例代码

<PhotoCover image={{ src: reef, alt: '…', credit: '插图:AI 生成(示意)' }} kicker="海洋科普" title={['珊瑚礁:', '海里的城市']} sub="…" meta={['12 分钟']} />