Late, then paid.
The whole brand is one idea: an invoice that is late becomes one that is paid. The wordmark says it in two colours, and the product uses the same two colours to mean the same two things. Everything below follows from that.
Logo files
Every file is outlined artwork, so it looks the same everywhere with no font installed. Use SVG wherever you can; the PNGs are for places that will not take one, and have transparent backgrounds.
Colours mean things
Every colour here has a job, and in a receivables product the job is a claim about money. Use a colour only when you mean what it says. Contrast figures are against paper, #F6F4EE.
Paid green
Money in. Recovered, paid, kept, verified. Also the tile, and every primary action, because every primary action moves a debt from late towards paid.
Late red
Trouble, and only trouble: disputed, breached, broken, recalled, lapsed. Never a fill, a flourish or a highlight. If nothing is wrong, nothing is red.
Amber
Waiting. Pending, awaiting a signature, listed, expiring soon. Nothing is wrong yet, but someone owes a decision.
Blue
In flight. Placed, in progress, being worked. A neutral state that is moving.
Mint
The letters in the tile. A highlight on green and on dark grounds, and "paid" in the on-dark logo. Too light for text on paper.
Ink
Text, and the dark ground. A green-black pulled from the tile rather than a neutral black.
Paper
The ground everything sits on. Warm cream, not white, so a page reads as a document rather than a screen.
Late and paid, on dark
The wordmark's two colours lifted for ink grounds: 5.0:1 and 7.3:1 on #10251B. For the logo, not for interface colour.
Three faces, three jobs
All three are free on Google Fonts. The wordmark is drawn in Unbounded, so headlines echo the logo without repeating it.
Unbounded
Display. Page titles and section heads (h1, h2) only. ExtraBold and Bold, tight tracking.
Plus Jakarta Sans
Everything you read: interface, body copy, buttons, forms, smaller headings.
DM Mono
Figures, references and dates, so columns of money line up. Also small uppercase labels.
Give it room
Measure clear space in tiles, not millimetres, so it scales with the logo.
Clear space
Keep a margin of half the tile's height clear on every side. No text, edges, or other marks inside it.
Minimum size
- Full lockup: 22 px tall on screen, 7 mm in print. Below that "late" and "paid" stop reading as two words.
- Stacked: 48 px tall on screen, 15 mm in print.
- Tile alone: 16 px on screen (favicon), 5 mm in print.
Do and don't
Short list. Most mistakes come from treating the logo as type or the colours as decoration.
Use the file
Place the SVG or PNG from this page. Scale it proportionally and leave it alone.
Pick the variant for the ground
Primary on light, on-dark on dark, one-colour white on photographs, one-colour black for single-ink print.
Recolour the tile
The tile is always paid green with mint letters, or a single colour in the one-colour files. Never a campaign colour.
Type "latepaid" in a live font
Not in Unbounded, not in anything. The wordmark is drawn, kerned and outlined. In running text, write the name as LatePaid.
Use red as decoration
Red means something is wrong with money. A red button, banner or illustration tells the reader a debt is in trouble.
Stretch, tilt or decorate it
No distortion, rotation, outlines, shadows or glows, and don't separate the tile from the word to make a new lockup.