Babbel - Language Learning

Colors

• #000000background-black · screen background · cta button text
• #FFFFFFtext-primary · headline · quote text · attribution · pagination active dot · cta fill
• #F4B846star-gold · review rating star icons
• #505050pagination-inactive · carousel indicator inactive dots
• #262628card-border · testimonial card outline
• #CCCCCCtext-legal · subscription terms fine print

Type

• section headerserif · 64px · bold · #FFFFFF
• testimonial quotesans-serif · 36px · regular · #FFFFFF
• testimonial attributionsans-serif · 30px · bold · #FFFFFF
• legal fine printsans-serif · 24px · regular · #CCCCCC
• action button labelsans-serif · 36px · bold · #000000

Elements

• Plan Summary Card (Partial) · card

  Partially cut off at the top edge of the screen · Dark rounded card with plan pricing details

• Social Proof Testimonial Card · carousel card

  Full width rounded rectangle centered in mid-screen · Subtle 1px dark grey outline border with 5 gold stars, centered quote and learner attribution

• Carousel Dots · pagination indicator

  Row of 4 circular dots centered beneath testimonial card · One white active dot and three muted grey inactive dots

• Subscription Terms Paragraph · legal text

  Multiline text block situated above bottom CTA button · Muted grey small sans-serif text detailing renewal policy

• Bottom CTA Button · button

  Full width white pill button anchored at bottom · Solid white fill with centered black label 'Subscribe now'

Layout

Lower scrolled state of the paywall view highlighting customer reviews, subscription disclaimer terms, and sticky footer CTA button.

Notes

Continuation of Screen 5 scroll content.