Zest

Design system

Living reference for all UI components, tokens, and patterns.

Colors

navy#0f172a
zest#76C83A
cream#F0EAE0
white#ffffff
gray-100#f3f4f6
gray-200#e5e7eb
gray-400#9ca3af
gray-700#374151

Typography

Plus Jakarta Sans — weights 300–800

text-[2.5rem] font-extrabold

weight 800

Hero heading

text-xl font-bold

weight 700

Section heading

text-base font-bold

weight 700

Modal title / card heading

text-sm font-semibold

weight 600

Card title / label

text-sm font-medium

weight 500

Body / ingredient name

text-sm font-medium text-gray-500

weight 500

Body / ingredient name

text-xs text-gray-400

weight 400

Caption / meta

text-[2.5rem] font-extrabold — Hero with accent

The cheat code to complete your weekly meal prep in 5 mins

Search input

Filter dropdowns

Buttons

Default
In plan

Badges

NEWVegan ×In plan

Recipe card

Crispy potato and spicy chorizo tacos
30 min

Crispy potato and spicy chorizo tacos

🍽️
30 min

Pan-seared salmon with herb butter