{
 "id": "4.11",
 "title": "Visual identity",
 "department": "Brand",
 "department_slug": "brand",
 "direction": {
  "id": "cooker",
  "name": "Seeti"
 },
 "branded": true,
 "status": "draft",
 "owner": "Param",
 "last_verified": "2026-10-26",
 "holds": "Logo and wordmark slot, colour, type, photography, illustration",
 "urls": {
  "html": "https://handbook.joinsquareup.com/brand/visual-identity/cooker",
  "markdown": "https://handbook.joinsquareup.com/brand/visual-identity/cooker.md",
  "json": "https://handbook.joinsquareup.com/brand/visual-identity/cooker.json"
 },
 "other_directions": [
  {
   "id": "dog",
   "name": "Fetch",
   "json": "https://handbook.joinsquareup.com/brand/visual-identity/dog.json"
  },
  {
   "id": "bee",
   "name": "Buzz",
   "json": "https://handbook.joinsquareup.com/brand/visual-identity/bee.json"
  },
  {
   "id": "raccoon",
   "name": "Scoop",
   "json": "https://handbook.joinsquareup.com/brand/visual-identity/raccoon.json"
  },
  {
   "id": "octopus",
   "name": "Ocho",
   "json": "https://handbook.joinsquareup.com/brand/visual-identity/octopus.json"
  }
 ],
 "tldr": {
  "headline": "Seeti's look: steel, chilli and ink, with chilli the only loud colour",
  "points": [
   {
    "icon": "spark",
    "text": "Chilli red #ff3d2e is the only loud colour, on the whistle, grips and main button."
   },
   {
    "icon": "eye",
    "text": "The brand's own product photos bring every other colour."
   },
   {
    "icon": "book",
    "text": "Bakbak One for display, Anek Latin for body, Fragment Mono only on tickets and counts."
   },
   {
    "icon": "check",
    "text": "Ink on chilli is measured at 5.4 to 1."
   },
   {
    "icon": "flag",
    "text": "The wordmark slot stays dashed until the product is named."
   }
  ],
  "stat": {
   "value": "5.4",
   "label": "contrast, ink on chilli"
  },
  "decide": "Which neutral set wins: the product skin or the warmer book skin?",
  "mood": "building"
 },
 "sources": [
  "brew origin/main a559de6: public/feed-system.css:1-33, 188-193; public/index.html:6; public/assets/brew-mark.svg; server.js:948",
  "brand-directions/cooker/system.md section 2",
  "brand-directions/cooker/brand.html b4",
  "brand-directions/cooker/kit-skin.js tokens and fonts",
  "brand-directions/docs2/data/dirs.json cooker tokens",
  "brand-directions/cooker/character.html c2, c8",
  "brand-directions/book/content/f.js:754-918 section f-4",
  "brand-directions/BRIEF.md section 2, agent colours",
  "memory brand-directions-2026-10-25, fonts rule"
 ],
 "open_questions": [
  "Which neutral set wins, the product skin or the warmer book skin? Proposal: the product skin from kit-skin.js, with the book's ticket paper and flame kept as accents.",
  "Keep Fragment Mono for tickets, or use Anek Latin narrow? Proposal: keep Fragment Mono, only on tickets and counts.",
  "Does the kitchen tile grid belong in the product or only in books and marketing? Proposal: books and marketing only, so the product stays quiet."
 ],
 "parts": {
  "Answer": "Seeti's look is steel, chilli and ink on a dark stove top or a cream kitchen tile, with chilli red as the only loud colour and the brand's own product photos bringing every other colour; this settles the tokens, type, shapes and the wordmark slot.",
  "Today": "### The live product\n\n| Part | Today in the build |\n|---|---|\n| Look | Dark by default, light follows the OS, one 500 pixel feed column [src: brew/public/feed-system.css:1-4] |\n| Dark tokens | bg #0a0a0a, card #1b1b1b, surface #232323, fg #fafafa [src: brew/public/feed-system.css:10-12] |\n| Light tokens | bg #f6f6f6, card #ffffff, fg #0a0a0a [src: brew/public/feed-system.css:44-46] |\n| Brand colour in chrome | Only a brand wash set per tenant from the brand's own pack [src: brew/public/feed-system.css:28] |\n| Body type | SF Pro Text, then Inter [src: brew/public/feed-system.css:31] |\n| Hand type | Caveat, for margin notes [src: brew/public/feed-system.css:32; brew/public/index.html:6] |\n| Mono | SF Mono, JetBrains Mono [src: brew/public/feed-system.css:33] |\n| Area colours | Creative teal #2bb39b, performance blue #4a90f0, storefront orange #f28a3c, visibility purple #9a6bf0, CRM green #16a37f, as small faces [src: brew/public/feed-system.css:188-193] |\n| Mark | A white mark on a near black rounded square, used as the favicon [src: brew/public/assets/brew-mark.svg; brew/server.js:948] |\n| Character | None in the product [src: brand-directions/BRIEF.md section 2] |\n\n- Inter is on the owner's list of fonts that give AI work away, so it goes tomorrow. [src: memory brand-directions-2026-10-25]\n\n### Seeti's direction files\n\n| Part | What exists |\n|---|---|\n| Product skin tokens | kit-skin.js, calm neutrals with chilli for the main button, focus and Seeti only [src: brand-directions/cooker/kit-skin.js:1-3] |\n| Book skin tokens | system.md section 2 and brand.html b4, warmer stove top and kitchen tile [src: brand-directions/cooker/system.md section 2] |\n| Fonts loaded | Bakbak One and Anek Latin from Google Fonts [src: brand-directions/cooker/kit-skin.js fonts] |\n| Screens | 108 kit screenshots, dark and light, in cooker/kit [src: brand-directions/cooker/kit listing] |\n\nThe two token sets disagree on neutrals: the product skin dark bg is #141416, the book's stove top is #121214. The product skin is what screens use. [src: brand-directions/cooker/kit-skin.js tokens.dark; brand-directions/cooker/system.md section 2]",
  "Tomorrow": "### Colour\n\n| Token | Value | Use | Tag |\n|---|---|---|---|\n| Chilli | #ff3d2e | Owned. Whistle, grips, blush, main button, focus | v1, New |\n| Chilli deep | #c8261a | Links and stamps on light, light focus | v1, New |\n| Steel | #c9ced6 | Seeti's body, quiet chrome | v1, New |\n| Steel dark | #8d949f | Shading, brows | v1, New |\n| Ink | #15161a | Outlines, text on chilli | v1, New |\n| Ticket paper | #f6efe2 | Order tickets only | v1, New |\n| Flame | #2f5bd8 | The gas flame under Seeti only, never UI | v1, New |\n\nProduct tokens, from the skin every screen uses:\n\n| Token | Light | Dark |\n|---|---|---|\n| bg | `#f7f5f1` | `#141416` |\n| surface | `#ffffff` | `#1c1d21` |\n| surface2 | `#efece6` | `#26272c` |\n| ink | `#15161a` | `#f3f1ec` |\n| muted | `#5a5d64` | `#a5a8b0` |\n| line | `#e2ddd3` | `#303239` |\n| hero | `#ff3d2e` | `#ff3d2e` |\n| heroInk | `#15161a` | `#15161a` |\n| focus | `#c8261a` | `#ff6a5e` |\n| radius, radiusSm | 16px, 10px | 16px, 10px |\n\n- v1, Changes: today's neutral black and white tokens give way to these. Restyle only, no logic change.\n- v1, New: chilli covers under ten percent of any screen. About 70 percent stove or tile, 20 percent steel and surfaces. [src: brand-directions/cooker/brand.html b4]\n- v1, New: ink on chilli for text, 5.4 to 1. Never white on chilli. [src: brand-directions/cooker/brand.html b4]\n- v1, Stays: the five area colours stay as small chips only. Chilli never touches an area tag. [src: brand-directions/cooker/system.md section 2]\n- v1, Stays: the brand wash from the partner's own pack stays the only brand colour in chrome around their work. The partner's photos carry the colour.\n\n### Type\n\n| Role | Face | Use | Tag |\n|---|---|---|---|\n| Display | Bakbak One, one weight | Headlines, Seeti's big lines, numbers. Drawn in India for Latin and Devanagari. Font synthesis off | v1, New |\n| Body | Anek Latin, 400 to 700, width 75 to 125 | Every control, card and paragraph. Has the rupee sign | v1, New |\n| Ticket | Fragment Mono, one weight | Order tickets, counts, timers. Nowhere else | v1, New |\n| Hand | Caveat | Goes with Inter; margin notes take Anek Latin or a hand face picked for Seeti | v1, Goes |\n\n- Scale: display 50, 32, 23. Body 16, 14, 12. Ticket 13. Prices in the body face. [src: brand-directions/cooker/system.md section 2]\n- v1, Changes: Fragment Mono is in system.md but not in the kit-skin font link. Add it when the ticket ships.\n\n### Shapes, layout and motifs\n\n- v1, New: whistle pills, three red rounded bars, the only progress mark. Three pills means ready. [src: brand-directions/cooker/brand.html b4]\n- v1, New: a torn ticket edge, only on things that get handed off. [src: brand-directions/cooker/system.md section 2]\n- v1, New: steam puffs, three flat circles with an ink outline, for emotion and loading. Never soft gradient blobs. [src: brand-directions/cooker/review.md Major 3]\n- v1, New: cards are a lid in a rim: 14 to 20 px radius, 1.5 to 2 px borders, offset ink shadows on hero items only. [src: brand-directions/cooker/system.md section 2]\n- v1, New: a kitchen tile grid of 44 pixel squares at 2 to 4 percent ink behind everything. One hero per screen: Seeti, a big number or a ticket, never all three. One column on phones. [src: brand-directions/cooker/brand.html b4]\n\n### Illustration and photography\n\n- v1, New: Seeti is flat 2D, one ink outline weight, four inks, no shine, no shadow, no real fire. [src: brand-directions/cooker/character.html c2, c8]\n- v1, Stays: the brand's own product photos are the hero and bring every colour. Seeti never sits over them. [src: brand-directions/cooker/system.md section 5]\n- v1, New: invented examples use the sample candle store, with a visible Sample label. [src: brand-directions/cooker/system.md section 8]\n\n### Logo and wordmark slot\n\n- v1, New: a dashed wordmark slot wherever the product name goes, until the name is chosen. [src: brand-directions/cooker/system.md section 1]\n- v1, New: lockup is Seeti's head at the cap height of the wordmark, a gap of one whistle width. On chilli, ink wordmark only, never white. Chilli is the app icon ground. [src: brand-directions/cooker/brand.html b4]\n- v1, Goes: today's mark in public/assets/brew-mark.svg is replaced by the small mark, svg/icon.svg, once the name is set.\n- v2 to v4, Stays: the identity does not change as the product grows. New abilities arrive as props.",
  "How we do it": "1. Every colour is a token. Use the kit-skin.js values for product screens and system.md values for books and marketing until one set is chosen.\n2. Before a screen ships, check chilli is under ten percent of the area, text on chilli is ink, and the partner's photos are untouched.\n3. Check type: no Inter, no system fallback showing, Bakbak One never synthesised bold.\n4. Check both themes and 400 pixels wide with no sideways scroll.\n5. Run the direction checker:\n\n```\ncd /Users/param/Documents/ChatGPT/brand-directions && node _tools/check.mjs cooker\n```",
  "Numbers": "| Metric | Definition | Where measured | Status |\n|---|---|---|---|\n| Chilli share | Share of screen pixels in chilli, target under 10 percent | Screenshot audit of the 45 kit screens | Proposed |\n| Contrast pass | Text pairs at or above 4.5 to 1, ink on chilli measured at 5.4 to 1 | Kit screens, both themes | Proposed |\n| Font giveaways | Count of screens rendering Inter or a system fallback, target zero | Headless audit of the product | Proposed |",
  "Open": "1. Which neutral set wins, the product skin or the warmer book skin? Proposal: the product skin from kit-skin.js, with the book's ticket paper and flame kept as accents.\n2. Keep Fragment Mono for tickets, or use Anek Latin narrow? Proposal: keep Fragment Mono, only on tickets and counts.\n3. Does the kitchen tile grid belong in the product or only in books and marketing? Proposal: books and marketing only, so the product stays quiet."
 }
}