叮卡
GitHub 在线使用

开源 · 内置 MCP 服务器

长文自动排成卡片，海报随手自由排版。

浏览器里的图文卡片编辑器。AI 客户端通过 MCP 使用同一套文档模型、校验和导出，生成的作品可以直接在编辑器里接着改。

在线使用 查看源码
套模板
51
个 MCP 工具
22
种预设尺寸
8
开源许可
MIT

自由画布

选中任意元素，就地修改。

文字、图片、形状、线段、图标、图表、表格、时间线和二维码放在同一块画布上。图层可以编组、隐藏和锁定，多页作品的每一页可以设不同尺寸。

叮卡自由画布：音乐节海报的标题被选中，上方工具栏显示字体 Archivo Black、字号 132、对齐、不透明度、位置和层级
种花字
16
个线性图标
97
个装饰素材
48
个滤镜预设
8

导出PNGJPGPDFZIP长图

Markdown 长文

一篇长文，按卡片尺寸自动分页。

小红书、微博、推特三种尺寸。用 --- 手动分页；标题不会单独落在页底。

《在城市里慢慢走》第 1 页 第 2 页 第 3 页 第 4 页 第 5 页

《在城市里慢慢走》 · 732 字 · 5 页 · 专栏版式

叮卡 Markdown 工作台：左侧是源文，中间的版式面板把当前文章的第一页按每种版式排出，右侧是分页预览
版式面板把当前文章的第一页按每种版式排出来，点一下就换。

九套长文版式

每套有自己的页眉、页码、标题层级、引文、列表、待办、代码和表格样式，正文一个字不动就能换。

专栏版式第 1 页 备忘录版式第 1 页 信笺版式第 1 页 夜读版式第 1 页 极光版式第 1 页 文档版式第 1 页 宣纸版式第 1 页 瑞士版式第 1 页 手账版式第 1 页

模板

51套模板
Markdown 版式
9
三页套图
6
单页模板
36
音乐节模板
音乐节9:16
杂志封面模板
杂志封面3:4
年度汉字模板
年度汉字9:16
旅行明信片模板
旅行明信片3:4
新品预告模板
新品预告9:16
甜品菜单模板
甜品菜单A4
设计周模板
设计周9:16
播客封面模板
播客封面1:1
展览海报模板
展览海报9:16
书单模板
书单3:4
节日模板
节日9:16
秋日市集模板
秋日市集3:4
节气模板
节气9:16
价目表模板
价目表9:16
婚礼请柬模板
婚礼请柬9:16
数据盘点模板
数据盘点9:16

三页套图

封面、内页、结尾各一页。MCP 生成整套卡片时，还会按每页的内容换成观点页、清单页、数据页或收尾页。

编辑部套图封面编辑部套图内页编辑部套图结尾
编辑部3 页 · 3:4
信号套图封面信号套图内页信号套图结尾
信号3 页 · 3:4
夜航套图封面夜航套图内页夜航套图结尾
夜航3 页 · 3:4
粗野套图封面粗野套图内页粗野套图结尾
粗野3 页 · 3:4
蓝图套图封面蓝图套图内页蓝图套图结尾
蓝图3 页 · 3:4
清单套图封面清单套图内页清单套图结尾
清单3 页 · 3:4
叮卡模板中心：选中「活动海报」分类，列出展览海报、设计周、音乐节、讲座、新品预告等 8 套模板

模板中心

按名称、标签、用途和风格搜索，再按尺寸、风格、颜色和收藏筛选。点开先看每一页和相似模板。

  • 长文卡片
  • 图文套图
  • 社交配图
  • 活动海报
  • 营销电商
  • 菜单价目
  • 节日节气
  • 邀请贺卡
  • 办公学习

模板在仓库里维护，按贡献模板提交 Pull Request。

MCP

AI 客户端，直接出整套卡片。

dingcard-mcp 提供 22 个工具。文档校验、编辑和渲染与编辑器共用同一套代码。

  1. list_templates({ kind: "deck" })

    模板的尺寸、用途、风格和能放多少内容

  2. create_document_from_content({ templateId, content })

    按内容生成整套卡片，示例文字全部替换

  3. check_document({ documentId, fix: true })

    按导出效果检查，放不下的字自动缩小

  4. render_document({ documentId, format: "png" })

    逐页 PNG、JPG、PDF、长图或九宫格切图

  5. open_in_editor({ documentId })

    在叮卡编辑器中打开，由人继续修改

山月 · 藍染海報：渐变夜空、月晕、三层山脊和湖面波纹，全部由形状和线段构成 山月海报的构造页：月晕的同心椭圆、三层山脊、波纹线段的控点和渐变色谱
山月 · 藍染海報

由 MCP 绘制 · 54 个形状 · 46 条线段 · 5 段文字 · 0 张图片

check_document 检查项

  • text-overflow
  • text-overlap
  • covered-text
  • off-page
  • low-contrast
  • sample-text
  • empty-text
  • image-failed
  • path-overflow
  • empty-path
  • tiny-qrcode
  • low-contrast-qrcode
  • progress-label-overflow
  • data-clipped
  • tiny-text
  • misalignment
  • edge-margin
  • too-many-fonts
  • too-many-colors
  • weak-heading
  • empty-band
  • empty-frame

以 stdio 启动

# 在仓库根目录
npm --prefix mcp ci
npm run mcp

客户端接入配置、环境变量和安全边界见 MCP 文档。

部署

在线使用，或部署到自己的服务器。

在线版

不需要账号。作品自动保存在当前浏览器里，重要作品记得导出。

dingcard.vercel.app →

Docker

Fastify + SQLite 后端：账号、跨设备同步、服务端图片和分享链接。镜像支持 amd64 与 arm64。

docker pull ghcr.io/lottshin/dingcard:0.56.0

源码

React、TypeScript、Vite。需要 Node.js 22 及以上，本地运行不需要后端。

npm ci
npm run dev

不注册，直接开始。

打开就能用，作品自动保存在这台设备上。

在线使用 查看源码