designmark

designmark

面向 AI 编码 Agent 的日式落地页设计系统（DESIGN.md）——在 designmark.jp 搜索，并通过终端、任意 MCP 客户端或 Claude Code 将其添加到项目中。

日本語 · designmark.jp · GitHub 上的样式包

designmark.jp 发布从 4,000 多个日本公开落地页中分析得出的 DESIGN.md 文件，涵盖颜色、排版、间距、组件和版块结构；此外，还提供按行业和风格合成的 CC BY 4.0 样式包。将其交给 Claude Code、Cursor 或其他 AI 编码工具，即可按相应风格构建页面。

npx designmark search 化粧品 --mood elegant
npx designmark add <ID> --claude-md

add 会将 DESIGN.md 保存到当前文件夹；--claude-md 还会将 @DESIGN.md 这一行添加到 CLAUDE.md，以便 Claude Code 读取。需要 Node.js 20 或更高版本。

CLI

命令	功能
search [words...]	搜索落地页设计和样式包。每个词都必须匹配。
show <ID>	标题、风格、行业、氛围、颜色（角色和 HEX）及页面 URL。--raw 会输出完整的 DESIGN.md。
add <ID...>	保存最多 3 个设计：单个设计保存为 DESIGN.md，两个或三个则保存为 design/<ID>.md。
packs	按行业列出样式包。
open <ID>	打开 designmark.jp 上的设计页面。
mcp	启动 MCP 服务（stdio）。

ID 格式为 xd-xxxxxxxx（落地页设计）、pk-…（样式包）或 designmark.jp URL。每个命令都接受 --json、--lang ja|en 和 --help。输出为纯文本（无颜色）。

search 选项
--category <name|slug>	行业，例如 cosmetics 或 化粧品
--mood <name|slug>	氛围，可重复指定（必须全部匹配）：natural soft elegant minimal pop retro cute sporty cool dark-luxury trust handmade wafu fresh bold dense
--color <family>	主色：red orange yellow green teal blue purple pink brown black gray white，或日文名称，例如 青（仅限落地页设计）
--view sp|pc	分析视图（仅限落地页设计）
--packs-only / --lp-only	仅显示样式包 / 仅显示落地页设计
--limit <1-50>	结果数量（默认 10；最多先显示 3 个样式包）

add 选项
--dir <folder>	项目文件夹（默认：当前文件夹）
--out <file>	要写入的文件（单个 ID 时，默认 DESIGN.md）
--force	覆盖现有文件（否则绝不覆盖）
--claude-md	将 @<written file> 添加到 CLAUDE.md（无论运行多少次，只添加一次）

npx designmark search クリニック --view sp --limit 5
npx designmark search --category cosmetics --mood elegant --mood soft --json
npx designmark packs --category cosmetics
npx designmark show pk-cosmetics-elegant
npx designmark add pk-cosmetics-elegant --claude-md
npx designmark add <ID> --out docs/DESIGN.md

要将设计保存到文件，请使用 add（若要保存到其他路径，请配合 --out），而不要重定向 show --raw：add 会原样写入字节，而 Windows PowerShell 5.1 会对重定向的输出重新编码。

退出代码	含义
0	成功
1	失败（无法写入文件，或发生意外的网络错误）
2	用法错误（未知选项、无效 ID、ID 超过 3 个，……）
3	未找到：该设计不在最新索引中（已撤下或 ID 错误）
4	暂时不可用（访问可能受限）：请等待约 5 分钟

环境变量
DESIGNMARK_LANG	ja 或 en（--lang 优先）。若两者都未指定：依次使用 LC_ALL / LC_MESSAGES / LANG，然后使用系统区域设置
DESIGNMARK_CACHE_DIR	索引缓存文件夹。默认值：Windows 上为 %LOCALAPPDATA%\designmark，其他系统上为 $XDG_CACHE_HOME/designmark 或 ~/.cache/designmark
DESIGNMARK_API	API 的基础 URL（默认 https://designmark.jp；用于测试）
BROWSER=none	open 会打印 URL，而不是打开浏览器

MCP 服务

