BetterMe Well-Being Coach

Colors

• #0a0a0aBackground Black · background
• #e8dfd8Card Selected Beige · selected_option_background
• #1b1918Card Dark · unselected_option_background
• #ffffffText White · title · unselected_text
• #1b1918Text Dark · selected_text

Type

• titlesans-serif · 28px · bold · #ffffff
• option_labelsans-serif · 16px · medium · #1b1918

Elements

• Title · text

  Top center · White multi-line question heading

• Option 1-2 times · card_radio

  Stacked list item 1 · Dark card with circular radio button

• Option 3-4 times · card_radio

  Stacked list item 2, selected · Beige card with checked radio button

• Option 5+ times · card_radio

  Stacked list item 3 · Dark card with circular radio button

• Model Squatting · image

  Right side · Fitness model performing a squat pose

Layout

Quiz step asking training frequency with three selectable radio cards on the left and a supporting fitness model illustration on the right.

Notes

Radio button selection pattern demonstrated.