ReciMe: Recipes & Meal Planner

Colors

• #F7F5F0Background · screen_background
• #111111Text Dark · title_text
• #555555Text Muted · subtitle_text
• #1E1E1EPrimary Button · button_background
• #FFFFFFButton Text · button_text

Type

• TitleSF Pro · 42px · bold · #111111
• SubtitleSF Pro · 26px · normal · #555555
• Button TextSF Pro · 26px · semibold · #FFFFFF

Elements

• Back Button · icon_button

  Top left · Chevron icon

• Progress Bar · progress_bar

  Top center · Linear progress bar

• Illustration Group · graphic

  Center of screen · Collage of illustrated food items and floating tags (Cook time, Budget, Dietaries, Serving size)

• Continue Button · button

  Bottom center · Solid dark pill button

Layout

Vertical hierarchy with header, descriptive text, central vector illustration cluster, and a bottom primary call-to-action button.

Notes

Welcome/introductory screen for the meal planning feature.