svg-graphics 是一份围绕 SVG 图形制作的技能资料，定位为可缩放、可访问、可随主题切换的视觉内容。
用途：用于制作横幅、图标、徽章、文档插图等 SVG 视觉素材，并兼顾深色/浅色主题与无障碍。
主要能力：
- 基础技术：viewBox 响应式缩放、defs 与 use 复用组件、linearGradient 渐变背景、clipPath 形状容器、CSS 变量主题切换。
- 主题适配：通过 @media (prefers-color-scheme: dark/light) 切换填充色。
- 图标尺寸建议：16x16 用于 favicon 与小 UI，32x32 用于标签页与列表，128x128 用于应用图标，512x512 用于商店列表。
- SMIL 动画：支持延迟淡入与错峰入场，关键属性包括 begin、dur、fill、repeatCount；错峰模式为每个元素 begin 递增 0.3s。
- 兼容性：Chrome/Edge、Firefox、Safari 支持完整 SMIL；GitHub README 与 npm/PyPI README 不播放动画，按静态首帧渲染，因此徽章/横幅应设初始 opacity="1" 作为回退。
- CSS 变换：用嵌套 g 分离定位与动画变换，避免同一元素混用静态定位与动画变换；缩放居中需先 translate 再 scale；脉冲效果用 animateTransform 的 values 循环。
- clipPath 三层模式：背景填充、被裁剪内容、边框描边，绘制顺序决定层级。
- 优化：SVGO 配置中不可移除 viewBox 与 title；给出图标、徽章、横幅、复杂图的体积预算，以及移除编辑器元数据、简化路径等优化收益。
- 无障碍：装饰性 SVG 加 role="img" 或 aria-hidden="true"，用 title 供屏幕阅读器读取，对比度至少 4.5:1。
- 文档插图：与 Mermaid 的取舍场景，以及插图模板与关键原则，如始终提供深浅色模式、使用语义类名、用 text-anchor="middle" 居中、用 g transform 分组、保持 viewBox 比例一致。
- 写实主体绘制：强调先画轮廓路径、用 path 贝塞尔曲线而非基本图形、通过眯眼测试、先定比例再加细节、正确计算肢体数量，并给出狗、猫、鸟、鱼、人、马、兔的特征区分表与配色建议。
使用方式：资料以模板与代码片段形式给出，可直接参考其中的 SVG 结构、样式与动画写法。
限制：资料未提供安装命令、收费方式、平台支持范围或具体工具版本；README 等非动画环境不播放 SMIL 动画。