BetterMe Well-Being Coach

Colors

• #121110Background Black · background
• #1e1b19Card Fill Unselected · selection card background
• #ebdcd0Card Fill Selected · selected card background
• #ffffffText White · title · unselected option text
• #1e1b19Text Dark · selected option text

Type

• Screen TitleInter · 32px · medium · #ffffff
• Option LabelInter · 20px · regular · #ffffff
• Selected Option LabelInter · 20px · regular · #1e1b19

Elements

• Selection Cards · list of option cards

  Vertical stack on the left side, aligned left with consistent vertical spacing · Rounded rectangle containers with dark or cream fill

• Selection Radio/Check · radio button indicator

  Right-aligned inside each selection card · Circular outline or filled check circle

• Fitness Model Image · illustrative photo

  Right side of the screen, cropped vertically · Photo of a shirtless man holding a dumbbell

Layout

Header at top, large title text, vertically stacked selection options on the left, and a full-height image on the right.

Notes

Second card down is selected with cream background and checkmark.