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

Typography

scale ratio 1.257
  • Freight Sansbody400 60083%
  • Freight Displaydisplay60017%
stylefamilysizeweightlinetracking
displayFreight Display40px6001.150em
headlineFreight Sans24px6001.150em
titleFreight Sans20px6001.20.016em
bodyFreight Sans16px4001.550em
body-smFreight Sans14px4001.550em
labelFreight Sans14px6001.550em
Type scale
Aa12Aa14Aa16Aa20Aa24Aa32Aa40
Body size
16px / 1.55
Display size
40px
Display tracking
0em
Case
title

Color

light scheme
Palette by painted area
Text on bg
17.58:1
Muted on bg
undefined:1
Accent on bg
4.68:1
Dark mode
follows system
Declared accent tokens
  • --wp--custom--color--brand--primary--base#07863Cpainted
  • --wp--custom--color--brand--secondary--base#FFCD05not on page
  • --wp--custom--color--primary#07863Cpainted
  • --wp--preset--color--primary#07863Cpainted

Space, shape & depth

Spacing scale (base 4px)
  • 8
  • 10
  • 12
  • 16
  • 20
  • 24
  • 32
  • 80
Corner radii
4pill
Shadows (1)
Borders
hairline, 1px
Section padding
111px

Components

exact computed values
button-primary
Subscribe
backgroundColor
#07863C
textColor
#FFFFFF
rounded
4px
padding
8px 18px
height
40.8px
fontFamily
Freight Sans
fontSize
16px
fontWeight
400
input
rounded
4px
height
56px
padding
16px 16px
backgroundColor
#FAFAFA
border
1px solid #4D4D4D

Layout & motion

Container
1280px
Grid columns
3
Hero
centered
Navigation
top-sticky
Page height
10,689px
Easing
ease-out
Durations
180ms 200ms 220ms 260ms
Transitions
13
Keyframes
0
Stack
next.js, wordpress

Page sections (7)

  1. Nautilus nav section
    01nav
  2. Nautilus hero section
    02heroWhat’s All That Coffee Doing to Your Gut?
  3. Nautilus testimonials section
    03testimonialsRead Stories from Our Newest Print Issue: The Stupid Issue
  4. Nautilus testimonials section
    05testimonialsOur Planet’s Lungs Are Suffering
  5. Nautilus testimonials section
    06testimonialsEssential Reading in an Era of AI Doomsaying
  6. Nautilus footer section
    07footer

How Nautilus compares

Body text
16px, the same as 40% of indexed sites (median 16px).
Largest heading
40px: smaller than 79% of indexed sites (median 60px).
Type scale
1.26×: flatter than 61% of indexed sites (median 1.28×).
Container
1280px: wider than 55% of indexed sites (median 1242px).
Text contrast
17.6:1: higher than 50% of indexed sites (median 17.6:1).
Page length
10,689px: longer than 72% of indexed sites (median 8,217px).
Corner radius
Mostly 4px, shared by 24 of 274 indexed sites (9%).
Freight Sans
The only site in the index that loads Freight Sans.
Freight Display
The only site in the index that loads Freight Display.
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 Nautilus use?

Nautilus uses Freight Sans for body text. Freight Display is used for headings.

What are Nautilus's brand colors?

Nautilus's website uses a light scheme: background #FFFFFF, text #191919.

How is Nautilus's website laid out?

The most common corner radius is 4px, body text is 16px with 1.55 line height, and the page container is 1280px wide.

Similar to Nautilus

Newyorker homepage
TNY Adobe Caslon Pro / Irvin Heading Pro / Neutraface New Yorker#FFFFFF
Newyorkernewyorker.com
Craft homepage
Untitled Serif Font / Untitled Sans Font / Inter Font#FCF9F7
Craftcraft.do
GRAZA homepage
ITC Garamond Condensed / GT Alpina Typewriter / Apercu#D1E030
GRAZAgraza.co
Leerob homepage
Iowan Old Style#FFFFFF
Leerobleerob.com
Future Fonts homepage
VCTR Mono#FFFFFF
Future Fontsfuturefonts.xyz