Materially smarter
construction.
The brand and design system for Nexus ReGen — the UK's materials management platform for construction. One place to plan, source, move and prove every material on every project.
Four rules we design around.
The product is construction-native and proof-led. The brand reads the same — calm, credible, and built for people who need the answer now.
Our marks.
Three marks carry Nexus ReGen: the arrow emblem, the NR lockup, and the full wordmark. Each has a job — and a surface it belongs on.
The family
Anatomy
The outer L-bracket is a site boundary — where the material comes from. The inner chevron cuts up and to the right through that boundary: material moving out, moving up, moving on to its next useful life.
The NR monogram sits to the right as a logotype — a custom draw of "N" and "R" with the same chunky stroke as the arrow.
Clear space
Emblem variants
NR lockup variants
Primary wordmark variants
Clearspace
- Minimum clearspace = 0.5 × the emblem height on every edge
- Inside this clearspace: no other graphics, type, or photographic content
- Increase clearspace generously when the mark sits near a page edge or content with high visual weight
- This rule applies to all logo variants (emblem, NR lockup, full wordmark)
Minimum size
Web minimum: 24 px Print minimum: 8 mm Favicon (16px): use favicon-thick-yellow / favicon-thick-blue
Do & don't
Minimum sizes
Penn Blue, Aureolin, and a lot of white space.
A two-colour identity with a neutral engine. Navy carries authority, yellow signals action. Everything else is there to let those two breathe.
Core palette
Extended accents
Colour scales
Semantic colours
Approved pairings
The 60·30·10 rule
Inter, set tight.
One family, nine scale steps, three weights in active rotation. We use display sizes sparingly and let dense body copy do the real work of explaining material flows, compliance detail and the numbers behind the claim.
Family
Weights in rotation
Scale
Type scale
.t-display .t-h2 .t-h3 .t-body .t-body-sm .t-caption .t-eyebrow .t-mono Typographic voice
problem we solve.
Nexus ReGen gives construction teams one place to plan, source, move and prove every material on every project. When a load of crushed concrete leaves Site A at 08:42 and arrives at Site B at 11:17, weighing 28.4t, that's what the ledger reads — and that's what the audit shows. Clients save 26% on average.
Hard rules
- Display sizes (30px+) never go below 600 weight.
- Body text runs 400 or 500. Never 300 below 18px — it disappears.
- All numbers in tables and data displays use
font-variant-numeric: tabular-nums. - Don't track out all-caps labels beyond
0.12em. - Max measure for paragraphs: 72 characters. Use
text-wrap: pretty. - Never italicise Inter — we use weight or colour for emphasis instead.
Spacing, radius, elevation.
A strict 4-point grid. Two radius defaults (8 and 12). A six-step shadow ramp. Everything composable, everything token-named.
Spacing scale
When to use which step
--s-1 --s-2 --s-3 --s-4 --s-5 --s-6 --s-8 --s-10 --s-12 --s-16 --s-20 --s-24 Layout grid
Radius
Elevation
Motion
Lucide, 24px, 2px stroke.
One icon library across the whole system. Sharp corners (no line-join rounding), 2px stroke, 24px canvas. For key concepts — arrow, truck, scale, shield — we draw bespoke versions that echo the emblem's L-bracket geometry.
Icon library
lucide-react.
The de-facto open-source set; predominant import in the nexus4 product code.
Some product surfaces also use @untitledui/icons via the Untitled UI components — confirm with the lead engineer before locking in for new work. pnpm add lucide-reactstrokeWidth={1.5} — matches the system's drawn weight.
currentColor — never hardcode a hex; the icon recolours via parent text colour.
import { ArrowUpRight, Truck, Shield } from 'lucide-react';
// Inline with text (16px), inherits colour
<span className="text-brand-600">
<ArrowUpRight size={16} strokeWidth={1.5} /> View report
</span>
// Standalone (24px) on a button
<button className="icon-btn">
<Shield size={24} strokeWidth={1.5} aria-hidden />
</button>
System icons
Sizes
Brand marks
The kit.
The building blocks that ship in every Nexus ReGen product. Lean, accessible, built on Untitled UI primitives with our tokens baked in.
Buttons
Inputs
Badges & status
Cards
Data table
| Ref | Material | From | To | Weight | Status |
|---|---|---|---|---|---|
| NR-04182-A | Crushed concrete 6F2 | Newcastle Quays | Gateshead Link | 28.4t | Delivered |
| NR-04182-B | Asphalt planings | A1 Western | Hexham Depot | 24.1t | In transit |
| NR-04182-C | Topsoil, class A | Sage Gateshead | Stockton Plot | 18.9t | Queued |
| NR-04182-D | Recycled aggregate | Tyne Yard 4 | Jarrow East | 31.2t | Delivered |
Alerts
The system, applied.
How the tokens, type and components come together on real surfaces — marketing, product and document output.
Marketing hero
Plan, source, move and prove your materials — all in one platform.
Nexus ReGen is the UK's materials management platform for construction. Save 26% on materials costs while becoming audit-ready by default.
Product dashboard
Good afternoon, Jonathan.
| Ref | Material | From | To | Weight | Status |
|---|---|---|---|---|---|
| NR-04182-A | Crushed concrete 6F2 | Newcastle Quays | Gateshead Link | 28.4t | Delivered |
| NR-04182-B | Asphalt planings | A1 Western | Hexham Depot | 24.1t | In transit |
| NR-04182-C | Topsoil, class A | Sage Gateshead | Stockton Plot | 18.9t | Queued |
| NR-04182-D | Recycled aggregate | Tyne Yard 4 | Jarrow East | 31.2t | Delivered |
Ledger receipt
What we say.
The single reference for how Nexus ReGen describes itself — internally and externally. Everyone on the team should be able to work from this.
The messaging house
The two-beat pitch
The four pillars
One-liner variants
Headline proof
Who we talk to
| Persona | Their pain (in their words) | Open with | Key proof |
|---|---|---|---|
| Commercial Director Primary buyer in residential developers. Signs contracts. | "Materials costs keep going up, we're overpaying for disposal, and I can't see what's happening across our sites." | Your teams are sourcing reactively, site by site. One platform to plan, source, move and prove materials across every project — and our clients save 26% on average. And the platform that saves the money is the same one that keeps you audit-ready. | £255k Leeds · top-5 housebuilders |
| Sustainability Lead Secondary buyer or internal champion. | "I know we should be reusing more material, but I can't prove what we've done, and nobody trusts my reports." | Nexus ReGen automatically tracks every tonne you reuse and generates the carbon, cost and compliance data to prove your impact — instead of estimating it. AI reads SI reports and surfaces reuse opportunities you'd never spot manually. | 2,196 tCO₂e · DEFRA conversion factors · GHG Protocol |
| Quantity Surveyor / Buyer Operational buyer. Lives in spreadsheets, manages procurement day-to-day. | "I'm ringing around for quotes, comparing apples to oranges, and half the time the material doesn't meet spec." | Replace the phone calls with one place to post what you need, get matched to verified suppliers, and compare quotes — standardised by spec, location and price. Every transaction builds your audit trail automatically. | £36k + 210 tCO₂e topsoil reuse · matched in minutes |
| Board / MD / CEO Cares about risk, reputation and strategic advantage. | "I don't have visibility of materials across our portfolio, and I'm worried about regulatory risk I can't see." | Portfolio-wide visibility of every material movement, cost saving and compliance obligation — in one dashboard. Three of the UK's top five housebuilders are already on the platform; being early is a competitive advantage. | 4,500+ projects · £320B · 260+ orgs |
| Suppliers / Hauliers Supply side — want to win work and fill capacity. | "We only hear about opportunities through word of mouth. Half our trucks go back empty." | Get in front of thousands of live projects looking for exactly what you offer — matched by material, location and timing. Backload opportunities so your return journeys earn. | 260+ orgs · direct RFQs · free to join |
| Legal / compliance buyer HS2, BBV, infrastructure programmes where legal obligation is the driver. | "Schedule 16, duty of care, long-term liability on contaminated land." | One auditable system of record for every material decision on your programme. The cost and sustainability benefits are secondary — governance and traceability are the sale. | CL:AIRE DoW CoP · BS 3882 · DEFRA DWT-ready |
The regulatory tailwind
Talking about the marketplace
Boilerplate library
Email signature taglines
How we sound.
Confident, plain-English, construction-native — with enough wit to feel human, enough rigour to feel credible, and enough ambition to feel like the category-definer we're becoming.
Five voice principles
Tone by context
Say this, not that
Do & don't
Banned phrases
Writing mechanics
- Figures when persuading: 26%, 4,500+, £255k.
- £ with no space. Use
k,m,Bfor scale. - Weight: tonnes or t. Volume: m³ with a space.
- Carbon:
tCO₂e— lower t, upper CO, subscript 2, lower e. - Always cite 26% as an average, not a guarantee.
- British English: organisation, optimise, colour, programme.
- Oxford comma: yes.
- Em dashes — with spaces — for asides. En dashes (–) for ranges.
- Sentence case for headings. Proper nouns keep their caps.
- Never italicise Inter — use weight or colour for emphasis.
- Dates: 17 April 2026. No ordinals.
- Company: Nexus ReGen — capital R, capital G. Always.
- Pillars:
PlanSourceMoveProve. - Capitalise as proper nouns; lowercase in prose.
- Domain:
nexusregen.comlowercase in URLs.
Pre-publish checklist
Motion & easing
Motion communicates causality. Keep it brief, predictable, and quiet — animation should never compete with content.
Duration scale
--motion-fast --motion-normal --motion-slow --motion-graceful Easing curves
--ease-out cubic-bezier(0.0, 0.0, 0.2, 1) --ease-in cubic-bezier(0.4, 0.0, 1, 1) --ease-in-out cubic-bezier(0.4, 0.0, 0.2, 1) --ease-out-expressive cubic-bezier(0.16, 1, 0.3, 1) Rules of thumb
- 01 Default any new transition to 200ms ease-out.
- 02 Never animate more than two properties simultaneously.
- 03 Respect prefers-reduced-motion (compress all durations to 0 or sub-50ms).
- 04 Don't animate properties that cause layout (margin, top, width); prefer transform and opacity.
- 05 Match the animation polarity: opening → ease-out, closing → ease-in.
- 06 List entry/exit can use a 30-50ms stagger between siblings.
Reduced motion
@media (prefers-reduced-motion: reduce) {
:root {
--motion-fast: 0ms;
--motion-normal: 0ms;
--motion-slow: 0ms;
--motion-graceful: 0ms;
}
*, *::before, *::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
}