Mark

Three options were designed in Phase 2 (D-A3): a, Overprint (the default), b, Paper seam, and c, Key block. Swapping is one line, MARK_DEFAULT_OPTION in brand/mark-option.ts. markGeometry(option, { px }) and logoGeometry({ option, layout }) are the pure data the favicon, the 3D tidy pose and the logo pack read.

Example#

Usage#

Use the mark wherever MAKR Labs signs something and space is square or tight: the favicon, an avatar, the footer map, a loader. Where there is room for the name, use a Logo lockup. The full rules, every size and every option are on the mark page.

• Sizes. 16, 24, 32, 48, 64 and 128 px are the drawn sizes. Up to 32 px every edge lands on a whole pixel; from 48 px the letters print on the squares.
• Lit lines. lit inks only the lines a page is about; the others print as 2 px outlines, so the meaning never rests on colour alone. The footer map uses it per column.
• One ink. mono prints every square in the plate's text ink, parted by paper seams, for single-colour work.
• Name. It is a named image ("MAKR Labs"); inside a Logo it is hidden and the lockup carries the name.

Anatomy#

Volume#

The mark never changes with the volume. Its inks are Process in every colourway too (D-N73): a recoloured mark is a misuse.

• Quiet

  Docs, forms, legal and long reads. Flat inks, no art in motion.

• Studio

  The site default. Art on its own plates, one display moment per view.

• Press

  Hero moments, covers and campaigns. Halftone fields and the second ink.

• Rave

  Launches, posters and the 404. Every ink, and the words still win.

Content#

• The name is "MAKR Labs". The mark never stands in for a letter in a word.

Do and don't#

Accessibility#

• A named image ("MAKR Labs"); inside Logo it is hidden and the link carries the name.
• Unlit lines print as 2 px outlines, so lit lines never rest on colour alone.
• The inks stay Process whatever the page's colourway (a recoloured mark is a misuse); K takes the plate's text ink.

Props#

Tokens#

Changelog#