Brand

Logo and glyph#

• 
  LogoGlyph and wordmark on dark backgrounds

  SVG
• 
  Logo, on lightGlyph and wordmark on light backgrounds

  SVG
• 
  App iconOn its own tile, for avatars

  SVG
• 
  GlyphFor dark backgrounds

  SVG
• 
  Glyph, on lightFor light backgrounds

  SVG

The glyph is a jack with a patch cable leaving it. The wordmark is patchbay in lowercase; in running text the name is written Patchbay.

Usage#

• White on dark backgrounds, black on light ones. No other colours, gradients, outlines, shadows or effects.
• Keep clear space around the logo of at least half the glyph’s height, and don’t stretch or rotate it.
• Smallest sizes: the glyph at 16 px, the full logo at 20 px tall.
• Use the app icon where a square avatar is needed, and the logo everywhere else.
• Don’t combine the glyph with other marks or use it for another product.

Colours#

The interface is monochrome. Colour comes only from content: each module has one cable colour, used for its cable, its LEDs and its dot, and nowhere else.

Interface#

• InkBackground
  #0a0a0a
• PlateFaceplates, panels
  #151515
• LineBorders and rules
  #222222
• PaperText, primary buttons, the logo
  #f4f4f4
• GreyBody text
  #b4b4b4
• DimCaptions
  #8a8a8a

Cables#

• Dynamic feeIts cable, LEDs and dot
  #ff6b3d
• TWAP oracleIts cable, LEDs and dot
  #4cc38a
• Limit orderIts cable, LEDs and dot
  #7d9dff
• LockupIts cable, LEDs and dot
  #b48cff
• Your moduleAny third-party module
  #f2c94c

Type#

• Geist for everything. Headings at weight 600 with tight tracking (−3.5% to −4%); body at 400.
• Geist Mono for numbers, hex bytes and addresses only.
• Space Grotesk 600 for the ticker, $PATCH.

Voice#

• Calm, exact, short sentences. Explain the mechanism; skip the adjectives.
• Numbers are real, or labelled as an example pool.