图片是演示中最常见的视觉元素。玄武屏支持 6 种主流格式 + 在线裁剪 / 滤镜 / 蒙版。

支持格式

格式	适用	限制
JPG / JPEG	照片、连续色	单图 ≤ 20MB
PNG	透明背景、图标、UI 截图	单图 ≤ 20MB
GIF	动图	单图 ≤ 30MB，> 5MB 警告性能
WebP	高压缩，新一代	推荐使用
SVG	矢量图标、可缩放图形	不支持脚本 (script tag 会被清理)
AVIF	极高压缩比	实验，部分浏览器降级

上传途径

1. 本地上传：左侧面板 → 拖入文件
2. 粘贴：截图 / 复制图片 → ⌘+V 直接粘贴到画布
3. 平台素材库：左侧面板 →「素材」→ 搜索关键字
4. AI 生成：「插入 → AI 图像」→ 输入 Prompt → 生成（计费）
5. 链接引用：右键画布 →「插入 URL 图片」→ 粘贴外链

图片裁剪

双击图片元素进入"裁剪模式"：

• 拖动边角调整裁剪框
• 按 Shift 锁定纵横比
• 按 Esc 退出，画布上只显示裁剪后的部分
• 原图保留，可随时恢复

滤镜与调整

右侧属性面板 →「图像调整」：

亮度 / 对比度 / 饱和度
模糊（高斯模糊 0–20px）
锐化
反相 / 灰度 / 棕褐色
预设滤镜：极简 / 复古 / 黑白 / 高饱和

蒙版与形状

把图片裁成异形：

• 圆形：头像 / 图标常用
• 圆角矩形：UI 截图常用
• 自定义路径：用形状元素当蒙版

操作：选中图片 → 工具条 → 「蒙版」→ 选形状。

图片动画

图片专属动画：

• Ken Burns 效果：缓慢推拉镜头（适合照片墙）
• 左右扫光：高亮闪过
• 马赛克消解：碎块出现 / 消失
• 聚焦放大：点击后局部放大

SVG 的特殊能力

SVG 是矢量，玄武屏支持：

• 着色：右侧面板 → 「填充色」覆盖原 SVG 颜色
• 路径动画：描边按路径绘制（适合图标演示）
• 变形动画：从一个 SVG 形状渐变到另一个

性能建议

单页图片数	建议
< 5	任意尺寸
5–20	总大小 < 20MB
> 20	用图片网格组件、按需懒加载

GIF 单图 > 5MB 时考虑改 WebM 或 MP4 视频。

版权与授权

平台素材库的图片：

• 免费区：CC0 协议，商用免费
• VIP 区：购买 VIP 后可商用
• 自上传图片：用户自行确保版权

详见「78. 水印 / 版权 / 内容保护」。

下一节讲视频元素。