Typography
scale ratio 1.320- Kinfolk Serif Deckcss: Kinfolk-Serif-Deckdisplay40067%
- Kinfolk Sanscss: Kinfolk-Sansui40017%
- Kinfolk Serif Displaycss: Kinfolk-Serif-Displaybody40014%
- Kinfolk Serif Textcss: Kinfolk-Serif-Textother4002%
| style | family | size | weight | line | tracking |
|---|---|---|---|---|---|
| display | Kinfolk Serif Deck | 50px | 400 | 1.04 | -0.01em |
| title | Kinfolk Serif Deck | 32px | 400 | 1.188 | -0.005em |
| body | Kinfolk Serif Text | 15px | 400 | 1.333 | 0em |
| label | Kinfolk Sans | 15px | 400 | 1.333 | 0.01em |
Type scale
Aa13Aa15Aa20Aa25Aa32Aa50Aa60
- Body size
- 15px / 1.333
- Display size
- 50px
- Display tracking
- -0.01em
- Case
- upper
Color
light schemePalette by painted area
- Text on bg
- 21.00:1
- Muted on bg
- undefined:1
- Dark mode
- none
Declared accent tokens
- --wpds-color-background-thumb-brand#3858E9not on page
- --wpds-color-stroke-surface-brand-strong#3858E9not on page
Space, shape & depth
Spacing scale (base 5px)
- 2
- 4
- 5
- 8
- 10
- 15
- 20
- 25
- 30
- 40
- 60
- 80
- 110
- 170
Corner radii
2
Shadows (0)
none
- Borders
- regular, 2px
- Section padding
- 200px
Components
exact computed valuesinput
- rounded
- 0px
- height
- 38px
- padding
- 0px 0px
- backgroundColor
- #FFFFFF
Layout & motion
- Container
- 1372px
- Grid columns
- 20
- Hero
- centered-over-media+media-below
- Navigation
- top-fixed+transparent
- Page height
- 15,848px
- Easing
- cubic-bezier(0.25, 1, 0.5, 1)
- Durations
- 400ms 500ms 800ms 1200ms
- Transitions
- 228
- Keyframes
- 0
- Stack
- wordpress, lenis, google-tag-manager, cloudflare
Page sections (7)
section labels are heuristic
01nav
02hero
03content?
07footerSubscribe
How Kinfolk compares
- Body text
- 15px: smaller than 76% of indexed sites (median 16px).
- Largest heading
- 50px: smaller than 66% of indexed sites (median 60px).
- Type scale
- 1.32×: steeper than 59% of indexed sites (median 1.28×).
- Container
- 1372px: wider than 96% of indexed sites (median 1242px).
- Text contrast
- 21.0:1: higher than 81% of indexed sites (median 17.6:1).
- Page length
- 15,848px: longer than 93% of indexed sites (median 8,217px).
- Corner radius
- Mostly 0px, shared by 84 of 274 indexed sites (31%).
- Kinfolk Serif Deck
- The only site in the index that loads Kinfolk Serif Deck.
- Kinfolk Sans
- The only site in the index that loads Kinfolk Sans.
- 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 Kinfolk use?
Kinfolk uses Kinfolk Serif Deck (loaded as "Kinfolk-Serif-Deck") for headings. Kinfolk Sans (loaded as "Kinfolk-Sans") is used for ui. Kinfolk Serif Display (loaded as "Kinfolk-Serif-Display") is used for body text.
What are Kinfolk's brand colors?
Kinfolk's website uses a light scheme: background #FFFFFF, surface #DBDED5, text #000000 and borders #000000.
How is Kinfolk's website laid out?
The most common corner radius is 0px, body text is 15px with 1.333 line height, and the page container is 1372px wide.
