Plotwork brand kit

The logo, the animated logo and the colours of Plotwork, diagrams for ai agents.
The latest kit is always at https://plotwork.dev/brand

WHAT IS IN IT

logo/       The mark, the horizontal lockup and the stacked lockup, each as SVG and as PNG
            at 512, 1024 and 2048 pixels wide, with transparent backgrounds.
            on-light: ink and teal, for a light background.
            on-dark:  near-white and light teal, for a dark background.
            black, white: one colour, for print and for places that allow one colour.
animated/   The mark drawing itself, as an animated SVG (still when reduced motion is on),
            a GIF and a WebM video, each for a light and a dark background.
favicon/    The favicon the sites serve. It switches tone with the light or dark setting.
colours/    The palette as CSS variables, design tokens (JSON) and Adobe swatches (ASE).

USING THE LOGO

  Do: Use the files as they are, in the tone made for the background they sit on.
  Do: Keep the clear space round the logo: half the height of one box of the mark on every side. Every file already carries it.
  Do: Use the mark alone where space is tight, such as an avatar or a favicon.
  Do: Write the name as Plotwork in running text. PLOTWORK in capitals is the wordmark, not a spelling.
  Do not recolour the logo, or swap the teal for another colour.
  Do not stretch, squash, rotate or redraw it.
  Do not add shadows, glows, outlines or other effects.
  Do not put it on a busy picture or a background without enough contrast.
  Do not use it in a way that suggests Plotwork made, sponsors or endorses your product.

Clear space: 5 of the mark's 32 units, which is half the height of one box.
Smallest size: the mark 20 px wide, the horizontal lockup 112 px, the stacked lockup 64 px.

COLOURS

Brand: The teal is an accent: the second box of the mark, focus rings and links. It is never the colour of a button.
  Teal         #0f766e  rgb(15, 118, 110)  --brand-100
  Deep teal    #115e59  rgb(17, 94, 89)  --brand-hover
  Light teal   #2dd4bf  rgb(45, 212, 191)  --brand-text (dark)

Ink and paper: Near-black and near-white carry the lines of the mark and almost every pixel of the product.
  Ink          #171717  rgb(23, 23, 23)  --text-primary
  Graphite     #525252  rgb(82, 82, 82)  --text-secondary
  Paper        #f9f9f9  rgb(249, 249, 249)  --surface-body
  Snow         #fafafa  rgb(250, 250, 250)  --text-primary (dark)
  Night        #0a0a0a  rgb(10, 10, 10)  --surface-body (dark)
  Code ink     #0f1412  rgb(15, 20, 18)  --ink-ground

Chart accents: A closed set for charts, tags and status. Never use one as a brand colour.
  Crimson      #eb3424  rgb(235, 52, 36)  --accent-crimson
  Honey        #b07d0a  rgb(176, 125, 10)  --accent-honey
  Forest       #1f8f4d  rgb(31, 143, 77)  --accent-forest
  Bluetron     #2a6dfb  rgb(42, 109, 251)  --accent-bluetron
  Amethyst     #7c4dff  rgb(124, 77, 255)  --accent-amethyst

TYPE

The kit does not include font files. Each family is free under its licence; get it from the official source.

  IBM Plex Sans (400, 500, 600): Headings and running text on the site, the docs and the portal.
    https://fonts.google.com/specimen/IBM+Plex+Sans
    SIL Open Font License 1.1: https://openfontlicense.org/open-font-license-official-text/
  IBM Plex Mono (400, 500, 600): The wordmark (SemiBold, tracked 8 percent), labels, eyebrows and code.
    https://fonts.google.com/specimen/IBM+Plex+Mono
    SIL Open Font License 1.1: https://openfontlicense.org/open-font-license-official-text/
  Inter (400, 500, 600): The labels inside every diagram the engine draws.
    https://fonts.google.com/specimen/Inter
    SIL Open Font License 1.1: https://openfontlicense.org/open-font-license-official-text/

TRADEMARKS

The Plotwork name and logo belong to Buun Group Pty Ltd. You may use these files to refer to Plotwork,
for example in an article, a talk or a list of integrations. The full policy, including how Plotwork uses other companies' marks:
https://docs.plotwork.dev/trademarks-and-icons

Press and permission questions: legal@buungroup.com
