Brand

The reference for how ITSM Ltd looks, sounds and behaves. Every value below is drawn from the shared token system. Nothing here is decorative.

Identity

Built to hold.

The quiet company behind the work.

ITSM Ltd holds five ventures to one standard. It does not shout for any of them. The brand reduces to a slab and a keyline. Disciplined silence does the rest.

Voice

  • British English. Sentences under twelve words.
  • Declarative and evidence-led, never promotional.
  • No exclamation marks, no hype adjectives, no emoji.
  • The full stop in Keyline Blue ends a key statement, used sparingly.

Do

"Five ventures. One standard."

Don't

"We're revolutionising IT forever — join the journey!"

Colour

Five colours, no exceptions. No gradients, no shadows, no blur.

  • Carbon

    Display type. The slab.

    19.06:1 vs Gallery

  • Graphite

    Body text.

    10.2:1 vs Gallery

  • Keyline

    The single accent. One moment per page.

    4.95:1 vs Gallery

  • Gallery

    Background.

    19.06:1 vs Carbon

  • Hairline

    Rules and borders.

    Rule colour. Not used for text.

Type

Display

Portfolio. Governance. Stewardship.

font-family: var(--font-display);
font-weight: 300;
text-transform: uppercase;
letter-spacing: 0.12em;
text-wrap: balance;

Heading

Five ventures, one standard.

font-family: var(--font-heading);
font-weight: 600;

Body

Space Grotesk as body type is an editorial choice. Technical warmth against Archivo's cold precision. Long-form pieces drop to 15px with 1.75 leading. 

font-family: var(--font-body);
font-weight: 400;
font-size: 16px;
line-height: 1.7;

Layout & motion

Grid

12 columns · 1120px max-width · section gaps of 96px or more

Spacing scale

  • --space-1 — 4px
  • --space-2 — 8px
  • --space-3 — 16px
  • --space-4 — 24px
  • --space-5 — 40px
  • --space-6 — 64px
  • --space-7 — 96px
  • --space-8 — 144px

Motion

Motion Duration Easing Notes
Keyline draw 900ms cubic-bezier(.25, 1, .5, 1) Once per view, on scroll into view.
Underline grow 300ms ease Link hover and focus.
Hover fade 300ms ease Background or opacity shift. No elevation.
  • Nothing loops. Nothing exceeds 900ms.
  • No animation runs on keyboard actions.
  • Reduced motion shows every end-state instantly, with no transform.

Scroll this mark into view to see the keyline draw once. With reduced motion requested, it appears already drawn.

Accessibility

WCAG 2.1 AA is the minimum everywhere, not a target.

Commitments

  • Contrast: Carbon on Gallery 19.06:1, Graphite on Gallery 10.2:1, Keyline on Gallery 4.95:1.
  • Focus: every interactive element shows a 3px Keyline outline, offset by 2px.
  • Keyboard: every interaction works without a pointer.
  • Reduced motion: every animation resolves to its end-state instantly on request.
  • Semantic HTML: one h1 per page, headings in order, landmarks named.
  • Touch targets: interactive elements measure at least 44px.
  • Imagery: decorative marks carry aria-hidden; meaningful images carry alt text.

Focus state

Press Tab to move keyboard focus here and see the outline.

Downloads

Source files for the logo system, exported at production sizes.

Logos (SVG)

PNG exports

Favicons