BetterMe Well-Being Coach

Colors

• #121212Background Black · screen background
• #FFFFFFText White · title text · option titles
• #A0A0A0Section Header Grey · section header labels
• #EAE0D0Selected Beige · selected card background

Type

• TitleSF Pro Display · 32px · bold · #FFFFFF
• Section HeaderSF Pro Text · 12px · bold · #A0A0A0

Elements

• Diet Type Card 1 · selectable card

  row under 'WITH MEAT', selected state · light beige background with icon, title, subtitle, and checkmark

• Diet Type Card 2 · selectable card

  row under 'WITH MEAT', unselected state · dark grey background with icon, title, subtitle, and radio button

Layout

Vertical list layout with categorized sections ('WITH MEAT' and 'WITHOUT MEAT').

Notes

Diet preference selection screen.