Emblematic
Upstash homepage, desktop
Upstash homepage in dark mode
Dark mode (follows system setting)
Upstash homepage, mobile
Mobile, 390px

Typography

scale ratio 1.623
stylefamilysizeweightlinetracking
displayInter Tight128px7001-0.025em
headlineInter24px5001.3330em
titleInter16px4001.50em
bodyInter16px4001.50em
body-smInter12px4001.3330em
monoJetBrains Mono14px40010em
Type scale
Aa12Aa14Aa16Aa20Aa24Aa48Aa128Aa180
Body size
16px / 1.5
Display size
128px
Display tracking
-0.025em
Case
sentence

Color

light scheme
Palette by painted area
Text on bg
13.89:1
Muted on bg
4.43:1
Accent on bg
2.26:1
Dark mode
follows system
Declared accent tokens
  • --color-primary#00BC7Dpainted

Space, shape & depth

Spacing scale (base 8px)
  • 2
  • 4
  • 6
  • 8
  • 12
  • 16
  • 20
  • 24
  • 32
  • 40
  • 64
  • 80
  • 216
Corner radii
121635pill
Shadows (4)
Borders
hairline, 1px
Section padding
24px

Components

exact computed values
button-primary
Start for Free
backgroundColor
#00BC7D
textColor
#FFFFFF
rounded
12px
padding
8px 20px
height
44px
fontFamily
Inter
fontSize
16px
fontWeight
500
button-secondary
Caching
backgroundColor
#FFFFFF
textColor
#000000
rounded
6px
padding
0px 12px
height
32px
fontFamily
Inter
fontSize
16px
fontWeight
400
card
rounded
35.2px
padding
32px
backgroundColor
#FFFFFF
shadow
rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px

Layout & motion

Container
1280px
Grid columns
6
Hero
centered
Navigation
top-fixed
Page height
6,480px
Easing
cubic-bezier(0.4, 0, 0.2, 1)
Durations
150ms 200ms 300ms 500ms
Transitions
76
Keyframes
2
Stack
next.js, tailwind, radix-ui, intercom, google-tag-manager, vercel

Page sections (8)

section labels are heuristic
  1. Upstash hero section
    01heroServerless Data Platform
  2. Upstash code-sample section
    02code sample?Upstash Serverless Data Platform — products
  3. Upstash stats section
    03stats?Fast Anywhere
  4. Upstash code-sample section
    04code sample?Serverless & Edge
  5. Upstash code-sample section
    05code sample?Built for AI Agents
  6. Upstash logos section
    06logosMeet our Customers
  7. Upstash features section
    07features?Community
  8. Upstash footer section
    08footer

How Upstash compares

Body text
16px, the same as 40% of indexed sites (median 16px).
Largest heading
128px: larger than 96% of indexed sites (median 60px).
Type scale
1.62×: steeper than 93% of indexed sites (median 1.28×).
Container
1280px: wider than 55% of indexed sites (median 1242px).
Text contrast
13.9:1: lower than 82% of indexed sites (median 17.6:1).
Page length
6,480px: shorter than 65% of indexed sites (median 8,217px).
Corner radius
Mostly fully rounded (pill), shared by 53 of 274 indexed sites (19%).
Inter
One of 58 indexed sites that load Inter (21%).
Inter Tight
One of 2 indexed sites that load Inter Tight (1%).
Color scheme
Light by default, like 75% of indexed sites. It is one of 49 sites (18%) that switch with the system dark mode setting.

In short

What font does Upstash use?

Upstash uses Inter for body text. Inter Tight is used for headings. JetBrains Mono is used for code.

What are Upstash's brand colors?

Upstash's website uses a light scheme: background #F5F5F5, surface #FFFFFF, text #022C22, muted text #71717B and borders #0000000D.

How is Upstash's website laid out?

The most common corner radius is fully rounded (pill), body text is 16px with 1.5 line height, and the page container is 1280px wide.

Similar to Upstash

Buildwithfern homepage
GT Planar / Berkeley Mono / Inter#F7F7F7
Buildwithfernbuildwithfern.com
Pipedream homepage
Inter / JetBrains Mono / Departure Mono#FFFFFF
Pipedreampipedream.com
Attio homepage
Inter / Inter Display / Tiempos Text#FFFFFF
Attioattio.com
Unicorn Studio homepage
Inter Tight / Faculty Glyphic / Inter#101010
Unicorn Studiounicorn.studio
Deepnote homepage
Inter / Degular / Bricolage Grotesque#FFFFFF
Deepnotedeepnote.com