Raw Structure

Item: Raw Structure
Rating: 7.8

Framer template for design-build contractors and engineering firms.

A Framer Marketplace template by Noel Dario Andres. Its words and photos are demo content.

Live preview Get this template Save page

7.8/10MABTU rating

DESKTOP · 1440 × 13,405/ ↗

MOBILE · 390

Section outline · Home

01heroPhoto strip with orange block, mono coordinates, two CTAs1,034
02marqueeOrange hazard-tape strip of disciplines, two directions
03aboutCentred condensed statement over blueprint grid, client logo row
04servicesNumbered row stack, active row orange with thumbnail1,449
05processStages 01-05 with blueprint, excavation and steel frames3,309
06projectsThree tall project cards with type chip and location, arrow controls1,321
07statsRotating cube beside 38+/214+/1.2M/640+ cells
08showcaseBlueprint-to-photo reveal band, repeats on scroll
09testimonialsThree quote cards, middle one solid orange920
10journalDated log rows with thumbnail and category tag888
11ctaContact columns and full-width RAW STRUCTURE wordmark1,174

Rating · Home

Visual design8.6

UX & clarity8.0

Originality8.5

Craft & consistency8.3

Motion7.5

Performance & a11y8.7

This page scores 8.3; the site score weights the home page double.

Main colours

Dark·black background·vivid

Typography

Antonheading · sans · self-hosted Archivobody · sans · self-hosted JetBrains Monoaccent · mono · self-hosted

Stack & style

Framer React Google Fonts

Bold typography Brutalist Monochrome Photography-led Sharp / geometric Swiss grid Dark tech Custom cursor Horizontal scroll Logo cloud Marquee Process steps Stats band Sticky header Testimonial slider Text reveal

Design DNA

Template: near-black (#0D0D0D) with safety orange (#FF4D0D) and white, plus a faint blueprint grid behind most bands. Headlines are a heavy condensed grotesque in all caps with a full stop (WE BUILD WHAT STANDS.); metadata is 10px uppercase mono with coordinates, lot numbers and dates set in the margins. Photography is black-and-white steel and concrete, reserved colour only for site shots. Signature moves: an orange safety-tape marquee, a numbered discipline list where the active row expands with a thumbnail, a five-stage build sequence numbered 01-05 with blueprint and machinery frames, and a monospaced field-notes log.

Worth borrowing

Run an orange hazard-tape marquee under the hero with spaced keywords as the section divider.
Write coordinates, lot numbers and week markers in 10px mono in the margins to make a contractor page feel like a site document.
Make the services list a numbered row stack where the hovered discipline turns orange and reveals a small project thumbnail.