Emblematic
Typewolf homepage, desktop
Typewolf homepage, mobile
Mobile, 390px

Typography

scale ratio 1.185
  • Domaine Textcss: DomaineTextbody40036%
  • Diaui90032%
  • Domaine Display Narrowcss: DomaineDisplayNarrowdisplay70032%
stylefamilysizeweightlinetracking
displayDomaine Display Narrow46px7001.20em
headlineDomaine Display Narrow26px7001.20em
bodyDomaine Text14px4001.50em
body-smDia12px9001.30em
labelDia15px9001.3-0.03em
Type scale
Aa12Aa13Aa14Aa15Aa16Aa24Aa26Aa28Aa42Aa46
Body size
14px / 1.5
Display size
46px
Display tracking
0em
Case
title

Color

light scheme
Palette by painted area
Text on bg
8.99:1
Muted on bg
5.96:1
Dark mode
none

Space, shape & depth

Spacing scale (base 4px)
  • 3
  • 4
  • 8
  • 9
  • 11
  • 12
  • 15
  • 16
  • 19
  • 20
  • 24
  • 42
  • 48
  • 156
Corner radii
4
Shadows (2)
Borders
heavy, 12px
Section padding
36px

Components

exact computed values
button-secondary
Grenette
textColor
#443235
rounded
0px
padding
0px 0px
height
24px
fontFamily
Domaine Text
fontSize
16px
fontWeight
400
border
1px solid #443235
shadow
rgb(245, 241, 242) 0px -3px 0px 0px inset
input
rounded
0px
height
46.5px
padding
10.5px 10.5px
backgroundColor
#FFFFFF
border
1px solid #CFC6C7

Layout & motion

Container
1128px
Grid columns
n/a
Hero
unknown
Navigation
none-detected
Page height
10,182px
Easing
ease-out
Durations
250ms 300ms 400ms 500ms
Transitions
188
Keyframes
0
Stack
n/a

Page sections (10)

section labels are heuristic
  1. Typewolf content section
    02content?
  2. Typewolf features section
    03features?The World’s Most Expensive Typeface
  3. Typewolf gallery section
    04gallery?Classification Lists
  4. Typewolf gallery section
    05gallery?Alternative Lists
  5. Typewolf gallery section
    06gallery?Favorites Lists
  6. Typewolf gallery section
    07gallery?Fun Lists
  7. Typewolf gallery section
    08gallery?Free Font Lists
  8. Typewolf gallery section
    09gallery?Site Collections
  9. Typewolf footer section
    10footer

How Typewolf compares

Body text
14px: smaller than 82% of indexed sites (median 16px).
Largest heading
46px: smaller than 75% of indexed sites (median 60px).
Type scale
1.19×: flatter than 88% of indexed sites (median 1.28×).
Container
1128px: narrower than 72% of indexed sites (median 1242px).
Text contrast
9.0:1: lower than 93% of indexed sites (median 17.6:1).
Page length
10,182px: longer than 67% of indexed sites (median 8,217px).
Corner radius
Mostly 0px, shared by 84 of 274 indexed sites (31%).
Domaine Text
One of 2 indexed sites that load Domaine Text (1%).
Dia
The only site in the index that loads Dia.
Color scheme
Light by default, like 75% of indexed sites. Like 82% of sites, it doesn't switch with the system dark mode setting.

In short

What font does Typewolf use?

Typewolf uses Domaine Text (loaded as "DomaineText") for body text. Dia is used for ui. Domaine Display Narrow (loaded as "DomaineDisplayNarrow") is used for headings.

What are Typewolf's brand colors?

Typewolf's website uses a light scheme: background #E6DDDE, surface #F8F5F5, text #443235, muted text #654A4E and borders #FFFFFF.

How is Typewolf's website laid out?

The most common corner radius is 0px, body text is 14px with 1.5 line height, and the page container is 1128px wide.

Similar to Typewolf