# The MAKR Labs brand rules (v1.0.0, 2026-10-24) The source of truth for anything made for MAKR Labs: the site, the docs, MAX//OS, print, documents, email, social posts and slides. Every rule has an id that never changes meaning. Must is required and Never is forbidden; an exception to either needs Max's written OK, recorded as a ledger row. Should is the default; a deviation needs a written reason in the pull request or the file's notes. May is allowed. - The brand book: https://overprint-docs.vercel.app/brand - This digest as JSON: https://overprint-docs.vercel.app/brand/rules.json - The checklists before anything goes out: https://overprint-docs.vercel.app/brand/checklist - Every kit file with its sha256: https://overprint-docs.vercel.app/brand/downloads ## Mark The page: https://overprint-docs.vercel.app/brand/mark - **BB-MARK-01** (must) Use the logo pack's files or the `Mark`, `Logo` and `Wordmark` components; never redraw, retrace or retype the mark or the wordmark. Why: The files and the components draw from one geometry (`markGeometry`, `logoGeometry`), so the mark prints the same on the site, on paper and in documents. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-02** (must) Keep at least 1x of clear space around the mark and every lockup, and at least 2x from a trim edge in print; x is the side of one square at the size it prints. Why: Clear space lets the mark read as a mark and not as part of the layout. Every logo pack file carries it as transparent padding, so a file edge is already the clear-space edge. Checked by: Component (Logo; the press artwork tests keep the mark inside the trim). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-03** (must) Respect the minimum sizes: the mark 24 px on screen and 6 mm in print, the horizontal lockup 120 px (30 mm) wide, the stacked lockup 64 px (18 mm) wide, the wordmark 100 px (22 mm) wide; from 16 to 23 px the favicon drawing prints. Why: Below these sizes the seams close up and the wordmark drops under the type floor. The favicon drawing is pixel-snapped for the sizes in between. Checked by: Component (Mark and Logo warn in development; the logo pack tests). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-04** (must) Print the mark in the Process inks, or in one colour: ink on a light ground, paper on the slab or on Night. Why: The four inks are the mark: M A over K R spells the press it prints on. The one-colour version exists for jobs that print one ink. Checked by: Test (the logo pack's colour check). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-05** (never) Recolour the mark with an alternate, client or single ink, a tint or a gradient. Why: A client colourway re-inks a case study's art, never the studio's mark (D-N73). A tint or a gradient turns the four inks into decoration. Checked by: Test (the logo pack's colour check; the misuse grid). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-06** (never) Reorder the squares: M A over K R is fixed. Why: Read across the rows, the squares spell the press they are printed on. Any other order spells nothing. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-07** (never) Stretch, rotate, tilt, skew, outline, shadow, glow, blur, texture, halftone or second-ink the 2D mark or the wordmark. Why: The mark is flat ink on paper. Effects belong to the expressive layer, and the 3D blocks are the mark's only other pose. Checked by: Lint (mk/glow; the rest by eye). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-08** (never) Place the mark on a photo, art, the ink field, halftone, a gradient or a line plate; over an image, set it on an opaque paper plate that holds its clear space. Why: The squares need clean paper around them to read as four inks. A busy ground swallows the seams. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-09** (must) Print the letters on the squares only from 48 px on screen and 12 mm in print. Why: Smaller letters fall under the type floor and blur into their squares; below the threshold the squares print without them. Checked by: Component (Mark drops the letters below the threshold). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-10** (must) Spell the names as written: MAKR Labs, makrlabs.dev, MAX//OS, Overprint, and the line names Websites, Growth, Software and Custom apps. Why: The names are part of the identity. One spelling keeps search results, documents and the site consistent. Checked by: Lint (brand/name-spelling). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-11** (must) Choose the lockup by the box ratio: 2.5 to 1 or wider takes the horizontal lockup, 0.8 to 2.5 the stacked lockup, square slots and boxes below a lockup's minimum the mark alone; one lockup per view is the identifier. Why: The ratio rule fits the lockup to its space, so nobody squeezes a horizontal lockup into a square or shrinks a stacked one into a strip. Checked by: Component (Logo layout="auto", MARK_SPECS.choose). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-MARK-12** (must) Treat the 3D block mark as an illustration: the 2D lockup appears in the same view. Why: The blocks tumble, pile and light up. The flat lockup is the identifier people remember and search for. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-MARK-13** (must) On a line's own page, light only that line's square; everywhere else, light all four. Why: A lit square says where you are. Lighting one square anywhere else claims a line the page is not about. Checked by: Manual review. Applies to: Site, Docs, MAX//OS. - **BB-MARK-14** (must) Co-brand only with the partner's written OK: both marks at equal optical height, 2x apart, a × in ink between them, the partner's mark on its own plate. Why: Equal height and space keep either mark from reading as a sub-brand of the other, and the written OK keeps the studio from implying a partnership that does not exist. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-MARK-15** (never) Animate the mark outside its three moments (the press run prints it on a first visit, the pile tidies into it, card blocks hop), and never loop it. Why: The mark is the fixed point of a lively system. A logo that loops is noise and costs the calm that makes the rest readable. Checked by: Lint (mk/loop). Applies to: Site, Docs, MAX//OS, Slides. - **BB-MARK-16** (must) Take favicons and app icons from the logo pack's icons folder. Why: They are pixel-snapped from the same geometry and checked at their sizes; a favicon scaled by hand blurs. Checked by: Manual review. Applies to: Site, Docs, MAX//OS. - **BB-MARK-17** (must) Use the mark in use, option c (Key block); the other options are a record of the exploration and never print. Why: One mark is the identity (D-P20). The explored options stay on the mark page so a later change is one decision with its own ledger row. Checked by: Test (the logo pack ships the option in use only). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. ## Colour The page: https://overprint-docs.vercel.app/brand/colour - **BB-COLOUR-01** (must) Take every colour from the tokens or `print.json`; never type a hex, RGB, OKLCH or CMYK value by hand. Why: The derived set is checked for contrast and colour vision in every look; a value typed by hand drifts from it the day an ink changes. Checked by: Lint (brand/raw-colour; docs/no-literal-values). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-COLOUR-02** (must) Use a line ink only where it means its line, always with its letter or its glyph. Why: Colour is meaning (D-C2): magenta is Custom apps, aqua Software, red Growth, key Websites. The letter and the glyph keep the meaning for readers who do not see the hue. Checked by: Press check (rule 10, colour vision). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-03** (must) Keep yellow for the face of the one primary action per view and for the spot ink in art from Press up; never text, a status, or a plate wider than a call-to-action band. Why: Yellow is the action ink. When it only ever means press here, the next step is always the loudest thing on the page. Checked by: Manual review (the press colour budget counts it). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-04** (must) Set text on colour in ink or paper through the sanctioned pairs. Why: The pairs are solved for WCAG 2.2 AA and the APCA floor in every look; coloured text on a coloured plate fails one or the other. Checked by: Press check (rule 4; lint mk/colour-text). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-05** (never) Use traffic-light colours for status: a status is a glyph, a literal word and an ink treatment. Why: Red is Growth and green is the live dot, and a colour alone says nothing to a colour-blind reader. Checked by: Lint (mk/status-colour). Applies to: Site, Docs, MAX//OS, Documents. - **BB-COLOUR-06** (must) Print Night as black paper with flat, opaque inks: no glow and no blur. Why: Night is a stock with fluorescent inks (D-C8). A glow reads as a screen effect, and blur costs legibility. Checked by: Lint (mk/glow). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-07** (must) Stay within the volume's colour budget and chroma cap. Why: The budget keeps Studio calm enough to read and lets Rave be loud on purpose (D-B4, D-B5). Checked by: Press check (rules 7 and 8). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-08** (never) Let red or pink meet blue or violet above a chroma of 0.12 on a hard edge; keep at least 2 px of paper or ink between saturated areas. Why: Those pairs vibrate on screen and on paper. A paper gutter stops it. Checked by: Press check (rule 9, no vibration). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-09** (must) Encode the series of a chart that is not about the lines by pattern first; never borrow a line ink for another meaning. Why: A borrowed line ink would say Growth or Software where the chart means something else. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Documents, Slides. - **BB-COLOUR-10** (must) Make client colourways with `deriveColourway`; they replace the lead, support and spot inks only. Why: The derivation keeps every pair legible in every look; the line inks, the action ink and the mark stay the studio's. Checked by: Test (the helper's 50 fictional brands). Applies to: Site, Docs, Social, Slides. - **BB-COLOUR-11** (never) Use Display P3 colour on text, solids, plates, tints or stocks, or anywhere in print. Why: P3 only widens large art fields at Press and Rave. Text, plates and print need the sRGB values the pairs and the CMYK builds are solved from. Checked by: Test (G7). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-COLOUR-12** (should) Use the lead pair, magenta and aqua, for art at Studio; add more inks from Press up. Why: Two inks keep a Studio page calm; Press and Rave are where the full set prints. Checked by: Press check (rule 7's hue count). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-COLOUR-13** (must) Keep the overprint thirds, the colours where two inks multiply, as art: they never carry meaning and never sit under text. Why: A third colour changes with the paper and the volume, so it cannot hold a meaning, and under words it would be art behind text. Checked by: Press check (rule 1, two layers). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. ## Type The page: https://overprint-docs.vercel.app/brand/type - **BB-TYPE-01** (must) Use Anybody for display, Schibsted Grotesk for text, Shantell Sans capitals only in balloons and captions, and Geist Mono only in code. Why: Each family has one job, so a reader learns the system in a page: posters shout in Anybody, reading happens in Schibsted, people talk in Shantell. Checked by: Lint (mk/mono). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-TYPE-02** (must) Write in sentence case everywhere; capitals only in stamps, SFX and comic lettering. Why: Sentence case reads fastest and keeps the capitals for the moments that should feel printed. Checked by: Lint (mk/uppercase; check:docs headings). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-TYPE-03** (must) Meet the type floors of the type page for screen, print and slides. Why: The floors are where text stops being comfortable to read: the APCA lookup on screen, the printer's minimums on paper, the back row of a room on slides. Checked by: Press check (rule 3; the press artwork and deck tests). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-TYPE-04** (must) Print one display moment per view at Studio and one per section at Press; set the wide, condensed and italic voices on three words or fewer, on one line. Why: One poster moment is a headline; three are a ransom note. The width extremes only read on a few words. Checked by: Press check (rule 11, type discipline). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-TYPE-05** (must) Print the second ink only on display type of 2 rem or more (section heads from Press), and never under more contrast. Why: Below 2 rem the offset reads as blur (D-D6); readers who ask for more contrast get one clean print. Checked by: Lint (mk/second-ink-role). Applies to: Site, Docs, MAX//OS, Social, Slides. - **BB-TYPE-06** (must) Set numerals tabular and lining; use a slashed zero only in codes and ids. Why: Tabular figures line up in tables, prices and dates; a slashed zero in prose looks like a typo. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-TYPE-07** (must) Keep running text to 70 characters a line with a leading of 1.5 or more, and balloons and captions to 35 words. Why: Long lines and tight leading tire the eye; long balloons belong on a words panel in Schibsted. Checked by: Press check (rule 11, type discipline). Applies to: Site, Docs, MAX//OS, Documents, Slides. - **BB-TYPE-08** (never) Use synthetic bold or italic, tracked body text or justified text. Why: The families ship the weights and italics they need; faked styles, tracking and justification break the spacing the type was drawn with. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-TYPE-09** (never) Send an editable file that needs the fonts installed; PDFs and decks embed them. Why: A file that falls back to a system font loses the brand on the client's machine. Embedded fonts print the same everywhere. Checked by: Test (pdffonts on every press PDF, document and deck). Applies to: Print, Documents, Slides. - **BB-TYPE-10** (must) In email, set text in Helvetica, Arial, sans-serif and the wordmark as an image; it is the only sanctioned fallback. Why: Email clients strip web fonts, so the signature names a stack every client has and carries the wordmark as a picture. Checked by: Test (the signature tests). Applies to: Email. ## Voice The page: https://overprint-docs.vercel.app/brand/voice - **BB-VOICE-01** (must) Write as the studio in the first person, "I", and to the reader as "you". Why: MAKR Labs is one person. Writing as a team that does not exist would be the first claim nobody can check. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Documents, Email, Social, Slides. - **BB-VOICE-02** (must) Keep jokes in the joke zone; the literal zone stays plain words. Why: The humour is loud on purpose (D-I2), and the labels, prices, errors and legal lines stay literal so nobody has to decode them. Checked by: Component (checkSfx and checkBalloon; the rest by eye). Applies to: Site, Docs, MAX//OS, Documents, Email, Social, Slides. - **BB-VOICE-03** (never) Use an em dash anywhere. Why: It is the most common tell of generated copy, and the voice is written to sound like one person typing. Checked by: Lint (brand/em-dash). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-VOICE-04** (never) Use the banned tells: setup and punchline headings, "X, not Y" pairs, runs of fragments, "no A, no B, no C" lists, or leaning on the words honest, straight or real. Why: These patterns read as generated filler. Specific detail says the same thing better. Checked by: Component (COPY_TELLS in the copy checks). Applies to: Site, Docs, MAX//OS, Documents, Email, Social, Slides. - **BB-VOICE-05** (must) Make every claim checkable: a number carries its source and its date. Why: Proof over promises: a reader can test the claim, and a dated number never goes quietly stale. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Documents, Email, Social, Slides. - **BB-VOICE-06** (must) Write dates, times, money and numbers in the formats of the voice page. Why: One format everywhere means a date or a total never has to be read twice. Checked by: Test (formatDate and formatMoney). Applies to: Site, Docs, MAX//OS, Documents, Email, Social, Slides. - **BB-VOICE-07** (must) Pass every SFX through `checkSfx`, and never put one on an error, a price, a legal line, a destructive confirmation or a form field. Why: An SFX is a caused event. On a serious line it turns a fact into a joke at the reader's expense. Checked by: Component (checkSfx; the press DOM check). Applies to: Site, Docs, MAX//OS, Social, Slides, Print. - **BB-VOICE-08** (must) Use fictional people and businesses in every example, sample and fixture. Why: Real names in samples leak client details and publish people who never agreed to it. Checked by: Test (check:docs (fictional emails and phone numbers)). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-VOICE-09** (never) Publish a price on the site: prices live in quotes, proposals and invoices. Why: Every job is quoted on its scope, and a published price would be the first number a client could not check against their own project. Checked by: Manual review. Applies to: Site, Social, Slides. - **BB-VOICE-10** (must) Use the fixed words as written: the action labels "Get a quote", "Send" and "Email it instead", the status words "In development", "Private preview", "Preparing release" and "Live", and the stamp words. Why: Fixed words are learned once. A creative label on a button costs the reader a second look at the exact moment they want to act. Checked by: Component (QuoteForm, the product card's status schema and isStampWord). Applies to: Site, Docs, MAX//OS, Documents, Email, Social, Slides. ## Comic The page: https://overprint-docs.vercel.app/brand/comic - **BB-COMIC-01** (must) Set every word on a plate: a words panel, a balloon, a caption, a corner box, an editor's note or a card; art may run under a plate's edge, never under its text. Why: This is the two-layer rule of the comic page (C1): the art can be as loud as the volume allows because no word ever sits on it. Checked by: Press check (rule 1, the walker). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-02** (must) Print one hero per view: one splash or one SFX moment per view at Studio, and one shout balloon per view at every volume. Why: Two heroes compete and neither lands (C2). The art budget counts them per view. Checked by: Press check (the ART_BUDGET counts). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-03** (must) Keep the reading order equal to the DOM order: panels left to right and top to bottom, plates in a panel from the top left; placement never reorders. Why: Screen readers and keyboards follow the DOM, so a layout that reorders panels tells two stories (C3, WCAG 1.3.2 and 2.4.3). Checked by: Test (21 §7, CK-01). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-04** (must) Hold a panel to 3 balloons, 1 caption and 60 words, and a balloon or caption to 35 words. Why: Comic lettering is display reading (C4, D-D7): short, or it stops being a comic and becomes small print. Checked by: Component (checkBalloon). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-05** (must) Point every tail at its speaker, or off the panel for the narrator; a tail never crosses another plate's text. Why: The tail is how a reader knows who speaks (C5). Crossing text breaks both the speaker and the words. Checked by: Test (21 §7, CK-02). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-06** (must) Keep words, plates and the words regions of frames at 0°; frames may slant and art may tilt. Why: Square text (C6, D-B9): the page can lean and tumble around words that hold still. Checked by: Press check (rule 12, square text). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-07** (must) Keep gutters paper (night on Night, pulp at Press) and 1 rem or wider; saturated panels never touch. Why: Paper gutters separate the panels and stop two saturated plates from vibrating against each other (C7). Checked by: Press check (rule 9 and the gutter check). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-08** (must) Set long reading (paragraphs, pricing, forms, legal) in Schibsted on a words panel, never in balloons or captions. Why: Comic capitals are for a few lines (C8). Anything a reader must study gets the text family. Checked by: Component (Caption lettering="auto"). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-09** (must) Make actions hit keys or links with literal labels in the reading layer; an SFX may decorate a key, never replace its label. Why: The key says what happens when you press it (C9). The SFX is the noise it makes. Checked by: Press check (the walker and axe). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-10** (must) On phones, run one column, keep tails to 24 px, scale SFX to the small or medium size clear of the text column, and break out by 24 px at most. Why: A phone column has no room for art to overlap words (C10). The page reads top to bottom and the art stays in its lane. Checked by: Test (21 §7, CK-01 at phone width). Applies to: Site, Docs, MAX//OS. - **BB-COMIC-11** (must) Let the register follow the volume and the theme; a section may go one step louder than its page. Why: The three comic directions are volumes of one kit (C11, D-F2): Studio comic, the old comic at Press and the neon comic on Night and at Rave. Checked by: Test (21 §7 registers). Applies to: Site, Docs, Documents, Social, Slides, Print. - **BB-COMIC-12** (must) Ship every comic fixture with long, short and empty content. Why: Copy is never the length of the mock-up (C12). Long, short and empty cases show what fits before the words arrive. Checked by: Test (the fixture registry). Applies to: Site, Docs. - **BB-COMIC-13** (must) Hide SFX from assistive technology with `aria-hidden`; a message an SFX carries also exists as text. Why: A screen reader announcing POW! adds noise and no meaning (D-F5). The text says what happened. Checked by: Press check (the walker). Applies to: Site, Docs, MAX//OS. - **BB-COMIC-14** (never) Put comic panels, balloons or SFX on a document page with prices, terms or payment details. Why: A price is a promise. Comic art beside it makes the promise look like a joke. Checked by: Test (the documents' DOM check). Applies to: Documents, Slides. - **BB-COMIC-15** (must) Give balloons to named speakers only, and quote a client only when their words are held in writing. Why: A balloon is a person talking. Putting words in a client's mouth that they never wrote is a claim nobody can check. Checked by: Manual review. Applies to: Site, Docs, Documents, Social, Slides, Print. ## Imagery The page: https://overprint-docs.vercel.app/brand/imagery - **BB-IMAGE-01** (must) Keep proof untouched: no crop beyond the frame, no recolour, no halftone and no retouching. Why: Screenshots of client sites are proof (D-I1). Changing them would make the proof a picture. Checked by: Component (ProofTreatmentError). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-IMAGE-02** (must) Print every other photo through the photo pipeline: duotone by default, a 7 px cell, screens at 45° and 75°. Why: Printed photos sit in the brand's inks like everything else, and the pipeline makes them the same way every time. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-IMAGE-03** (never) Use stock photography, or a generated image presented as a person, a place or a piece of work. Why: Every picture is either proof or plainly art. A stock photo or a fake portrait is neither. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-IMAGE-04** (never) Put an image behind text. Why: Text sits on plates (D-B1). An image under words costs contrast at every point where the picture changes. Checked by: Press check (rule 1, two layers). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-IMAGE-05** (must) Draw icons and illustration from the shape alphabet and the kits; no other icon set. Why: One alphabet in 2D and 3D (D-G2) is a large part of what makes the brand recognisable. Checked by: Lint (brand/import). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-IMAGE-06** (must) Give every image literal alt text, and mark decorative art `aria-hidden`. Why: Alt text is the literal zone: it says what the image shows, so a screen reader user gets the same page. Checked by: Press check (axe). Applies to: Site, Docs, MAX//OS, Documents, Email, Social. - **BB-IMAGE-07** (must) Use photos of people only with their consent, and client logos only inside proof or with written permission. Why: A face or a logo on the studio's materials reads as an endorsement. Consent and permission make it true. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-IMAGE-08** (must) Caption every MAX//OS screenshot "Fictional demo data". Why: The demo cast is made up. The caption says so, so nobody mistakes it for someone's account. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Social, Slides. - **BB-IMAGE-09** (must) Show 3D only as print-shaded blocks: stills in documents, email, social and slides, and live 3D only on the site and the docs. Why: One material keeps the blocks recognisable at every size (D-G1), and stills keep files light and identical everywhere. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-IMAGE-10** (must) Make case covers from project data with `caseCover`; never draw one by hand. Why: A cover drawn from data is deterministic: the same project always prints the same cover. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. ## Layout The page: https://overprint-docs.vercel.app/brand/layout - **BB-LAYOUT-01** (must) Set everything on its medium's grid; art may bleed, text never does. Why: The grid is what makes a loud page still look built. Text in the bleed is lost to the trim or the screen edge. Checked by: Press check (rule 14 at 320 px; the press artwork tests). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-LAYOUT-02** (must) Print one hero per view, with paper gutters of 16 px or more (4 mm in print) between saturated areas. Why: One hero is a focal point (D-B10); a gutter keeps saturated areas from vibrating against each other. Checked by: Press check (rules 7 and 9). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-LAYOUT-03** (must) Keep text square at rest. Why: Words that lean are harder to read and look accidental (D-B9). The art around them can lean instead. Checked by: Press check (rule 12; lint mk/tilt). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. - **BB-LAYOUT-04** (must) Keep print type 5 mm or more inside the trim on cards and stickers, and nothing meaningful in the bleed. Why: The guillotine and the die drift by a millimetre or two; the safe area keeps every word on the card. Checked by: Test (the press artwork's type boxes). Applies to: Print. - **BB-LAYOUT-05** (must) Keep social text inside the safe zones; on a story, clear of the top 220 px and the bottom 260 px. Why: Platforms print their own chrome over those strips; text there disappears behind it. Checked by: Test (the card layout tests). Applies to: Social. ## Motion The page: https://overprint-docs.vercel.app/brand/motion - **BB-MOTION-01** (must) Give every motion a cause; words never move once they land, and nothing reflows on hover. Why: Motion explains what happened (D-H1). Words that keep moving, or a layout that jumps under the pointer, cost the reader their place. Checked by: Press check (motion; lint mk/hover-reflow). Applies to: Site, Docs, MAX//OS, Slides. - **BB-MOTION-02** (must) Let reduced motion always win. Why: Some readers get sick from motion. The volume never overrides their setting. Checked by: Press check (the motion spec under reduced motion). Applies to: Site, Docs, MAX//OS, Slides. - **BB-MOTION-03** (must) Let ambient motion settle within 5 s at Quiet and Studio; loops at Press and Rave show a pause control. Why: WCAG 2.2.2: anything that moves on its own for longer than five seconds needs a way to stop it. Checked by: Press check (the rAF counter). Applies to: Site, Docs, MAX//OS. - **BB-MOTION-04** (never) Use glow, confetti, or more than 3 flashes a second. Why: Flashes can trigger seizures (WCAG 2.3.1), and glow and confetti are the generic effects the system was built to avoid. Checked by: Lint (mk/confetti; the release flash review). Applies to: Site, Docs, MAX//OS, Social, Slides. - **BB-MOTION-05** (must) Animate slides only with the panel arrival, at Studio, and not at all at Quiet or under reduced motion; PDFs, email and social images stay still. Why: A deck is read in a room; one arrival per slide keeps attention on the speaker. Checked by: Test (the deck tests). Applies to: Slides, Documents, Email, Social. - **BB-MOTION-06** (must) Animate transform, opacity, clip-path and the registered custom properties only; never a layout property. Why: Layout animation shifts the page and drops frames; the compositor properties stay smooth and cost no layout shift. Checked by: Press check (the layout-shift and long-frame checks). Applies to: Site, Docs, MAX//OS. ## Sound The page: https://overprint-docs.vercel.app/brand/motion - **BB-SOUND-01** (must) Keep sound off by default behind a visible toggle; Quiet mutes, and only the kit's voices play. Why: Sound is a toy a visitor turns on (D-H4). Unexpected noise in an office or on a train loses the visitor. Checked by: Press check (the sound gating; the voices by ear). Applies to: Site, Docs, MAX//OS. - **BB-SOUND-02** (never) Autoplay sound or video. Why: Autoplay takes the choice away from the reader and fails WCAG 1.4.2 for sound. Checked by: Manual review. Applies to: Site, Docs, MAX//OS, Social, Slides. ## Volume The page: https://overprint-docs.vercel.app/brand/volume - **BB-VOLUME-01** (must) Pick the volume from `CHANNEL_VOLUMES`; a section may go one step louder, never two. Why: The channel table is the brand's loudness map. One step of contrast between sections reads as rhythm; two reads as a different site. Checked by: Press check (the template pins; the generators read the same table). Applies to: Site, Docs, MAX//OS, Print, Documents, Email, Social, Slides. - **BB-VOLUME-02** (must) Print prices, legal lines, forms and document body pages at Quiet. Why: Where the reader decides or signs, nothing should compete with the words. Checked by: Test (the documents' DOM check). Applies to: Site, MAX//OS, Documents, Slides. - **BB-VOLUME-03** (must) Keep Rave for the 404, easter eggs, launches, campaigns and editions. Why: Rave is a party. Used everywhere it stops being one (D-B3). Checked by: Manual review. Applies to: Site, Docs, Social, Slides. - **BB-VOLUME-04** (must) Keep the reading layer identical at every volume; only the expressive layer moves. Why: Text, controls and data read the same at Quiet and at Rave (D-B2), so turning the dial never costs legibility. Checked by: Press check (A10, the reading layer by computed style). Applies to: Site, Docs, MAX//OS, Print, Documents, Social, Slides. ## Print The page: https://overprint-docs.vercel.app/brand/print - **BB-PRINT-01** (must) Build CMYK only from `print.json` for the job's stock; a printer's own profile replaces ours by regenerating the file. Why: The builds are measured through ICC profiles with their colour difference recorded. A build guessed by eye prints a different colour on every press. Checked by: Test (pnpm print:check). Applies to: Print. - **BB-PRINT-02** (must) Print type and rules in K only; floods of 10 mm or more in the rich black of `print.json`, with CMY pulled back 0.15 mm from knockouts. Why: Four-colour black on fine type misregisters into a coloured blur; rich black makes large floods deep, and the pullback hides any misregistration. Checked by: Test (the Ghostscript separations). Applies to: Print. - **BB-PRINT-03** (must) Keep total ink within the profile's limit, and rich black at 260 % or less. Why: Too much ink smears, dries slowly and offsets onto the next sheet. Checked by: Test (the Ghostscript separations). Applies to: Print. - **BB-PRINT-04** (must) Print the Night side as a rich black flood with knockouts: inks print on paper inside them, and the K square knocks out to paper. Why: CMYK inks are transparent, so a light ink printed on black disappears. Knockouts give every ink its own paper. Checked by: Test (the business card's separations). Applies to: Print. - **BB-PRINT-05** (never) Simulate the fluorescent Night inks in CMYK; they print only as approved spot inks. Why: Fluorescent inks have no CMYK equivalent; a simulation prints as a dull version and loses the point of the neon. Checked by: Manual review. Applies to: Print. - **BB-PRINT-06** (must) Use a spot ink only after Max approves it against a current physical guide and a printer's drawdown. Why: Spot candidates are matched by eye on a screen; only paper under real light shows whether they match (D-P9, DF-66). Checked by: Test (the spot entry's status in print.json). Applies to: Print. - **BB-PRINT-07** (must) Send the press pipeline's CMYK PDF: fonts embedded, trim and bleed boxes, bleed, marks outside the bleed, no RGB objects, rasters at 300 ppi or more at size. Why: That is what a print shop's preflight asks for; a file that passes it prints without a phone call. Checked by: Test (pnpm print:check). Applies to: Print. - **BB-PRINT-08** (must) Give stickers the `CutContour` spot path (0.25 pt, overprint), 2 mm of bleed past the cut and a 3 mm white border. Why: The cutter follows the named spot path, and the border and bleed hide the cutter's drift. Checked by: Test (pnpm print:check). Applies to: Print. - **BB-PRINT-09** (must) Approve colour from a hard proof or a press check under D50 light, never from a screen. Why: Screens emit light and paper reflects it. No monitor shows what the press will print. Checked by: Manual review. Applies to: Print. - **BB-PRINT-10** (never) Imitate Bone with a printed tint; choose a warm white stock. Why: A tint flood greys the paper and changes every ink printed on it. The stock is the paper colour. Checked by: Manual review. Applies to: Print. - **BB-PRINT-11** (never) Print halftone dots under 0.3 mm or rules under 0.25 pt at size. Why: Smaller dots and rules fill in or drop out on press. Checked by: Test (the press artwork tests). Applies to: Print. - **BB-PRINT-12** (must) Print business cards with a Bone front at Studio and a Night back at Press, on the uncoated profile, from the press pipeline. Why: The card is the brand in one hand: the calm front carries the contact lines, the back carries the mark. Checked by: Test (the business card tests). Applies to: Print. ## Documents The page: https://overprint-docs.vercel.app/brand/templates/documents - **BB-DOC-01** (must) Make quotes, proposals, invoices and letters only with the templates, from JSON. Why: The templates carry the type, the layout and the arithmetic; a document made by hand drifts from all three. Checked by: Manual review. Applies to: Documents. - **BB-DOC-02** (must) Let totals come from the template's arithmetic, never typed. Why: Integer cents rounded half up at every step (`computeTotals`) give the same total every time; a typed total is one typo from a wrong invoice. Checked by: Test (computeTotals). Applies to: Documents, Slides. - **BB-DOC-03** (must) Number documents Q-YYYY-NNN, P-YYYY-NNN and INV-YYYY-NNN, and give status as a literal word with an optional stamp (Sent, Approved, Paid). Why: A number and a word are what a client's bookkeeper files. The stamp is the fun beside it. Checked by: Test (the document schemas). Applies to: Documents. - **BB-DOC-04** (must) Keep real client and payment details outside this repo; the repo holds fictional samples only. Why: The repo is shared with agents and contractors. Real details live in Max's studio profile on Max's machine. Checked by: Test (check:docs; the rest by eye). Applies to: Documents, Email, Print. - **BB-DOC-05** (must) Enter tax lines as inputs (label, rate, registration number); the template never decides tax. Why: Tax depends on the client and the province. The person sending the document knows it; the template does not. Checked by: Test (the invoice schema). Applies to: Documents. - **BB-DOC-06** (must) Print documents on Letter by default and A4 on request, as tagged PDFs with the fonts embedded; press runs go through the press pipeline. Why: Letter suits a Toronto studio with North American clients. A tagged PDF is accessible, and screen documents are RGB while press artwork is CMYK. Checked by: Test (pdfinfo Tagged and the page size). Applies to: Documents. ## Email signature The page: https://overprint-docs.vercel.app/brand/templates/email-signature - **BB-EMAIL-01** (must) Use the generated signature, with no other images, banners, quotes or social icons. Why: Every extra image is a remote load, a spam signal and one more thing a client's email app can break. Checked by: Manual review. Applies to: Email. - **BB-EMAIL-02** (must) Keep the signature to 5 lines, text at 14 px or more, in ink and ink-2 only, with links underlined and a plain-text twin. Why: Email clients invert colours in dark mode; ink and ink-2 survive the inversion, and the plain-text twin covers clients that show no HTML. Checked by: Test (the signature tests). Applies to: Email. - **BB-EMAIL-03** (never) Add tracking pixels or remote fonts. Why: A signature is a courtesy. Tracking pixels and remote fonts spy on the reader and get blocked anyway. Checked by: Test (the signature tests). Applies to: Email. - **BB-EMAIL-04** (must) Host the signature's mark at an absolute HTTPS address with alt text, and keep the HTML to 10,000 characters or fewer. Why: Email clients load images only from absolute addresses, and Gmail cuts signatures longer than its limit. Checked by: Test (the signature tests). Applies to: Email. ## Social The page: https://overprint-docs.vercel.app/brand/templates/social - **BB-SOCIAL-01** (must) Make posts with the card templates: text on the paper plate, 26 px or more at 1080 wide. Why: Feeds show posts small. The templates keep the words on paper and big enough to read on a phone. Checked by: Test (G2's card tests). Applies to: Social. - **BB-SOCIAL-02** (must) Print at most one SFX per card, never beside a price, and one display moment. Why: A card is one view: one shout and one headline. Checked by: Test (the card tests). Applies to: Social. - **BB-SOCIAL-03** (must) Post with the `cardAlt` alt text, and make the caption's first line say what the post is. Why: The image is the joke zone; the alt text and the first line are the literal zone that says what the post is about. Checked by: Manual review. Applies to: Social. - **BB-SOCIAL-04** (must) Hold a carousel to 10 images: a cover, 1 to 8 slides and an end card with a literal action. Why: Platforms cap carousels at 10; the end card says what to do next in plain words. Checked by: Test (the carousel schema). Applies to: Social. ## Slides The page: https://overprint-docs.vercel.app/brand/templates/deck - **BB-SLIDES-01** (must) Make decks from the deck template, with 40 words or fewer on a content slide and body type of 32 px or more on the 1920 × 1080 canvas. Why: The room reads a slide in seconds. The template's grid and type roles are sized for the back row. Checked by: Test (the deck schema and tests). Applies to: Slides. - **BB-SLIDES-02** (must) Print price and timeline slides at Quiet with no SFX. Why: The price slide is where the client decides. Nothing on it should look like a joke. Checked by: Test (the deck's DOM check). Applies to: Slides. - **BB-SLIDES-03** (must) Send decks as a PDF, and present from the HTML file or the PDF. Why: Both carry the fonts and the art. An editable copy would need the fonts on every machine. Checked by: Manual review. Applies to: Slides. - **BB-SLIDES-04** (must) Keep comic slides to one in five slides of a deck. Why: A comic strip is a pause in the pitch. More than one in five turns the pitch into a comic. Checked by: Test (deckInputSchema). Applies to: Slides. ## Downloads - https://overprint-docs.vercel.app/brand/downloads/makr-labs-logo-pack.zip - https://overprint-docs.vercel.app/brand/downloads/makr-labs-colours.zip - https://overprint-docs.vercel.app/brand/downloads/makr-labs-fonts.zip - https://overprint-docs.vercel.app/brand/downloads/makr-labs-business-card-na.pdf - https://overprint-docs.vercel.app/brand/downloads/makr-labs-business-card-iso.pdf - https://overprint-docs.vercel.app/brand/downloads/makr-labs-stickers.zip - https://overprint-docs.vercel.app/brand/downloads/makr-labs-brand-spec-sheet-a4.pdf - https://overprint-docs.vercel.app/brand/downloads/makr-labs-brand-spec-sheet-letter.pdf - https://overprint-docs.vercel.app/brand/downloads/makr-labs-templates.zip - https://overprint-docs.vercel.app/brand/downloads/makr-labs-social-samples.zip - https://overprint-docs.vercel.app/brand/downloads/samples/fernlight-quote.pdf - https://overprint-docs.vercel.app/brand/downloads/samples/pebblepath-proposal.pdf - https://overprint-docs.vercel.app/brand/downloads/samples/fernlight-invoice.pdf - https://overprint-docs.vercel.app/brand/downloads/samples/letter-sample.pdf - https://overprint-docs.vercel.app/brand/downloads/samples/deck-pebblepath.pdf - https://overprint-docs.vercel.app/brand/downloads/samples/deck-pebblepath.html - https://overprint-docs.vercel.app/brand/downloads/samples/email-signature.html - https://overprint-docs.vercel.app/brand/downloads/samples/email-signature.txt - https://overprint-docs.vercel.app/brand/email/mark-96.png - https://overprint-docs.vercel.app/samples/poster-fernlight-a3.pdf - https://overprint-docs.vercel.app/samples/poster-fernlight-tabloid.pdf - https://overprint-docs.vercel.app/samples/one-pager-fernlight-a4.pdf - https://overprint-docs.vercel.app/samples/one-pager-fernlight-letter.pdf This file: https://overprint-docs.vercel.app/brand/rules.md