Calorie Counter +

Colors

• #0f7d9dteal_gradient_top · background_top
• #1ebcaateal_gradient_bottom · background_bottom
• #189aa4input_table_fill · text_input_container
• #a3d8dfplaceholder_text_teal · input_placeholder_color
• #f5a623trophy_gold · illustration_trophy
• #e74c3cpot_coral · illustration_plant_pot
• #ffffffpure_white · text_primary · checkbox_check · logo_apple

Type

• page_titleSF Pro Display · 40px · 400 · #ffffff
• field_placeholderSF Pro Text · 44px · 400 · #a3d8df
• explanatory_bodySF Pro Text · 38px · 400 · #ffffff
• checkbox_labelSF Pro Text · 36px · 400 · #ffffff

Elements

• app_branding_logo · image

  Top center, apple-shaped silhouette with internal text badge, approx 140x130 px · White apple silhouette with purple and teal split-pill badge reading 'nutra check'

• registration_form_inputs · form_control

  Centered grouped inputs spanning approx 92% width, containing First Name, Email, and Password · Rounded translucent rectangular container with hairline row dividers

• newsletter_consent_checkbox · checkbox

  Left-aligned next to multi-line consent text, size ~56x56 px · Square border with white checkmark overlay

• motivational_spot_illustration · illustration

  Centered above bottom bar, width ~480 px height ~220 px · Vector illustration depicting two figures holding a golden trophy and a person beside a potted plant labeled SAVE

Layout

Stacked onboarding form: top logo and screen title, grouped text inputs, legal/informational copy, opted-in consent checkbox with label, decorative accomplishment illustration, and bottom navigation bar.

Notes

Row dividers within the input table use a 1px slightly darker cyan stroke.