The xRep brand
One idea runs through all of it: presence. xRep puts a rep who is actually there on your site, so the mark carries a live-dot, the accent only ever marks what is live, and even the loader reads as someone coming online.
Logo
The X with a live-dot on its upper arm. The dot is the only place the accent appears, so the eye lands on 'live'.
Brand
On light surfaces
Mono
Print, single-colour
Inverse
On dark grounds
Mark only
Never below 20px
Wordmark
Where the mark already appears
With attribution
Footers, decks
Colour
Indigo carries the brand. Cyan is an accent, not a colour - if more than one thing on screen is cyan, something is wrong.
Indigo
#4F46E5
Primary. Buttons, links, the logo mark.
Indigo Light
#6366F1
Hover and raised states.
Cyan
#22D3EE
Accent. The live-dot, active signals. Use sparingly.
Blue
#2563EB
Marketing primary on the product site.
Ink
#08090D
Text and dark grounds.
Slate
#64748B
Secondary text, captions.
Paper
#FFFFFF
Light ground.
Typography
Geist for the product site, Inter for the app, Geist Mono for anything numeric.
Geist
Display - marketing headlines
Inter
Body - app UI and prose
Geist Mono
Mono - metrics, IDs, data
Loading
Loading is presence, not delay: an accent arc sweeps the mark while the live-dot breathes. Motion is CSS-driven, so it disables itself under prefers-reduced-motion.
Spinner
Buttons, rows
Loader
Panels, cards
Waking xRep AI up
Waking xRep AI upWith caption
Route-level
Assets
Every asset lives at a real URL. Link them directly - do not re-draw the mark.
| Asset | URL | Use |
|---|---|---|
| Mark (SVG) | /brand/xrep-mark.svg | Square. Avatar, app icon, favicon source. |
| Logo lockup (SVG) | /brand/xrep-logo.svg | Mark + wordmark + attribution. |
| Logo mono (SVG) | /brand/xrep-logo-mono.svg | Single colour. Inherits currentColor. |
| Favicon (SVG) | /icon.svg | Browser tab icon. |
| Social card (PNG) | /opengraph-image | 1200x630, generated. Used by OG + Twitter. |
Absolute URLs resolve against https://xrepai.com (set in lib/brand.ts).