Typography
scale ratio 1.141- Recoletadisplay400 500 600 70079%
- Albert Sansbody400 50021%
| style | family | size | weight | line | tracking |
|---|---|---|---|---|---|
| display | Recoleta | 60px | 400 | 1 | 0em |
| headline | Recoleta | 22px | 500 | 1.25 | 0.025em |
| title | Recoleta | 20px | 500 | 1.4 | -0.025em |
| body | Albert Sans | 16px | 400 | 1.5 | 0em |
| body-sm | Albert Sans | 14px | 400 | 1.429 | 0em |
| label | Recoleta | 16px | 400 | 1.5 | 0em |
Type scale
Aa12Aa14Aa15Aa16Aa17Aa18Aa20Aa22Aa24Aa30Aa36Aa40Aa48Aa60
- Body size
- 16px / 1.5
- Display size
- 60px
- Display tracking
- 0em
- Case
- title
Color
light schemePalette by painted area
- Text on bg
- 20.35:1
- Muted on bg
- 10.05:1
- Accent on bg
- 1.45:1
- Dark mode
- none
Declared accent tokens
- --color--accent#FECD59painted
Space, shape & depth
Spacing scale (base 8px)
- 4
- 8
- 11
- 12
- 16
- 24
- 32
- 48
Corner radii
516pill
Shadows (0)
none
- Borders
- hairline, 1px
- Section padding
- 81px
Components
exact computed valuesbutton-primary
Try the Starter Pack
- backgroundColor
- #FDCD62
- textColor
- #010101
- rounded
- 9999px
- padding
- 4px 16px
- height
- 34px
- fontFamily
- Albert Sans
- fontSize
- 16px
- fontWeight
- 500
- border
- 1px solid #010101
- shadow
- rgb(1, 1, 1) 0px 0px 0px 0px
button-secondary
Store Locator
- textColor
- #010101
- rounded
- 9999px
- padding
- 4px 12px
- height
- 34px
- fontFamily
- Albert Sans
- fontSize
- 16px
- fontWeight
- 500
- border
- 1px solid #010101
- shadow
- rgb(1, 1, 1) 0px 0px 0px 0px
input
- rounded
- 9999px
- height
- 42px
- padding
- 8px 12px
- border
- 1px solid #010101
Layout & motion
- Container
- 800px
- Grid columns
- 2
- Hero
- left-over-media
- Navigation
- top-sticky
- Page height
- 6,701px
- Easing
- cubic-bezier(0.4, 0, 0.2, 1)
- Durations
- 200ms 300ms 500ms
- Transitions
- 41
- Keyframes
- 0
- Stack
- shopify, jquery, google-tag-manager, cloudflare
Page sections (8)
section labels are heuristic
01hero
02features?Merch
03features?Be the Star of Every Holiday Party
04feature detail?The 12 Days of Fishwife Advent Calendar
05features?Smoked Salmon
06logos
07cta?Feast of the Seven Fishes Grazing Board
08footerSign up for the latest updates, product launches, and fresh collaborations.
How Eatfishwife compares
- Body text
- 16px, the same as 40% of indexed sites (median 16px).
- Largest heading
- 60px: larger than 48% of indexed sites (median 60px).
- Type scale
- 1.14×: flatter than 98% of indexed sites (median 1.28×).
- Container
- 800px: narrower than 90% of indexed sites (median 1242px).
- Text contrast
- 20.4:1: higher than 80% of indexed sites (median 17.6:1).
- Page length
- 6,701px: shorter than 64% of indexed sites (median 8,217px).
- Corner radius
- Mostly 0px, shared by 84 of 274 indexed sites (31%).
- Recoleta
- The only site in the index that loads Recoleta.
- Albert Sans
- One of 2 indexed sites that load Albert Sans (1%).
- 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 Eatfishwife use?
Eatfishwife uses Recoleta for headings. Albert Sans is used for body text.
What are Eatfishwife's brand colors?
Eatfishwife's website uses a light scheme: background #FFFCF3, surface #C7E0C3, text #010101, muted text #374151 and borders #010101.
How is Eatfishwife's website laid out?
The most common corner radius is 0px, body text is 16px with 1.5 line height, and the page container is 800px wide.
Similar to Eatfishwife
Source Serif 4 / Albert Sans / Inter#FBF9F3
Readwisereadwise.io
Noe Standard / Atlas Grotesk / Noe Text#FAF8F0
Asteriskmagasteriskmag.com
Plantin / Helvetica Neue / Monocons#FFFFFF
Monoclemonocle.com
GH Guardian Headline / Guardian Text Sans#FFFFFF
Theguardiantheguardian.com
Untitled Serif Font / Untitled Sans Font / Inter Font#FCF9F7
Craftcraft.do