Typography
scale ratio 1.219- WhyteV1display40052%
- Circular XXcss: CircularXXbody40028%
- Whyteother4008%
- Circular XX Monocss: CircularXXMonomono400 600 7005%
- WhyteMonoV1other400 6004%
- Whyte Inktrapother4002%
- Menlocss: ui-monospaceother4001%
| style | family | size | weight | line | tracking |
|---|---|---|---|---|---|
| display | WhyteV1 | 72px | 400 | 0.95 | -0.02em |
| headline | WhyteV1 | 64px | 400 | 1.1 | -0.035em |
| title | WhyteV1 | 26px | 400 | 1.2 | -0.01em |
| body | Circular XX | 18px | 400 | 1.5 | -0.01em |
| body-sm | Circular XX | 16px | 400 | 1.5 | -0.01em |
| label | WhyteMonoV1 | 12px | 600 | 1.5 | 0.067em |
| mono | Circular XX Mono | 13px | 400 | 1.538 | 0em |
Type scale
Aa12Aa13Aa16Aa18Aa20Aa26Aa32Aa40Aa43Aa64Aa72
- Body size
- 18px / 1.5
- Display size
- 72px
- Display tracking
- -0.02em
- Case
- sentence
Color
dark schemePalette by painted area
- Text on bg
- 17.04:1
- Muted on bg
- 8.13:1
- Accent on bg
- 5.51:1
- Dark mode
- none
Space, shape & depth
Spacing scale (base 4px)
- 4
- 5
- 6
- 6.5
- 8
- 10
- 12
- 14
- 16
- 20
- 24
- 32
- 48
- 64
Corner radii
6810pill
Shadows (3)
- Borders
- regular, 2px
- Section padding
- n/a
Components
exact computed valuesbutton-primary
Start free
- backgroundColor
- #FFFFFF
- textColor
- #000000
- rounded
- 6px
- padding
- 0px 20px
- height
- 32px
- fontFamily
- WhyteMonoV1
- fontSize
- 12px
- fontWeight
- 600
- shadow
- rgb(255, 255, 255) 0px 0px 0px 2px inset
button-secondary
Start free
- backgroundColor
- #F65C4F
- textColor
- #FFFFFF
- rounded
- 6px
- padding
- 0px 20px
- height
- 42px
- fontFamily
- WhyteMonoV1
- fontSize
- 12px
- fontWeight
- 600
card
- rounded
- 10px
- padding
- 0px
- backgroundColor
- #1C1C1CD9
Layout & motion
- Container
- 1376px
- Grid columns
- 2
- Hero
- left-aligned
- Navigation
- top-fixed+transparent
- Page height
- 11,553px
- Easing
- cubic-bezier(0.2, 0.8, 0.2, 1)
- Durations
- 300ms 360ms 400ms 500ms
- Transitions
- 151
- Keyframes
- 7
- Stack
- next.js, tailwind, google-tag-manager, vercel
Page sections (2)
01nav
How Inngest compares
- Body text
- 18px: larger than 71% of indexed sites (median 16px).
- Largest heading
- 72px: larger than 70% of indexed sites (median 60px).
- Type scale
- 1.22×: flatter than 73% of indexed sites (median 1.28×).
- Container
- 1376px: wider than 96% of indexed sites (median 1242px).
- Text contrast
- 17.0:1: lower than 57% of indexed sites (median 17.6:1).
- Page length
- 11,553px: longer than 78% of indexed sites (median 8,217px).
- Corner radius
- Mostly 6px, shared by 14 of 274 indexed sites (5%).
- WhyteV1
- The only site in the index that loads WhyteV1.
- Circular XX
- One of 2 indexed sites that load Circular XX (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 Inngest use?
Inngest uses WhyteV1 for headings. Circular XX (loaded as "CircularXX") is used for body text. Whyte is used for other.
What are Inngest's brand colors?
Inngest's website uses a dark scheme: background #1C1C1C, text #FFFFFF, muted text #B3B3B3 and borders #FFFFFF.
How is Inngest's website laid out?
The most common corner radius is 6px, body text is 18px with 1.5 line height, and the page container is 1376px wide.
