granzabio-com

Clinical precision meets warm tactile minimalism. Warm stone paper tones and delicate architectural wireframe dividers frame disciplined typography and organic cellular visuals, concluding in an authoritative dark-mode technical footer.

clinical quiet

Visit site

Rated

7.1/ 10

From 4 analysed sections. Two measured components and one judged by a model. Distinction is a rank within the library; the rest are scores in their own right.

AI scorejudged: 8.5
Systemmeasured: 4.8
Distinctionmeasured: 9.1

on the grid: 20%
vertical rhythm: 25%
type on a scale: 86%
contrast passing AA: 60%
unlike the library: 0.30
model craft: 7.5/10
model deviation: 4.8/10

Colour

Background#e2d9cd

Text#24221e

Accent#ff5c20

Surface#cdc4b7

Muted#24221e

Typefaces

Display: Geistvf
Body: Geistvf
Mono: Geistmonovf
Source: self_hosted
Scale: 14 · 16 · 18 · 24 · 40 · 64

Layout

Grid: —
Container: —
Spacing base: 4px
Radius: 0px

Capture

Category: health
Sections: 4
Captured: 2026-08-30
Rhythm: cream x3 → dark

Type rules

display headlines set tightly tracked in sentence case at over 100px
metadata, navigation, and category tags always set in uppercase monospace

Colour rules

warm stone (#e2d9cd) serves as the primary canvas before grounding into a charcoal (#24221e) footer
accent orange (#ff5c20) is restricted to micro-indicator dots and navigation highlights

Voice rules

lead with rigorous scientific mechanics rather than marketing hyperbole
navigation and section labels use terse uppercase monospace

Holds it together

use thin dark hairline dividers with chamfered sci-fi corners to define section perimeters
pair large sentence-case sans-serif headlines with isolated uppercase monospace tags
restrict vibrant orange accents strictly to small status dots and navigation markers

Contrast

text on background11.4:1 AAA

muted text on background11.4:1 AAA

text on surface9.2:1 AAA

accent on background2.2:1 fail

background on accent2.2:1 fail

Type, measured

Body: 14px / 1.5
Measure: 37 characters
Display: 104px / 1
Tracking: -0.04em display
Scale ratio: 1.65

Voice

Tone: precise, academic, authoritative
Sentences: medium
Person: third
Vocabulary: technical
Calls to action: reach, get

Built with

Builder: webflow
Framework: —
Motion: gsap, lenis, swiper
WebGL: yes
Nav: top_bar, 2 items
Length: 2.9 screens

Sections in page order

3 marked strong · 4

Rhythm — each block is a section, as wide as it is tall, in the colour it is on

00
hero
Strong
An airy biotech hero pairing disciplined Swiss typography with a warm, speckled biological illustration and architectural framing lines.
Mood
clinical + warm
Layout
1 col · split · airy
Open section →
01
logo bar
A quiet and warm investor logo strip neatly arranged across neutral-toned rectangular cards.
Mood
quiet + warm
Layout
1 col · stacked · balanced
Open section →
02
statement
Strong
Restrained, airy typographic statement pairing a lone monospace indicator with a disciplined paragraph on warm paper tones.
Mood
clinical + quiet
Layout
1 col · asymmetric · airy
Open section →
03
footer
Strong
A technical dark-mode footer blending sci-fi chamfered framing with stark monospace metadata and a bold contact headline.
Mood
clinical + raw
Layout
4 col · asymmetric · airy
Open section →