Skip to content

Our logo is an L made of two soft blocks that meet on one smooth step. It is simple enough to work at the size of a favicon, and it carries the two ideas behind Lathly: careful craft, and progress you can see, step by step.

Clear at every size.

On its own, the stepped L is our app icon, avatar and favicon. It stays recognisable from a billboard down to a browser tab.

Two blocks, one step.

Everything is drawn on one grid: blocks 100 units wide, outer corners rounded at 34, and the step joined with a 24-unit curve.
THE STEP · R24CORNERS · R34STEMFOOT100100
  1. 1

    Two blocksCraft

    A tall stem and a wide foot, both with the same soft corners. Simple shapes, made carefully.

  2. 2

    One stepProcess

    The blocks meet on a single smooth step. That is how we build: one step at a time, never a leap in the dark.

  3. 3

    A real partLathe

    Trace the outline and you have the profile of a stepped shaft — the most typical part a lathe makes.

The rest of the name is set in Geist SemiBold, tightened slightly and turned into outlines, so the logo looks the same everywhere and never depends on a font being installed.

Spin the L and it becomes real.

Turn the letter a full circle around its left edge and you get an actual machined part. Drag it to turn it yourself.

The same outline as the logo, turned the way it would be on a real lathe. The stem becomes a shaft, the foot becomes a flange, and the step between them is the shoulder a machinist would cut.

Turned a full circle

Four neutrals, one signal.

The logo is always one colour — ink, or paper on dark. Orange is kept for the one thing that matters most on a page.

#0D0D0C

Ink

The logo and all type

#ECEBE5

Paper

Backgrounds

#FF5A1F

Signal

The one accent: the next step, the button to press

#0B0B0A

Shop

Dark surfaces and the app icon

#64635D

Steel

Secondary text

Clear space

Keep space the width of the stem on every side of the logo.

Small sizes

Below 80 px wide, use the symbol on its own. It stays clear down to 12 px.

Don't

  • — Stretch, tilt or outline the logo
  • — Put it in orange on a busy photo
  • — Rebuild "athly" in another font
  • — Add effects, shadows or gradients

Take it with you.

Vector files that stay sharp at any size — for a deck, a press feature or a sign above the door.
lathly-logo.svgLogoFor light backgroundslathly-logo-light.svgLogo, lightFor dark backgroundslathly-mark.svgMarkThe L on its ownlathly-mark-light.svgMark, lightFor dark backgroundslathly-app-icon.svgApp iconDark rounded tilelathly-app-icon-signal.svgApp icon, orangeFor launches and stickers