Every value here is read from the live site, not invented for this document.
If the site changes, this is wrong and should be re-cut.
It is type, not a drawing
The mark is the word LAYBACK set in Alan Sans ExtraBold, uppercase.
There is no symbol, no monogram and no icon-only lockup.
The name is the mark.
On the site it is live text.
The files below are that same setting converted to outlines, so nobody needs the font installed to open them.
Headlines take −12, the hero caption −15, and Alan Sans set small runs looser at −5 so the letters do not close up.
Never re-set the word by hand.
Use the files.
84px on screen, 21mm in print.
Below that the A and the K close up.
Half a cap height, all the way round
Measure the cap height of the mark, halve it, and keep that much space clear on every side.
It scales with the mark, so there is one rule instead of a table of values.
Nothing sits inside the box: not a strapline, not a client mark, not an edge.
Four things that break it
The mark carries no effects of its own.
If it is hard to read on a background, change the background or use the reversed file.
Do not add a shadow, a box or a glow.
Scale both axes together.
The mark sits on the horizontal.
Use white on a scrim.
Download the wordmark
Four colourways, each as vector and as a 2000px transparent PNG.
Use the SVG wherever you can.
It is 2 KB and sharp at any size.
The PNG is only for tools that will not take one.
Files open in a new tab.
Right-click and Save to keep one.
Hosted on the Layback Webflow CDN, so these links are stable and safe to share.
The mark, cut down to 16 pixels
LB, flush left, anchored low.
Cut from the same Alan Sans file the site loads, so it is the wordmark and not a redraw.
Amber on navy for light browser chrome.
Navy on amber for dark.
The colours swap.
The drawing does not.
Webflow takes two of these.
Site settings, General, then Favicon and Webclip.
Use the 32px PNG and the 256px webclip.
Navy holds the page.
Amber means act.
Two colours do nearly all the work.
Navy is the ground almost everywhere; the site has no light sections at all.
Amber is for the wordmark and for anything a visitor can press.
If amber appears on something that is not the mark and not interactive, it is wrong.
Click any value to copy it.
Page, sections and footer all sit on this.Amber#F0A03CThe wordmark and the buttons.
Nothing else.Amber light#FFB857Hover only.
Never a resting state.Black#0B111FBehind film.
Also the foot of a caption gradient.Navy lift#22355CA panel one step off the ground.
Used sparingly.Focus blue#56B8DDKeyboard focus rings and input borders.
Never decorative.
White, at four strengths
There is no grey in this palette.
Every step below the headline is white at a set opacity over navy.
That is what keeps the page feeling like one material.
Two faces, one job each
Display only: the wordmark, headlines and section titles.
Always uppercase, always 800.
Never used for running text.
Everything else: body copy, labels, buttons and form fields.
Three weights are in use: Regular, Medium and SemiBold.
The scale, as it is actually set
Nothing here is a fixed point size.
Every step is measured against one body size, so the whole page scales together.
Tracking is given in Premiere and After Effects units, so you can type the number straight into the character panel.
A minus number pulls the letters together.
A plus pushes them apart.
Video production.
Start to finish.
Get in touch
Elite rowers turned filmmakers, we are passionate about storytelling.
A London-based production partner for brands that want premium-quality video and stills, without the overheads of a huge agency.
Selected work
The same table, for whoever builds with it
One size sets everything
One base size sits behind the whole page.
It grows with the screen: 16px on a phone, 30px on a big display.
Every other size is a multiple of it.
Change that one number and the entire site resizes in proportion.
In the stylesheet: font-size: clamp(16px, 0.4916vw + 11.12px, 30px) on the root.
The short version
The site has no light sections.
A white panel would be the loudest thing on it.
Never ordinary copy.
Never amber on picture.
Body copy is sentence case, and stays that way.
Fully round where the shape is the point, which is the hero call to action and the social icons.
Input edges sit brighter, 22 to 26%, and validation borders carry their own colour.
“Video production. Start to finish.”
Not “bespoke visual storytelling solutions”.
Values read from the production stylesheet, September 2026.
The wordmark files were cut from Alan Sans ExtraBold at the site's own tracking.
They are not a redraw.
Layback Media · London · seb@layback.media · layback.media