Typography
scale ratio 1.276- Bootoncss: bootonbody400 60054%
- Gamuth Displaycss: gamuthDisplaydisplay400 600 70042%
- Brettcss: brettother4003%
- Arialother4002%
| style | family | size | weight | line | tracking |
|---|---|---|---|---|---|
| display | Gamuth Display | 88px | 400 | 0em | |
| headline | Gamuth Display | 56px | 700 | 1.1 | 0em |
| title | Booton | 18px | 600 | 1.5 | 0em |
| body | Booton | 16px | 400 | 1.4 | 0em |
| body-sm | Arial | 14px | 400 | 0em | |
| label | Booton | 18px | 400 | 1.4 | 0em |
Type scale
Aa14Aa16Aa18Aa24Aa28Aa40Aa56Aa72Aa88
- Body size
- 16px / 1.4
- Display size
- 88px
- Display tracking
- 0em
- Case
- sentence
Color
dark schemePalette by painted area
- Text on bg
- 16.18:1
- Muted on bg
- 10.34:1
- Accent on bg
- 1.80:1
- Dark mode
- none
Space, shape & depth
Spacing scale (base 8px)
- 4
- 8
- 10
- 12
- 14
- 16
- 20
- 24
- 28
- 30
- 32
- 40
- 48
- 56
Corner radii
4581216pill
Shadows (2)
- Borders
- hairline, 1px
- Section padding
- 96px
Components
exact computed valuesbutton-primary
Sign up
- backgroundColor
- #772A4D
- textColor
- #FFFFFF
- rounded
- 12px
- padding
- 16px 24px
- height
- 54.1px
- fontFamily
- Booton
- fontSize
- 16px
- fontWeight
- 600
- shadow
- rgba(0, 0, 0, 0.16) 0px 2px 4px 0px
button-secondary
Get started for free
- backgroundColor
- #F73B3B
- textColor
- #FFF7FD
- rounded
- 12px
- padding
- 16px 32px
- height
- 56px
- fontFamily
- Booton
- fontSize
- 16px
- fontWeight
- 600
card
- rounded
- 4px
- padding
- 24px
- backgroundColor
- #F1EAED
Layout & motion
- Container
- 1112px
- Grid columns
- 3
- Hero
- centered+media-below
- Navigation
- none-detected
- Page height
- 9,589px
- Easing
- cubic-bezier(0.4, 0, 0.2, 1)
- Durations
- 150ms 200ms 500ms
- Transitions
- 78
- Keyframes
- 1
- Stack
- next.js, tailwind, sanity, segment, google-tag-manager, cloudflare
Page sections (11)
section labels are heuristic
01features?
02heroAI Video Editor
03content?
04features?The whole workflow, right here
05feature detail?AI tools that change what’s possible
06feature detail?All your video starts (and finishes) here
07feature detail?Enterprise-grade security, brand controls, and collaboration
08feature detail?Don’t just take our word for it
09faqIs it secure enough for my team or company?
10features?From raw footage to finished video, faster
11footer
How Descript compares
- Body text
- 16px, the same as 40% of indexed sites (median 16px).
- Largest heading
- 88px: larger than 86% of indexed sites (median 60px).
- Type scale
- 1.28×: flatter than 53% of indexed sites (median 1.28×).
- Container
- 1112px: narrower than 74% of indexed sites (median 1242px).
- Text contrast
- 16.2:1: lower than 66% of indexed sites (median 17.6:1).
- Page length
- 9,589px: longer than 63% of indexed sites (median 8,217px).
- Corner radius
- Mostly 4px, shared by 24 of 274 indexed sites (9%).
- Booton
- The only site in the index that loads Booton.
- Gamuth Display
- The only site in the index that loads Gamuth Display.
- 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 Descript use?
Descript uses Booton (loaded as "booton") for body text. Gamuth Display (loaded as "gamuthDisplay") is used for headings. Brett (loaded as "brett") is used for other.
What are Descript's brand colors?
Descript's website uses a dark scheme: background #390A1A, surface #190308, text #FFF8F4, muted text #D1C7CB and borders #E4DDE0.
How is Descript's website laid out?
The most common corner radius is 4px, body text is 16px with 1.4 line height, and the page container is 1112px wide.
Similar to Descript
GT America / Publico / Neue Haas Grotesk Display#141414
Convexconvex.dev
SF Pro (system-ui) / Obviously / Inter#060913
Astroastro.build
Sora / Ttroundsneuecond Md#FAF5F5
Fathomfathom.video
Hope Sans / Cooper BT / Cooper Great Jones#0E5540
Great Jonesgreatjones.com
Satoshi Font / Clash Grotesk Font#060419
beehiivbeehiiv.com