Quizlet: More than Flashcards

Colors

• #0b0c1ecanvas-background · screen background
• #21283einput-surface · date picker field background · back button circle fill
• #848d9finput-placeholder · input field placeholder text · info icon stroke
• #21283edisabled-cta · disabled button surface
• #475168disabled-text · disabled button label
• #ffffffprimary-text · page heading · body description

Type

• page-titleHurme Geometric Sans · 58px · 700 · #ffffff
• page-subtitleHurme Geometric Sans · 34px · 400 · #ffffff
• input-textHurme Geometric Sans · 38px · 600 · #848d9f
• legal-disclaimerHurme Geometric Sans · 28px · 500 · #ffffff

Elements

• back-button · icon_button

  top left navigation area, 44px top margin, 68px left margin, size 112px x 112px · circular dark surface fill with centered left-pointing white arrow

• birth-date-input · input_field

  full width with 68px margins, height 140px, below descriptive text · dark charcoal rounded rectangular container with placeholder text and trailing circular info icon

• signup-button · button

  full width with 68px horizontal margin, height 130px, 48px below terms disclaimer · disabled state flat dark surface with muted low-contrast text

Layout

Form screen with circular back button in top navigation, left-aligned header title and body, full-width input card, center-aligned legal disclaimer, and disabled pill submit CTA.

Notes

Date picker wheel is closed in this state.