字体子集化与预览页生成工具
目标：做一个纯前端在线工具，让用户上传 TTF/OTF/WOFF/WOFF2，选择字符集并生成子集字体与可直接打开的预览页面。
中文 Prompt:
你是资深前端工程师，请生成一个可部署的在线工具项目：字体子集化与预览页生成器。要求：
1) 技术栈：Vite + Type + React（或 Vue3 也可，但必须给出可运行命令），全部在浏览器端运行，不依赖后端。
2) 功能：上传字体文件（TTF/OTF/WOFF/WOFF2），输入或选择字符集（支持：自定义输入、常用汉字集合、ASCII、数字、标点），生成子集字体（优先 WOFF2）并展示前后体积对比。
3) 预览：可输入示例文本，实时切换字号/字重（如可用）、行高、背景色；提供多段示例（中文/英文/数字）。
4) 一键输出HTML（硬要求）：提供“导出交付包”按钮，一键生成 zip 包，包含 index.html、styles.css、子集字体文件（woff2）、以及一个可直接双击打开的离线预览页；同时在界面中提供“导出单文件HTML”选项：把必要的 CSS 与字体用 64 data: URL 内联，生成一个单个 HTML 文件（无需其他文件即可离线打开）。
5) 交付物输出：在你的回答中必须给出完整文件树，并贴出关键源码（至少 index.html、main.tsx、核心子集化逻辑、导出逻辑、UI 组件）。另外必须在回答里直接给出最终生成的 index.html 完整内容示例（作为可用的 HTML 交付物）。
6) 运行命令：写清楚安装、开发、构建与本地预览命令。
7) 部署：写清楚部署到静态站点（如 Nginx / GitHub Pages / Netlify）的步骤。
8) QA 清单：至少 8 条，包括：大文件处理、不同浏览器兼容、中文字符集正确性、导出 zip 可用性、单文件 HTML 打开正常、字体渲染一致性、错误提示、内存占用。
9) 体验：进度条与取消按钮；失败时给出可读错误信息。
注意：Prompt 全文使用中文，不要要求用户手动写代码，直接输出可运行项目。
中文释义：让 AI 直接产出一个浏览器端字体子集化工具，既能生成多文件交付包，也能导出单文件 HTML，适合字体试用与网页嵌入的快速交付。
@font-face 代码片段与样式模板生成器
目标：把上传的字体转换成可直接复制到项目里的 CSS 与示例页面，减少手写与出错。
中文 Prompt:
请生成一个在线工具项目：@font-face 代码片段与样式模板生成器。要求：
- 前端单页应用，浏览器端完成所有处理。
- 用户上传字体文件后，工具自动识别并生成：@font-face CSS 片段（含 font-family 命名建议、src 多格式回退、font-display），并提供示例 HTML（展示标题、正文、按钮等组件）。
- 支持导出：一键生成包含 index.html + fonts/ + styles.css 的最小可运行包；并额外支持导出“单文件 HTML”（字体内联为 data:）。
- 必须输出完整文件树、源码、运行/构建/部署说明，以及至少 6 条测试用例或 QA checklist。
- 必须在回答中直接贴出可用的 index.html 完整内容。
中文释义：让 AI 输出一个生成字体嵌入代码与演示页的在线工具，强调可直接交付的 HTML 与一键导出。
字体对比预览与字形覆盖检测工具
目标：对比两份字体的渲染差异并检查是否缺字，输出可交付的对比报告页面。
中文 Prompt:
生成一个可部署的在线工具：字体对比预览与字形覆盖检测。要求：
1) 上传两份字体（A/B），输入一段文本与一组字符清单。
2) 工具输出：A/B 渲染对比（并排、叠加、差异高亮可选），并统计缺失字符（在字体中无对应字形）列表。
3) 生成报告：点击“一键导出 HTML 报告”，输出单个可离线打开的 HTML（内联必要资源）；另提供 zip 交付包模式。
4) 输出物：完整项目代码、文件树、命令、部署说明、至少 8 条 QA。
5) 在回答中直接贴出导出的 HTML 报告模板（完整 HTML）。
全程中文输出。
中文释义：让 AI 生成一个字体对比与缺字检测工具，并能一键导出可交付的 HTML 报告。
字体文件信息解析与命名规范化工具
目标：解析字体元数据（家族名、版本、字重等），并生成统一命名与打包方案，减少团队协作混乱。
中文 Prompt:
请输出一个在线工具项目：字体文件信息解析与命名规范化。要求：
- 上传字体后解析出 name table 等元信息，展示：Family/Subfamily、Post 名、版本号、版权信息、字重/斜体。
- 提供命名方案：根据规则生成建议文件名（如 Family-WeightStyle.woff2）与 CSS 命名（font-family 与 font-weight）。
- 一键导出：生成 index.html（报告页）+ styles.css + 字体文件的 zip 包；并支持导出单文件 HTML 报告。
- 输出：文件树、源码、命令、部署、至少 6 条 QA。
- 回答里直接给出可用的 index.html 完整内容。
中文释义：让 AI 生成一个“字体信息与命名”在线工具，输出可交付的 HTML 报告与打包文件。
字体子集化字符集管理与模板库工具
目标：内置常用字符模板（如常用汉字、企业品牌词、UI常用符号），一键复用并导出交付。
中文 Prompt:
请生成一个在线工具：字体子集化字符集管理与模板库。要求：
- 提供字符集模板库：ASCII、数字、常用标点、常用汉字（可分级）、自定义短语库；支持保存/导入/导出模板（JSON）。
- 选择模板后对上传字体执行子集化，生成 woff2，并生成预览页。
- 一键输出 HTML：导出 zip（index.html + fonts/ + templates.json + README）；另支持导出单文件 HTML（内联字体）。
- 输出必须包含：完整项目代码、文件树、运行/构建命令、部署说明、至少 8 条 QA。
- 在回答中贴出 index.html 完整内容。
中文输出。
中文释义：让 AI 生成一个带字符集模板管理的字体子集化工具，强调可复用与一键导出交付 HTML。
字体预览样式生成与组件导出工具
目标：把字体预览配置导出成可复用的组件与样式，方便接入现有项目。
中文 Prompt:
生成一个在线工具：字体预览样式生成与组件导出。要求：
- 用户上传字体并配置预览主题（字号阶梯、行高、颜色、暗黑模式、排版间距）。
- 工具自动生成：一份可复制的 CSS 主题文件、一个 React 组件示例（或 Web Component），以及演示页。
- 一键导出：zip 交付包（index.html + styles.css + demo/组件源码 + 字体文件）；并提供单文件 HTML 导出。
- 交付物：文件树、源码、命令、部署、至少 6 条 QA。
- 回答里必须给出最终 index.html 完整内容示例。
全部中文。
中文释义：让 AI 产出一个把字体预览配置“产品化”的在线工具，交付物可直接用于预览与集成。
字体压缩与缓存策略报告生成器
目标：输出一份面向开发的优化建议与可直接打开的报告页面，帮助确定加载策略。
中文 Prompt:
请生成一个在线工具：字体压缩与缓存策略报告生成器。要求：
- 输入：字体文件（可多份）与目标站点信息（是否跨域、是否需要多语言）。
- 输出：体积对比、建议的子集化策略、font-display 建议、缓存头建议、预加载建议、回退字体建议，并给出可直接复制的 Nginx 配置片段。
- 一键导出：生成单文件 HTML 报告（内联 CSS/图表），另提供 zip 交付包。
- 输出物：完整项目、文件树、源码、命令、部署、至少 8 条 QA。
- 回答中贴出导出的 HTML 报告（完整 HTML）。
中文输出。
中文释义：让 AI 生成一个字体优化建议工具，并可导出可交付的 HTML 报告与配置片段。
字体预览文案批量生成与校对工具
目标：为设计/产品快速生成不同场景的字体预览文案，并提供拼写与符号一致性检查。
中文 Prompt:
生成一个在线工具：字体预览文案批量生成与校对。要求：
- 输入：品牌名、产品名、目标语言（中文/英文）、风格（正式/活泼/科技感等）。
- 输出：多套预览文案（标题/正文/按钮/提示语），并进行符号一致性与常见错别字提示（规则可内置）。
- 预览：可选择已上传字体应用到文案，形成预览页。
- 一键输出 HTML：导出 zip（含 index.html + 文案 JSON + 字体文件），并支持导出单文件 HTML（内联字体与文案）。
- 输出：完整项目源码、文件树、命令、部署、至少 6 条 QA。
- 回答中必须直接给出可用的 index.html 完整内容。
全中文。
中文释义：让 AI 生成一个“文案+字体预览+校对”的在线工具，输出可交付的 HTML 预览页与数据文件。
