Storytel - Audiobooks Library

Colors

• #111111text-primary · page title · language item label
• #333333text-secondary · description paragraph
• #FF4400accent-orange · selected checkbox fill
• #767676border-grey · unselected checkbox border
• #111111button-black · continue button background

Type

• screen-titleMontserrat · 50px · 800 · #111111
• body-descriptionMontserrat · 32px · 400 · #333333
• list-item-titleMontserrat · 34px · 600 · #111111
• button-labelMontserrat · 34px · 700 · #FFFFFF

Elements

• language_row · list_item

  Repeated vertical list, left label with right-aligned checkbox icon, approx 110px vertical spacing per row · Clean background without explicit dividers; checkbox has rounded square outline (or orange fill with white checkmark when selected)

• continue_button · button

  Bottom-pinned floating button, height 112px, side margins 44px · Black rounded pill with white bold label, overlaying content with a soft fade gradient background

Layout

Centered onboarding selection screen with centered title and instructions, followed by a vertically scrollable checkbox list of available languages, and pinned bottom CTA.

Notes

Bottom gradient mask overlays the scrollable list above the button.