Typography
scale ratio 1.869- Schenkdisplay40031%
- Spectatorcss: Spectator Uprightother40019%
- New Doriccss: New Doric Uprightother40019%
- Action Grotesquecss: Action Grotesque Uprightother40016%
- Styrene UI Abody40011%
- Styrene UI Bui4004%
| style | family | size | weight | line | tracking |
|---|---|---|---|---|---|
| display | Schenk | 331.2px | 400 | 1.4 | 0em |
| body | Styrene UI A | 14.62px | 400 | 1.4 | 0em |
Type scale
Aa13.5Aa14.5Aa21Aa116Aa182Aa198.5Aa331
- Body size
- 14.5px / 1.4
- Display size
- 331.2px
- Display tracking
- 0em
- Case
- upper
Color
dark schemePalette by painted area
- Text on bg
- 21.00:1
- Muted on bg
- undefined:1
- Accent on bg
- 1.64:1
- Dark mode
- none
Space, shape & depth
Spacing scale
- 2
- 3
- 6.5
- 8.5
- 10.5
- 18.5
- 20.5
- 21
- 62.5
Corner radii
Shadows (2)
- Borders
- hairline, 1px
- Section padding
- 20px
Components
exact computed valuesbutton-primary
Subscribe
- backgroundColor
- #323232
- textColor
- #FFFFFF
- rounded
- 0px
- padding
- 0px 8.4px
- height
- 31.3px
- fontFamily
- Styrene UI B
- fontSize
- 14.62px
- fontWeight
- 400
input
- rounded
- 0px
- height
- 31.3px
- padding
- 0px 2.9px
- border
- 1px solid #000000
Layout & motion
- Container
- n/a
- Grid columns
- 3
- Hero
- left-aligned+media-below
- Navigation
- top-fixed+transparent
- Page height
- 2,706px
- Easing
- ease
- Durations
- 150ms 300ms 500ms
- Transitions
- 27
- Keyframes
- 4
- Stack
- hotwire
Page sections (4)
01nav
02hero
03testimonialsGoods
04footer
How Commercial Type compares
- Body text
- 14.5px: smaller than 81% of indexed sites (median 16px).
- Largest heading
- 331.2px: larger than 100% of indexed sites (median 60px).
- Type scale
- 1.87×: steeper than 98% of indexed sites (median 1.28×).
- Text contrast
- 21.0:1: higher than 81% of indexed sites (median 17.6:1).
- Page length
- 2,706px: shorter than 88% of indexed sites (median 8,217px).
- Corner radius
- Mostly 0px, shared by 84 of 274 indexed sites (31%).
- Schenk
- The only site in the index that loads Schenk.
- Spectator
- The only site in the index that loads Spectator.
- 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 Commercial Type use?
Commercial Type uses Schenk for headings. Spectator (loaded as "Spectator Upright") is used for other. New Doric (loaded as "New Doric Upright") is used for other.
What are Commercial Type's brand colors?
Commercial Type's website uses a dark scheme: background #000000, text #FFFFFF.
How is Commercial Type's website laid out?
The most common corner radius is 0px, body text is 14.5px with 1.4 line height, and the page container is nullpx wide.
