designmark

Japanese landing-page design systems (DESIGN.md) for AI coding agents — search designmark.jp and drop one into your project from the terminal, any MCP client, or Claude Code.

日本語 · designmark.jp · Pattern packs on GitHub

designmark.jp publishes DESIGN.md files analysed from more than 4,000 public Japanese landing pages — colors, typography, spacing, components and section structure — plus CC BY 4.0 pattern packs synthesised per industry and mood. Hand one to Claude Code, Cursor or another AI coding tool and it builds pages in that look.

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

add saves DESIGN.md in the current folder; --claude-md also adds the line @DESIGN.md to CLAUDE.md so that Claude Code reads it. Requires Node.js 20 or later.

CLI

Command	What it does
search [words...]	Search LP designs and pattern packs. Every word must match.
show <ID>	Title, style, industry, moods, colors (role and HEX) and page URL. --raw prints the whole DESIGN.md.
add <ID...>	Save up to 3 designs: DESIGN.md for one, design/<ID>.md for two or three.
packs	List the pattern packs by industry.
open <ID>	Open the design's page on designmark.jp.
mcp	Start the MCP server (stdio).

IDs are xd-xxxxxxxx (LP design), pk-… (pattern pack) or a designmark.jp URL. Every command accepts --json, --lang ja|en and --help. Output is plain text (no colors).

search option
--category <name|slug>	Industry, e.g. cosmetics or 化粧品
--mood <name|slug>	Mood, repeatable (all must match): natural soft elegant minimal pop retro cute sporty cool dark-luxury trust handmade wafu fresh bold dense
--color <family>	Main color: red orange yellow green teal blue purple pink brown black gray white, or a Japanese name such as 青 (LP designs only)
--view sp|pc	Analysed view (LP designs only)
--packs-only / --lp-only	Only pattern packs / only LP designs
--limit <1-50>	Number of results (default 10; up to 3 pattern packs come first)

add option
--dir <folder>	Project folder (default: the current folder)
--out <file>	File to write, for a single ID (default DESIGN.md)
--force	Overwrite existing files (never overwritten otherwise)
--claude-md	Add @<written file> to CLAUDE.md (only once, however often you run it)

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

To save a design to a file, use add (with --out for another path) rather than redirecting show --raw: add writes the bytes unchanged, while Windows PowerShell 5.1 re-encodes redirected output.

Exit code	Meaning
0	Success
1	Failure (a file could not be written, or an unexpected network error)
2	Usage error (unknown option, invalid ID, more than 3 IDs, …)
3	Not found: the design is not in the latest index (withdrawn, or a wrong ID)
4	Temporarily unavailable (access may be limited): wait about 5 minutes

Environment variable
DESIGNMARK_LANG	ja or en (--lang takes precedence). Without either: LC_ALL / LC_MESSAGES / LANG, then the system locale
DESIGNMARK_CACHE_DIR	Index cache folder. Default: %LOCALAPPDATA%\designmark on Wi

... View full README on GitHub