Brand
The Roadmark brand, in use.
The mark, the AI mark, colour, type and the parts every page is built from. This page is drawn with the site's own styles, so what you see here is what the site uses.
The mark
Two corners frame the record.
- Built on 64 units. Two opposite corners, 27 long and 7 thick, and a solid record 18 square at 23, 23. The corners frame one thing: the load, the quote, the invoice.
- Below 20 px, use the small files. The favicons are redrawn on 16 and 32 px grids, not scaled down.
- Ink on light, Chalk on dark. The mark is one colour. It turns Pencil only as the AI mark.
- The word is "roadmark", lowercase, in Archivo Bold at 112% width. Never "Roadmark AI" or "Roadmark TMS" beside the mark: the descriptor belongs in the headline.
- Don't rotate it, outline it, put it in a circle or fill it with a gradient.
- Don't let a partner's mark stand larger than it.
- Don't put the mark on a busy photograph without a dark scrim.
- roadmarkPaper
- roadmarkChalk
- roadmarkCarbon
roadmarkOn a photograph, with a scrim
Pencil and ink
What an agent drafts is drawn in Pencil. What a person keeps is ink.
The AI mark is the mark with its record left open: the frame is there, but nobody has filled it yet. It sits beside agent names and on drafts, and it goes when a person approves the work.
J. Parkapproves and sends
- Pencil is for machine work only: agent names, drafted lines, the AI mark, and the Roadmark connector's chip inside Claude, ChatGPT and Gemini.
- Solid Pencil, never a gradient, and never on a button, a background or a word in a headline.
- No sparkles, no robots. The AI mark replaces them everywhere, including the AI assistants page.
- Under 20 px, use the 16 px AI mark. Use Pencil #7047ED on both light and dark surfaces.
Colour
Mostly Paper and Chalk, framed in Carbon, with a little Sodium.
The bar shows roughly how much of a page each colour covers. Pencil appears only where an agent did the work. Corten appears only on the tape and on freight or money on the wrong side of its clock.
Approximate share of a typical page.
Frame and ground
- Carbon
--carbon · #0C0D0FNav, hero, one dark band, closing offer, footer - Carbon 2
--carbon-2 · #16181CA raised surface on Carbon - Paper
--paper · #FFFFFFMost sections and every plate - Chalk
--chalk · #F3F4F2Alternating sections; text on Carbon - Chalk 2
--chalk-2 · #E9EAE6Quiet fills inside plates
Text
- Ink
--ink · #0C0D0FHeadlines and body - Ink 2
--ink-2 · #3F444CSecondary text; the lightest for reading - Ink 3
--ink-3 · #5A6069Labels and captions - Rule
--rule · #DCDEDAHairlines and borders
Accents
- Sodium
--sodium · #E8A33ASmall highlights; ticks and bullets on Carbon - Sodium dark
--sodium-d · #8A5A10Kickers and warnings as text on light - Corten
--corten · #B34A28The tape; freight past its clock; money being charged - Good
--good · #2E7D5BSent, on time, matched
AI only
- Pencil
--pencil · #7047EDAgent names, drafts, the AI mark - Pencil
--pencil-l · #7047EDSame Pencil #7047ED on Carbon - Pencil wash
--pencil-wash · #F3F0FEBehind a drafted line
Text that passes, and two pairs that never do
- AaInk on Paper19.4 : 1
- AaInk 2 on Chalk8.9 : 1
- AaInk 3 on Chalk5.7 : 1
- AaSodium dark on Paper5.9 : 1
- AaPencil on Paper5.5 : 1
- AaCorten on Paper5.3 : 1
- AaChalk on Carbon17.6 : 1
- AaOn dark 2 on Carbon12.2 : 1
- AaSodium on Carbon9.0 : 1
- AaPencil on Carbon3.5 : 1 · never as text
- AaSodium on Paper2.2 : 1 · never as text
- AaPencil on Paper5.5 : 1
Ratios are computed from the colours above. Text needs at least 4.5 : 1.
Type
Archivo, widened for headlines, normal width for reading.
One typeface. Its width axis carries the headlines; Martian Mono appears only for numbers people read out.
100% bodyroadmark112% H2roadmark118% displayroadmark
- Display40–82 px · 118% · −0.04em · 0.98
- Agents do the first pass. You make the call.
- H231–50 px · 112% · −0.035em
- Seven agents pass one load between them.
- H324 px · 100%
- Build the truck in stop order
- Lede19–22 px · Ink 2
- Roadmark reads the email, prices the lane from your own history, and leaves a quote for you to send.
- Body18 px · 1.6 · the minimum for reading
- Detention on 48213 was added from the driver's arrival and departure times, so it's on the invoice before anyone looks at the back of the BOL.
- Kicker15 px · 600 · sentence case
- Cross-dock
- NumbersMartian Mono, only for load, quote, trailer and seal numbers
- 48213 · Q-20931 · INV-10442 · TRL 5317
Parts
The few parts every page is built from.
These are the site's own components, not pictures of them.
- Buttons on light: full pills, 50 px tall
One dark button per section. The outline button is the second choice.
- Buttons on Carbon
Chalk fills on dark. The nav uses the same pill at 42 px.
- Chips, 6 px corners53' dry vanSentNeeds a personQuoting agent
Chips state a fact. The AI tag names the agent that drafted the thing beside it.
- Kicker and text linkBilling and settlementsSee how the three-way match works
A kicker names the section in plain words, never a slogan or a label in capitals.
- Plate: a drawn picture of the workLoad 48213DeliveredLinehaul$3,655.00Fuel surcharge$560.00Detention, 1 h 20 m$100.00Invoice INV-10442$4,315.00
White, 18 px corners, one soft shadow. Figures are specific and add up.
- Works in Claude, ChatGPT and GeminiWorks in
ClaudeChatGPT
GeminiAlso Microsoft Copilot, and any other assistant that supports MCP.
The three logos, large and in colour, on Carbon. The others are named underneath, in words.
- Conspicuity tape
Only on the bottom edge of the hero and the closing offer, and the top of phone screens.
Logo files
Mark, CarbonOn Paper, Chalk and other light groundsDownload SVG · 347 bytes
Mark, ChalkOn Carbon and other dark groundsDownload SVG · 347 bytes
Mark, whiteOn a photograph, over a dark scrimDownload SVG · 347 bytes
AI mark, PencilBeside an agent's name on lightDownload SVG · 401 bytes
AI mark, PencilBeside an agent's name on CarbonDownload SVG · 412 bytes
App iconSquare with rounded corners, for app stores and directoriesDownload SVG · 458 bytes
Need the mark with the word, for print or a partner page? Ask hello@roadmark.ai and we'll send the lockup with the word outlined.
Writing about Roadmark?
Press, analysts and partners can reach a person through the contact page. We'll send the files, the facts and someone to talk to.