{ "id": "design:bullets-three-levels", "schemaVersion": 2, "title": { "ja": "箇条書き 3 階層 — 階層ごとに記号と級数を変える本文の 1 枚", "en": "Three-Level Bullets — Each Level Gets Its Own Mark and Size" }, "summary": { "ja": "見出しのあとに 3 階層の箇条書き。記号・級数・色を階層ごとに 1 段ずつ落とし、字下げは固定の段で揃える", "en": "A title over bullets three levels deep: mark, size and colour step down one notch per level, indents on a fixed grid" }, "capturedAt": "2026-10-19", "categories": [ "presentation" ], "tags": [ "minimal", "typography" ], "useCases": [ "summary" ], "format": "slide-16x9", "density": "medium", "layout": { "kind": "stack", "canvas": { "w": 1920, "h": 1080 }, "margin": { "top": 96, "right": 140, "bottom": 96, "left": 140 } }, "type": { "kicker": { "size": 20, "weight": 500, "tracking": "0.16em" }, "title": { "size": 52, "weight": 700, "leading": 1.35 }, "t1": { "size": 32, "weight": 700, "leading": 1.5 }, "t2": { "size": 26, "weight": 400, "leading": 1.6 }, "t3": { "size": 22, "weight": 400, "leading": 1.6 }, "folio": { "size": 16, "weight": 400, "numeric": "tabular" } }, "colors": { "ground": "#FFFFFF", "surface": "#F4F6F9", "ink": "#131820", "muted": "#667183", "accent": "#1F5FA8", "rule": "#DBE1E9", "series": [] }, "rules": [ { "ja": "階層は 3 段まで。4 段目が要るなら、その枝は別の 1 枚に分ける", "en": "Three levels at most — if a fourth is needed, that branch becomes its own slide" }, { "ja": "記号・級数・色を階層ごとに変える。どれか 1 つだけだと、離れて見たとき階層が読めない", "en": "Change mark, size and colour per level — with only one of them, the hierarchy disappears from the back of the room" }, { "ja": "字下げは記号の幅ではなく固定の段（48px）で揃える。記号を差し替えても本文の左端が動かない", "en": "Indent on a fixed step (48px), not the width of the mark, so swapping marks never moves the text edge" }, { "ja": "1 階層目は 4 項目まで。数字は 3 階層目に置き、太字で拾わせる", "en": "Four first-level items at most; figures live on the third level, picked out in bold" } ], "cover": "https://design-vault.pages.dev/_astro/cover.PGJTymOe.png", "assets": [], "shortlist": false, "status": "published", "relations": { "similar": [ "key-message-three-supports", "recap-key-takeaways", "agenda-numbered-sections" ] }, "license": "Original", "publishedAt": null, "reproduction": { "spec": { "format": "slide-16x9", "density": "medium", "layout": { "kind": "stack", "canvas": { "w": 1920, "h": 1080 }, "margin": { "top": 96, "right": 140, "bottom": 96, "left": 140 } }, "type": { "kicker": { "size": 20, "weight": 500, "tracking": "0.16em" }, "title": { "size": 52, "weight": 700, "leading": 1.35 }, "t1": { "size": 32, "weight": 700, "leading": 1.5 }, "t2": { "size": 26, "weight": 400, "leading": 1.6 }, "t3": { "size": 22, "weight": 400, "leading": 1.6 }, "folio": { "size": 16, "weight": 400, "numeric": "tabular" } }, "colors": { "ground": "#FFFFFF", "surface": "#F4F6F9", "ink": "#131820", "muted": "#667183", "accent": "#1F5FA8", "rule": "#DBE1E9" }, "rules": [ "Three levels at most — if a fourth is needed, that branch becomes its own slide", "Change mark, size and colour per level — with only one of them, the hierarchy disappears from the back of the room", "Indent on a fixed step (48px), not the width of the mark, so swapping marks never moves the text edge", "Four first-level items at most; figures live on the third level, picked out in bold" ] }, "prompt": { "ja": "以下の仕様でスライドを 1 枚作ってください。\n\n- 版面 1920 × 1080\n- 余白 上 96 右 140 下 96 左 140\n\n## 文字（版面 1920px に対する px）\nkicker 20px / 500 / 字間 0.16em\ntitle 52px / 700 / 行送り 1.35\nt1 32px / 700 / 行送り 1.5\nt2 26px / 400 / 行送り 1.6\nt3 22px / 400 / 行送り 1.6\nfolio 16px / 400 / 等幅数字\n\n## 配色\n地 #FFFFFF / 面 #F4F6F9 / 文字 #131820 / 補助 #667183 / 強調 #1F5FA8 / 罫 #DBE1E9\n\n## 外すと崩れる点\n- 階層は 3 段まで。4 段目が要るなら、その枝は別の 1 枚に分ける\n- 記号・級数・色を階層ごとに変える。どれか 1 つだけだと、離れて見たとき階層が読めない\n- 字下げは記号の幅ではなく固定の段（48px）で揃える。記号を差し替えても本文の左端が動かない\n- 1 階層目は 4 項目まで。数字は 3 階層目に置き、太字で拾わせる\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/bullets-three-levels/pattern.html", "en": "Produce one slide to the following specification.\n\n- Canvas 1920 × 1080\n- Margin top 96 right 140 bottom 96 left 140\n\n## Type (px against a 1920px canvas)\nkicker 20px / 500 / tracking 0.16em\ntitle 52px / 700 / leading 1.35\nt1 32px / 700 / leading 1.5\nt2 26px / 400 / leading 1.6\nt3 22px / 400 / leading 1.6\nfolio 16px / 400 / tabular numerals\n\n## Colour\nGround #FFFFFF / Surface #F4F6F9 / Ink #131820 / Muted #667183 / Accent #1F5FA8 / Rule #DBE1E9\n\n## Constraints — dropping these breaks it\n- Three levels at most — if a fourth is needed, that branch becomes its own slide\n- Change mark, size and colour per level — with only one of them, the hierarchy disappears from the back of the room\n- Indent on a fixed step (48px), not the width of the mark, so swapping marks never moves the text edge\n- Four first-level items at most; figures live on the third level, picked out in bold\n\nReplace the content with [your content]. Keep the measurements and colours as given.\nFor an exact reproduction, use the verbatim HTML at https://design-vault.pages.dev/designs/bullets-three-levels/pattern.html." }, "code": { "html": "\n\n箇条書き 3 階層 — 階層ごとに記号と級数を変える本文の 1 枚\n\n\n\n\n
\n
\n
\n

1. なぜ窓口を 1 つにするのか

\n

今の 4 窓口では、聞く人も答える人も迷っている

\n
\n\n \n\n
問い合わせ窓口の一本化 ／ 社内説明会02 / 10
\n
\n
\n", "url": "https://design-vault.pages.dev/designs/bullets-three-levels/pattern.html", "fonts": [ "https://design-vault.pages.dev/designs/bullets-three-levels/font.css", "https://design-vault.pages.dev/designs/bullets-three-levels/font-0.woff2", "https://design-vault.pages.dev/designs/bullets-three-levels/font-1.woff2", "https://design-vault.pages.dev/designs/bullets-three-levels/font-2.woff2" ] } }, "urls": { "ja": "https://design-vault.pages.dev/designs/bullets-three-levels", "en": "https://design-vault.pages.dev/en/designs/bullets-three-levels", "json": "https://design-vault.pages.dev/ai/assets/bullets-three-levels.json", "designJson": "https://design-vault.pages.dev/ai/designs/bullets-three-levels.json" }, "notesMarkdown": "## この構成について / About this pattern\n\n出典を持たない自作パターン。**`pattern.html` が版そのもの**で、`cover.png` と frontmatter の\n`layout` / `type` / `colors` はどちらもそこから機械的に測った結果。一式「基本の 10 枚」の 1 枚で、\n配色は system-project 一式の淡地・濃地と同じ 2 組に揃えてある。\n\nA self-authored pattern. `pattern.html` is the artboard itself; both `cover.png` and the\nmeasurements in the frontmatter are derived from it. One of the ten basic slides, drawn in the\nsame two palettes as the system-project deck so the two can be mixed.\n\n### Techniques\n\n- 1 階層目は塗りの四角、2 階層目は線、3 階層目は白抜きの丸\n- 3 階層目は灰色にして、中の数字だけを本文色の太字に戻す\n- 見出しは結論の文にする。題目だけだと、箇条書きが何の根拠か分からない\n\n### Apply to\n\n- 説明資料の本文。資料の中でいちばん多い 1 枚\n- 課題の整理（1 階層目を立場、2 階層目を事象、3 階層目を数字にする）", "slug": "bullets-three-levels", "kind": "artboard", "catalogVersion": 1, "designSchemaVersion": 2, "capabilities": [ "view-artboard", "read-spec", "copy-prompt", "get-code" ], "reusePolicy": "construction-reuse" }