Pain Perdu
with Cream Cheese Filling
2 servings+ $20.00
Made to share
Foundations
Typography
A classic serif for headlines paired with a clean sans for everything else. Libre Baskerville stands in for Surveyor Text; IBM Plex Sans stands in for Circular.
Typefaces
Display · Headlines
Aa
Libre Baskerville
Page titles and recipe names. Regular weight only.
Interface · Body
Aa
IBM Plex Sans
Section titles, body, links, labels. Regular and SemiBold.
Type scale
Colors: eggplant for primary text, dark brown for secondary, brown for links, white on dark backgrounds.
Dinner, delivered.
Page Title 1 · Desktop
Baskerville Regular
54 / 52px
Dinner, delivered.
Page Title 1 · Mobile
Baskerville Regular
38 / 40px
Pain Perdu
Page Title 2 · Spotlight
Baskerville Regular
24 / 28px
Delivery address
Section Title
Plex Sans Regular
24 / 28px
Skip the “What's for dinner?” debate.
Large Body
Plex Sans Regular
18 / 24px
View this week's menu
Large Text Link
Plex Sans SemiBold
18 / 24px
with Cream Cheese Filling
Small Body
Plex Sans Regular
14 / 20px
Edit customization
Small Text Link
Plex Sans SemiBold
14 / 20px
Made to share
Eyebrow · Tags
Plex Sans SemiBold · caps
12 / 18 · +0.14empx
You can skip a week or cancel any time.
Legal
Plex Sans Regular
12 / 15px
In use
How the styles combine on the default recipe tile.
- Recipe name — Page Title 2, eggplant
- Subtitle — Small Body, eggplant
- Servings & price — Small Body, dark brown
- Tags — Eyebrow, dark brown
Do
Use sentence case everywhere except eyebrows and button labels.Don't
Set body copy in the serif or use bold serif headlines.