Work · 005 · Web
Lineamode
An apparel house with a real brand deck, and a site built to honour it rather than reinterpret it.
01 The problem
Most brand systems die on the second page.
A deck specifies a palette, a type scale and a grid. A site gets built, looks right on the homepage, and then someone adds a page and the system quietly stops being true. The tenth page is a different brand.
Lineamode came with a considered system — Stone Veil canvas, Carbon Ink text, terracotta and moss accents, a linear grid with deliberate disruption, and the line From Idea to Execution. The job was to encode it, not to decorate with it.
02 Build
The grid is a component, not a mood.
The brand's linear grid with controlled disruption is implemented once and reused as both a hero backdrop and a section divider, so the disruption is consistent wherever it appears instead of being redrawn by hand.
Brand colours live as tokens. Substitute typefaces are marked in the code as substitutes, with the licensed faces they stand in for named at the swap point — so replacing them later is a two-line change, not an audit.
- Framework
- Next.js 16, App RouterReact Server Components, View Transitions
- Styling
- Tailwind v4Brand tokens in one globals file
- Motion
- Motion, GSAP, Lenis
- Canvas
- Stone Veil #E1E1DC
- Text
- Carbon Ink #201C1D
- Accents
- Terracotta, Chalk Sand, Ash Linen, Moss Veil, Graphite Blue
Next Back to the start