Slopless Design

stats.neumorphism-gauge-row · Gauge row

A stats pattern from Neumorphism, drawn alone below with this design's tokens and sample copy. Used in this design on: home page, section 3; about page, section 2. Give the section root data-pattern="stats.neumorphism-gauge-row". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule

Header row, then four raised gauges in a row: a dial ring, the reading at step 6 and a caption, centred inside each gauge.

Slots

sectionLabel, title, body, stats[4..4]

Tokens

bg #E3E8EF · text #28303B · heading #161C25 · accent #3F5BD9 · accent2 #794EBA · Plus Jakarta Sans / Plus Jakarta Sans · radius 22px · space unit 4px (full list in design/tokens.json)

Pattern notes

Header row as above, then four raised gauges in a row (two per row on phones), everything centred: an accent dial ring (96 px), the reading at step 6 (700, tight), a muted caption and a mono note in the link colour.

By the numbers

Twelve years in numbers

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

140+

launches shipped

Since 2014

years independent

2025

9 of 10

clients return

Audited

31%

average lift in demo requests

Last 12 months