Demo：预览 Base64 data URL
Base64 图片预览能检查 MIME、尺寸和内容，适合 Markdown、CSS、HTML 或 JSON 嵌入前 review。
- 先用一个小而完整的示例确认结构，再粘贴完整生产内容。
- 检查预览是否清楚展示 ownership、结构、标签和风险字段。
- 保留源码和导出结果，方便后续 reviewer 复现。
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJ...稳定渲染器无 AI本地预览调试导出
Base64 图片预览
Base64 图片预览 为开发者提供一个快速的浏览器预览闭环，适合检查 AI 生成片段、UI 片段、配置示例和文档素材。
示例
图片预览就绪
预览结果会显示在这里。
下一步可以继续
把当前预览结果带到相关工具里继续转换、排查或导出。
使用方法
- 1先粘贴一个小而聚焦的片段，确认预览结构后再替换成完整源码。
- 2先加载示例，了解分隔符或源码格式。
- 3在放进 README、Issue 或正式文档前，检查警告、视觉输出和提取结构。
- 4把源码和截图放在一起，方便团队后续复现。
常见场景
发布前检查 AI 生成的 HTML、CSS、JSON 和 Base64 素材。为技术文档、发布说明和支持回复生成轻量截图。不用在多个零散工具之间切换，就能调试可视化片段。
相关工具
常见问题
源码会发送到后端或 AI 服务吗？
不会。这批 P1 预览工具在浏览器本地完成支持路径的解析和预览。
这个预览能替代生产运行时吗？
不能。它面向常见预览和调试场景，最终仍应以浏览器、运行时或生产解析器为准。
Base64 图片预览 是 DiagramPreview 脚本和视觉源码预览工具集的一部分。
它帮助你把 AI 生成或项目中复制出的文本，快速变成团队真正能审阅的视觉输出。
适合在片段进入文档、工单、博客或生产示例之前做一次快速校验。
Base64 图片预览 Review 清单
Base64 方便但影响缓存和可读性，适合小型自包含资源。
- 分享示例前移除 secret、token、客户数据和私有基础设施值。
- 每次修改输入后，都把渲染结果和原始源码对照。
- 当预览简化复杂运行时行为时，应把假设写出来。
输入 -> 预览 -> 检查风险字段 -> 修改源码 -> 导出或分享Base64 图片预览 检查清单
当你需要在文档、PR、故障复盘或交接材料发布前检查源码内容时，可以使用 Base64 图片预览。预览 Base64 图片字符串和 data URL，并分析 MIME 类型和体积。
导出前建议检查标签是否可读、关系是否和源码一致、示例是否包含敏感信息，以及修改输入后预览是否仍然成立。
限制与排查
如果预览失败，先把输入缩小到最小完整示例，确认格式语法，再逐段加回内容。很多失败来自不完整文件、缩进错误、缺少图表头，或复制了依赖隐藏上下文的片段。
请把预览结果当作 review 界面，而不是生产事实来源。生成的图表、转换文件、看板和规则示例在进入正式文档或运维流程前仍需要人工确认。
可测试的示例输入
- Tiny PNG: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAFgwJ/lv6pWQAAAABJRU5ErkJggg==
- SVG Base64: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNDAgMTIwIj48cmVjdCB3aWR0aD0iMjQwIiBoZWlnaHQ9IjEyMCIgcng9IjE4IiBmaWxsPSIjMGYxNzJhIi...
- Raw Base64: iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFElEQVR42mP8z8BQz0AEYBxVSFUBAF1hBAX+fs40AAAAAElFTkSuQmCC
工具完成度
稳定渲染器
稳定工具
这个工具已有专用渲染或预览界面，支持常用导出，适合浏览器内反复预览、修改和发布前检查。
分级不是质量打分，而是告诉用户当前工具更适合稳定导出、深度调试、快速解析，还是 AI 辅助生成。