Brand Assets

Category: identity Sources: production Trace logo assets and approved website build Confidence: high Last Updated: 2026-08-10


Core colours

  • Trace Yellow: #F1F252
  • Trace Ink: #1D1D1F
  • White: #FFFFFF

Do not recolour the marks outside this set.

Website mark

The website navigation uses the typeset Trace Technical wordmark: Trace in the heavier weight and Technical in the regular weight. It stays as live text in the navigation for accessibility and responsive control.

The favicon is the black tile with the white Guiding Progress mark. The scalable master plus the full raster export set (favicon-16/32/48/180/192/512, apple-touch-icon and favicon.png) live in brand-wiki/assets/logo-assets/web/:

brand-wiki/assets/logo-assets/web/favicon.svg

Use the compact tile for browser, app and small-avatar contexts. Do not force a wordmark into icon sizes.

Guiding Progress mark

The Guiding Progress mark is Trace's only standalone symbol. Use the white mark on black or other sufficiently dark brand surfaces, and the black mark on white. Trace Yellow remains available for deliberate accent applications rather than as the default mark colour.

Source files:

  • icon-only mark (black, white, yellow) in brand-wiki/assets/logo-assets/icon_only/
  • compact background tiles in brand-wiki/assets/logo-assets/icon_background/Compact/
  • expanded Guiding Progress tiles in brand-wiki/assets/logo-assets/icon_background/Expanded/

Use SVG for web and scalable digital work. Use PNG only where SVG is unsupported.

Wordmark and signature lockup

The production wordmark reads Trace Technical, matching the live website. Trace is heavier than Technical.

  • primary wordmark: brand-wiki/assets/logo-assets/wordmark/
  • signature wordmark with the Guiding Progress mark at the end: brand-wiki/assets/logo-assets/signature-lockup/

The mark trails the wordmark because it reads as direction and resolved next action. Use the wordmark-only version for navigation, document headers and quiet identification. Use the signature lockup for report covers, LinkedIn carousel covers and end cards, social graphics and other deliberate brand moments.

SVG masters contain outlined letterforms and have no font dependency. PNG exports use transparent backgrounds. These assets supersede the old Trace-only lockups, which are no longer part of the production library.

The website uses Inter. The website type system is documented in Visual Identity and Website.

Social preview

Default website social asset:

  • brand-wiki/assets/logo-assets/web/trace-social-preview.svg
  • brand-wiki/assets/logo-assets/web/trace-social-preview.png

Use the 1200 by 630 PNG for Open Graph and social sharing.

Usage rules

  • preserve the original aspect ratio
  • maintain clear space equal to at least one quarter of the mark width
  • keep the mark flat
  • do not add gradients, shadows, outlines, glow, bevels or textures
  • do not stretch, rotate, crop or animate the mark
  • do not combine the favicon tile and a full lockup in the same small composition
  • do not move the Guiding Progress mark to the left inside the signature lockup
  • do not close up the designed gap between Technical and the mark
  • choose the mark appropriate to the available space instead of shrinking a full lockup below legibility

Minimum practical sizes:

  • favicon tile: 16px
  • icon-only mark: 16px
  • primary wordmark: 120px wide
  • signature lockup: 150px wide

Related Articles