Creative Yadley Design System
Sections

Logo

The Creative Yadley emblem and live wordmark, with theme pairing, sizing and clear space.

Creative Yadley
Dark surface
Creative Yadley
Light surface

Composition

  • Emblem + wordmark (+ optional tagline) laid out horizontally.
  • The wordmark is real text in Plus Jakarta Sans: 700 in application chrome (rail), 600 in documents (invoice, quote, billing note, PDF).
  • Letter-spacing -0.02em in the rail, -0.005em in documents.
  • The tagline is Big Ideas. Beautifully Built. — optional, never on its own without the wordmark, and never at a weight above 600.
  • Emblem and text block are optically centred on the same horizontal axis. A logo that sits high or low against its wordmark is a defect, not a style.

Theme pairing

SurfaceFileArtwork
Dark (obsidian)logo-on-dark.pnglight-grey emblem, transparent ground
Light (warm architectural)logo-on-light.pngdark emblem on white

Both files ship in every product. The theme selects between them with [data-cy-theme="light"]; never ship a single hard-coded logo file, and never paint a logo onto a white plate to make it survive a dark background.

Minimum sizes

  • Emblem in application chrome: 44px (rail expanded and collapsed).
  • Emblem in documents: 48px.
  • Emblem in email: 40px.
  • Never render the emblem below 24px.
  • Favicon and app icons use Favicon.svg, never a crop of a lockup.

Clear space

Keep free space of at least the emblem's height ÷ 2 on all sides, and at least one word-space between the emblem and the wordmark.

Do not

  • Stretch, skew, rotate, recolour, outline, drop-shadow or animate the emblem.
  • Put the emblem on a white disc so it survives a dark background — use logo-on-dark.
  • Typeset the company name in anything but Plus Jakarta Sans.
  • Use the tagline without the name, or above 600 weight.
  • Render the name as an image "to match the design".
  • Replace the emblem with an icon (a ph-* glyph is not the logo).