dhero studio
A sleek dark-mode studio aesthetic featuring clean typography, soft floating particles, and luminous gradient 3D medallions. Muted surface panels and vibrant graphic emblems structure the showcase.
Visit siteColour
Typefaces
- Display
- dhero
- Body
- dhero
- Mono
- —
- Source
- self_hosted
- Scale
- 14 · 16 · 17 · 18 · 31 · 42
Layout
- Grid
- —
- Container
- —
- Spacing base
- 4px
- Radius
- 12px · 24px · 999px
Capture
- Category
- agency
- Sections
- 12
- Captured
- 2026-08-29
- Rhythm
- dark x12
Type rules
- display type tightly tracked at -0.027em in sentence case
- body text set at 16px with -0.031em tracking
- eyebrows and tags set in uppercase tracking wide
Colour rules
- near-black background throughout the entire page hierarchy
- accent colors appear primarily on icon glyphs and card borders
- dim muted greys used for secondary body text and deactivated states
Voice rules
- use high-contrast active words in headlines
- lead with conversion metrics
Holds it together
- use pill badges for categories, tags, and secondary action triggers
- pair large numerical stats with small colored accent dots
- contain individual feature offers in distinct tinted dark cards
Contrast
Type, measured
- Body
- 16px / 1.5
- Measure
- 105 characters
- Display
- 74px / 1
- Tracking
- -0.027em display
- Scale ratio
- 1.47
Voice
- Tone
- confident, outcome-driven
- Sentences
- short
- Person
- first
- Vocabulary
- plain
- Calls to action
- touch, services, quote
Built with
- Builder
- —
- Framework
- —
- Motion
- lenis
- WebGL
- —
- Nav
- top_bar, 5 items
- Length
- 11.6 screens
Sections in page order
3 marked strong · 12- 00
hero
Atmospheric dark studio hero featuring centered bold typography over a subtle particle field, leading smoothly into client proof and case studies.
- Mood
- bold + dreamy
- Layout
- 1 col · stacked · airy
- 01
showcase
StrongDark portfolio showcase framing an illuminated website mockup card with bold conversion statistics.
- Mood
- clinical + quiet
- Layout
- 1 col · split · balanced
- 02
hero
Minimal dark studio statement with selective word highlighting and pill-shaped action buttons over a subtle dot grid backdrop.
- Mood
- quiet + clinical
- Layout
- 15 col · stacked · airy
- 03
feature
StrongSubdued deep-olive service card balancing clean tag pills and descriptive text against a luminous gradient graphic emblem.
- Mood
- quiet + dreamy
- Layout
- 2 col · split · airy
- 04
feature
A deep plum service overview card pairing structured capability pills with a glowing gradient star medallion.
- Mood
- dreamy + quiet
- Layout
- 14 col · split · balanced
- 05
feature
A dark, clean service card featuring rounded tag chips, descriptive paragraph copy, and a minimalist cyan circular emblem.
- Mood
- clinical + quiet
- Layout
- 2 col · split · balanced
- 06
stats
A clean, high-contrast dark stats grid with massive numbers punctuated by small colored dots.
- Mood
- bold + clinical
- Layout
- 2 col · grid · balanced
- 07
feature grid
Subdued dark-mode agency feature grid pairing selective opacity headline typography with clean abstract geometric glyphs.
- Mood
- quiet + bold
- Layout
- 2 col · grid · balanced
- 08
feature
Sleek dark carousel card pairing disciplined process copy with a luminous abstract graphic on a subtle dot matrix.
- Mood
- quiet + clinical
- Layout
- 1 col · split · balanced
- 09
testimonial
Subdued dark split testimonial layout balancing an understated two-tone headline against stacked rounded quote cards.
- Mood
- quiet + clinical
- Layout
- 2 col · split · airy
- 10
cta
Minimalist dark contact section featuring a centered headline, toggle pills, and an elegant inquiry form card.
- Mood
- quiet + clinical
- Layout
- 14 col · centered · airy
- 11
footer
StrongMinimal dark studio footer pairing structured multi-column site links with award badges and an oversized low-contrast bottom wordmark.
- Mood
- quiet + bold
- Layout
- 14 col · grid · balanced
