Praktika – AI Language Tutor

Colors

• #FFFFFFWhite · background
• #000000Black · primary text
• #7A2EFFPurple · button background · input border
• #F8F8FAGray · card background
• #F5A623Gold · star ratings · decorative elements

Type

• titleSF Pro Display · 28px · bold · #000000
• bodySF Pro Text · 16px · regular · #333333
• buttonSF Pro Text · 18px · semibold · #FFFFFF

Elements

• Progress Indicator · bar

  Centered near the top, composed of 6 dashed segments. · Green solid segments with rounded ends.

• Email Input Field · text_field

  Centered below subtitle, featuring label and prefilled text. · Rounded rectangle with a purple border and white background.

• Continue Button · button

  Full width with horizontal margins, located below the terms text. · Solid purple rounded pill shape with white text.

• Social Proof Card · card

  Centered at the bottom of the screen, containing rating stats. · Light off-white card background with subtle shadow.

Layout

Vertical column arrangement with top progress bar, header text, input box, terms disclaimer, call-to-action button, and a bottom social proof card.

Notes

Font choices are estimated based on standard iOS system typography.