PaperStudio 

如果你需要定制一张带水印的商务信纸、一份传统方格稿纸，或一份手写风格的作业纸，但又不想打开复杂的设计软件（如 Illustrator 或 InDesign），那么 PaperStudio 可能正是你需要的工具。

这是一个纯静态 Web 应用，无需安装、无需联网、无需注册——双击 HTML 文件即可使用。所有操作在浏览器中完成，支持导出 PDF 或直接打印，真正实现“所见即所得”。

核心功能：为书写而生

1. 灵活纸张与网格

• 支持 A4、A3、B5、16开 等标准尺寸，也可自定义宽高
• 一键生成：
  • 横线稿纸（可调行距、线宽、颜色、虚线）
  • 方格稿纸（正方形/长方形网格）
  • 首尾行双线（传统信笺样式）

2. 直观绘图与排版

• 文字编辑：
  • 内置思源宋体（Source Han Serif CN）等中文字体
  • 支持字号、加粗、斜体、下划线、字间距、行高精细调节
• 矢量图形：
  • 矩形、圆形、三角形、五角星
  • 智能矩形：可设圆角或斜切角
• 图片处理：
  • 上传 Logo 或水印图，一键设为背景（半透明叠加）

3. 专业级编辑体验

• 图层管理：锁定、隐藏、重排序，避免误操作
• 对齐与分布：多元素左/中/右对齐，水平/垂直均匀分布
• 完整历史记录：Ctrl+Z / Ctrl+Y 无限制撤销重做

存储与输出

• 保存项目：导出为 .paper 文件，后续可重新编辑
• 高清导出：生成 PNG/JPG 图片或 可打印 PDF
• 直接打印：自动适配纸张尺寸，保留边距与裁剪标记

快速开始（无需任何配置）

1. 下载项目（含完整静态资源）
2. 双击 xfz.html 即可运行（推荐使用 Chrome / Edge）
3. 推荐开发体验：在 VS Code 中使用 Live Server 插件，支持热重载

目录结构说明：

PaperStudio/
├── xfz.html               # 主入口
└── static/
    ├── fabric.min.js      # Canvas 交互核心
    ├── tailwindcss.js     # UI 样式
    ├── jspdf.umd.min.js   # PDF 导出
    ├── SourceHanSerifCN-Bold.ttf  # 中文字体
    └── ...                # 其他依赖（图标、快捷键、提示等）

高效快捷键

技术栈（轻量而强大）

• Fabric.js：处理 Canvas 上所有图形交互（拖拽、缩放、旋转）
• Tailwind CSS：快速构建响应式 UI
• jsPDF：将画布内容导出为标准 PDF
• 纯静态架构：无后端、无数据库、无网络请求，100% 本地运行

适用场景

• 教师：制作标准化作业纸、作文稿纸
• 设计师：快速输出带品牌水印的信纸模板
• 学生：定制练字格、笔记纸
• 文秘/行政：生成公司抬头信笺
• 开源爱好者：学习 Fabric.js + 静态 Web 应用开发范式