European Pavers Source · europeanpavers.com

A real design system, lifted from a real site.

Real teal & lime tokens straight out of europeanpavers.com's defaults.css. Real Oswald + Plus Jakarta Sans variable fonts (both Google, free — no substitution needed). Twelve real project photos from EP's own CDN. Three real logo variants. The system below; sections rendered in EP's commercial-architectural voice next.

The system

Tokens, type & components — extracted, not invented.

Eight color swatches with real hex values direct from defaults.css, the full type ramp on Oswald + Plus Jakarta Sans, the three signature gradients (beige · teal-up · teal-down), pill-button system, regional strip and legacy-stat band as signature patterns, and the chevron texture asset that ties it all together.

Open the design system →
#015760
#016e79
#162a2c
#c2eb50
#a4cd31
#e8e8db
#f2f2ef
#ffffff
#bfbfbf
sections preview
Built to last.
The sections

Every canonical pattern, rendered EP-style.

Hero photo-led, intro statement, services grid, project list, three-card value props, image-text rows, FAQ accordion, testimonial slider, CTA band, closing block, footer — plus EP's three signature patterns (chevron-texture-band, regional-strip, legacy-stat-band) all in one scrolling reference.

Open the sections catalog →

Three signature patterns unique to EP.

Detailed in brand-spec.md
Signature 01
Chevron texture band

Chapter break, paver-style.

Full-width thin band with EP's chevron paver-texture image at low opacity. Marks chapter breaks the way SBC uses vertical rules — but as a horizontal texture flash instead of a hairline.

See in design system →
Signature 02
Regional strip

Two regions. Nine states.

Two-column credential block listing EP's Southwest and Southeast operating regions. The "we're in both places" beat that anchors EP's commercial credibility — adapt for any multi-region service brand.

See in design system →
Signature 03
Legacy stat band

Built to last since 1978.

Big chunky uppercase Oswald statistic on teal ground or against a project photo, anchored by a 96 × 6 lime-green underline. The credential beat between hero and body — once per page max.

See in design system →