Typography
scale ratio 2.426- Thermacss: thermadisplay + body400 70052%
- Monocss: monomono200 40031%
- Saucecss: sauceother40017%
| style | family | size | weight | line | tracking |
|---|---|---|---|---|---|
| display | Sauce | 251px | 400 | 1 | 0em |
| headline | Therma | 120px | 700 | 0.8 | -0.05em |
| title | Mono | 10px | 200 | 1.2 | -0.01em |
| body | Mono | 14px | 200 | 1.2 | -0.01em |
Type scale
Aa10Aa14Aa16Aa120Aa200
- Body size
- 14px / 1.2
- Display size
- 251px
- Display tracking
- 0em
- Case
- upper
Color
dark schemePalette by painted area
- Text on bg
- 4.51:1
- Muted on bg
- undefined:1
- Accent on bg
- 4.51:1
- Dark mode
- none
Space, shape & depth
Spacing scale (base 8px)
- 4
- 6
- 8
- 16
- 24
- 32
- 40
- 200
Corner radii
Shadows (0)
none
- Borders
- hairline, 1px
- Section padding
- 200px
Layout & motion
- Container
- n/a
- Grid columns
- 8
- Hero
- left-aligned+media-below
- Navigation
- top-static
- Page height
- 8,711px
- Easing
- cubic-bezier(0.23, 1, 0.32, 1)
- Durations
- 120ms 150ms 200ms 350ms
- Transitions
- 100
- Keyframes
- 0
- Stack
- next.js, lenis, vercel
Page sections (8)
section labels are heuristic
01heroDeveloped Get Things Where
03content?
04testimonialsWhat Clients Say
05feature detail?Tools We Build and Use. Now Yours Too.
06feature detail?We bring brands and interfaces to life with code that runs smooth and scales rig
07features?Awards / Features
How darkroom.engineering compares
- Body text
- 14px: smaller than 82% of indexed sites (median 16px).
- Largest heading
- 251px: larger than 99% of indexed sites (median 60px).
- Type scale
- 2.43×: steeper than 100% of indexed sites (median 1.28×).
- Text contrast
- 4.5:1: lower than 98% of indexed sites (median 17.6:1).
- Page length
- 8,711px: longer than 54% of indexed sites (median 8,217px).
- Corner radius
- Mostly 0px, shared by 84 of 274 indexed sites (31%).
- Therma
- The only site in the index that loads Therma.
- Mono
- One of 2 indexed sites that load Mono (1%).
- Color scheme
- Dark by default, like 25% of indexed sites. Like 82% of sites, it doesn't switch with the system dark mode setting.
In short
What font does darkroom.engineering use?
darkroom.engineering uses Therma (loaded as "therma") for headings and body text. Mono (loaded as "mono") is used for code. Sauce (loaded as "sauce") is used for other.
What are darkroom.engineering's brand colors?
darkroom.engineering's website uses a dark scheme: background #000000, text #E71419.
How is darkroom.engineering's website laid out?
The most common corner radius is 0px, body text is 14px with 1.2 line height, and the page container is nullpx wide.
Similar to darkroom.engineering
Simon Mono / Syndicat Grotesk#750406
Mejurimejuri.com
SF Pro (system-ui) / Obviously / Inter#060913
Astroastro.build
Schenk / Spectator / New Doric#FFFFFF
Commercial Typecommercialtype.com
GT America / Publico / Neue Haas Grotesk Display#141414
Convexconvex.dev
Booton / Gamuth Display / Brett#390A1A
Descriptdescript.com