Praktika – AI Language Tutor

Colors

• #f1eaffBackground Lavender · screen background · container fill
• #7f1dfdPrimary Purple · continue button fill · progress indicator
• #111111Text Dark · headings · body text
• #ffffffWhite · button text · avatar background

Type

• titleSF Pro Display · 34px · bold · #111111
• bodySF Pro Text · 28px · bold · #111111
• subtitleSF Pro Text · 14px · normal · #111111
• buttonSF Pro Text · 16px · semibold · #ffffff

Elements

• Progress Bar · indicator

  Top center, spanning horizontally with segmented pills · Green and purple active indicators with grey inactive tracks

• Back Arrow · button

  Top left corner · Black stroke icon

• Human Tutor Avatar · avatar

  Upper left section with cost tags below · Circular photo with border and dollar emoji stack

• Praktika Tutor Avatar · avatar

  Upper right section with purple gradient background and dollar tag · Circular 3D character illustration

• Continue Button · button

  Bottom anchored, full width with horizontal margins · Solid vibrant purple fill with white text

Layout

Top-to-bottom onboarding flow featuring progress indicator, header text, comparative avatar cards, pricing comparison callout, and a fixed bottom CTA button.

Notes

Font guessed as SF Pro based on iOS system defaults. Colors sampled from dominant regions.