Create brand guidelines for your product
@slashclone/brand-book
Create brand guidelines for your product: one shareable HTML brand book covering logo, colors, type, icons, share images, and voice. It follows your real design tokens in light and dark themes, and a checker confirms contrast in both themes, icon and image sizes, and banned copy such as em dashes. Writes only to brand/ and public/brand/.
- Activity
- New: be the first to try it
- Installs
- 0 installs
- Likes
- 0 likes
- Clones
- 0 clones
- 1{
- 2 "name": "Example",
- 3 "edition": 1,
- 4 "tokens": {
- 5 "light": {
- 6 "page": "#FFFFFF",
- 7 "card": "#F4F5F7",
- 8 "text": "#1B1D22",
- 9 "muted": "#5B6070",
- 10 "accent": "#2D5BD3",
- 11 "mark": "#2D5BD3"
- 12 },
- 13 "dark": {
- 14 "page": "#0F1115",
- 15 "card": "#181B21",
- 16 "text": "#ECEEF2",
- 17 "muted": "#A3A8B4",
- 18 "accent": "#7EA2F5",
- 19 "mark": "#4C78E6"
- 20 }
- 21 },
- 22 "pairs": [
- 23 { "fg": "text", "bg": "page", "min": 4.5 },
- 24 { "fg": "text", "bg": "card", "min": 4.5 },
- 25 { "fg": "muted", "bg": "page", "min": 4.5 },
- 26 { "fg": "accent", "bg": "page", "min": 4.5 },
- 27 { "fg": "mark", "bg": "page", "min": 3 }
- 28 ],
- 29 "type": {
- 30 "display": "Your display face",
- 31 "body": "Your body face",
- 32 "mono": "Your mono face"
- 33 },
- 34 "voice": {
- 35 "words": ["plain", "warm", "sure"],
- 36 "banned": ["\u2014", "revolutionary", "seamless"]
- 37 },
- 38 "assets": [
- 39 { "path": "logo/mark.svg" },
- 40 { "path": "icons/favicon.svg" },
- 41 { "path": "icons/icon-192.png", "width": 192, "height": 192 },
- 42 { "path": "icons/icon-512.png", "width": 512, "height": 512 },
- 43 { "path": "icons/icon-maskable-512.png", "width": 512, "height": 512 },
- 44 { "path": "icons/apple-touch-icon.png", "width": 180, "height": 180 },
- 45 { "path": "share/link-preview.png", "width": 1200, "height": 630 }
- 46 ],
- 47 "copy": ["brand-book.html", "voice.md"]
- 48}