Claude Code：

claude mcp add designmark -- npx -y designmark@1 mcp

Cursor（.cursor/mcp.json）：

{ "mcpServers": { "designmark": { "command": "npx", "args": ["-y", "designmark@1", "mcp"] } } }

designmark@1 会将版本锁定在主版本 1。如果你的 MCP 客户端无法在原生 Windows 上启动 npx，请使用 cmd，并传入参数 /c npx -y designmark@1 mcp。

工具	输入	返回内容
search_designs	query、category、moods、color、view、include_packs（默认值为 true）、limit（1–20，默认值为 10）	每个设计占一行：ID、标题、行业、情绪风格、主色、页面 URL
get_design	id（xd-… 或 URL）	使用须知、空行，然后是完整的 DESIGN.md
list_packs	category	每个模式包占一行：ID、标题、源设计数量
get_pack	id（pk-… 或 URL）	许可证和署名示例、空行，然后是完整的 DESIGN.md

服务不会写入文件；由你的 Agent 保存 DESIGN.md。消息使用 DESIGNMARK_LANG（或系统区域设置）对应的语言。

Claude Code 插件

/plugin marketplace add xecin-inc/designmark
/plugin install designmark@designmark

该插件包含 designmark 技能——你可以让 Claude Code 制作日式落地页，它会选择一个行业和情绪风格，向你展示最多 3 个候选方案，添加你选中的方案，并使用其中的设计令牌进行构建——以及上文提到的 MCP 服务。

速率限制——以及原因

designmark 的使用条款（第 2 条第 3 款）禁止自动批量抓取。本工具的设计充分遵守了这一规定：

• add 每次运行最多抓取 3 个设计，每次抓取 1 个，且间隔至少 1 秒。没有批量下载命令。
• MCP 服务每个进程每 10 分钟最多抓取 30 个设计，每次抓取间隔至少 1 秒；如果 designmark.jp 拒绝请求，则会停止抓取 5 分钟。
• 搜索会读取一个索引文件，该文件缓存 6 小时，之后使用 ETag 重新验证。DESIGN.md 文件不会被缓存，因此已撤下的设计会很快消失。
• 已撤下的设计会以退出代码 3 结束。退出代码 4 表示 designmark.jp 可能正在限制你的访问：请等待约 5 分钟，不要循环重试其他 ID。

如果你派生了本工具，请保留这些限制，也不要镜像 designmark.jp 或将其中的 LP 设计作为数据集重新分发。未遵守这些限制的客户端可能会被屏蔽。

关于数据

• LP 设计（xd-…）是对日本公开落地页的非官方分析；designmark 与这些页面背后的公司没有关联。切勿重用原始页面中的标志、照片、文案或产品名称——请使用你自己的素材。
• 模式包（pk-…）综合多个设计合成而成，不描述任何单一页面。它们采用 CC BY 4.0 许可；署名示例：“designmark (XECIN Inc.)”。可在 designmark.jp 或模式包合集中浏览。
• 原始页面的权利人可通过下架表单申请移除内容。

隐私

不收集遥测数据。本工具仅与 https://designmark.jp 通信，并使用 designmark-cli/<version> 或 designmark-mcp/<version> User-Agent。与任何网站一样，designmark.jp 可能会记录请求的 IP 地址。

开发

npm ci
npm run lint
npm run typecheck
npm test     # a local fixture server stands in for designmark.jp
npm run build

推送 v* 标签时，GitHub Actions 会将版本发布到 npm（使用来源证明的可信发布）。

designmark 由 XECIN Inc. 制作。如需获取使用 AI 构建落地页或制作自己的 DESIGN.md 的帮助，请参阅咨询服务。

欢迎提交问题和拉取请求——请参阅 CONTRIBUTING.md。如需报告安全问题，请按照 SECURITY.md 中的说明私下提交。变更记录请见 CHANGELOG.md。

许可证

本仓库中的代码根据 MIT 许可证 授权 © 2026 XECIN Inc.。designmark.jp 上的设计受 designmark 使用条款约束；图案包采用 CC BY 4.0 许可。