Bible Chat: Daily Devotional

Colors

• #EFF2ECbackground-sage · screen background
• #E9EEE6input-surface · text input container fill
• #DCE2D8input-border · text input container border
• #252B20text-primary · screen headline text
• #6C7467text-secondary · subtitle text · privacy note text
• #9BA397placeholder-text · input field placeholder text
• #B1B9ABbutton-disabled-fill · inactive cta button fill
• #3E4637button-disabled-text · inactive cta button label

Type

• titleGeorgia · 44px · 700 · #252B20
• bodySF Pro Text · 24px · 400 · #6C7467
• placeholderSF Pro Text · 24px · 400 · #9BA397
• captionSF Pro Text · 20px · 400 · #6C7467
• buttonSF Pro Text · 26px · 600 · #3E4637

Elements

• top-progress-bar · indicator

  Centered horizontally near top at 126px, width 800px, height 8px. · Track filled roughly 90% with olive green.

• freetext-input-card · input-field

  Centered below subtitle, 58px side margins, height approx 210px. · Subtly darker sage-tinted rectangle with rounded corners, thin 1px stroke, top-left aligned placeholder text.

• privacy-note · label

  Centered directly below input box, 24px vertical margin. · Plain secondary text indicating data privacy.

• build-plan-button · button

  Bottom-anchored, 126px above bottom screen edge, height 96px, 58px margins. · Disabled light sage pill button with 'Build My Plan' text and right chevron.

Layout

Open-ended input step in onboarding flow with multi-line text input field, caption disclaimer, and bottom action button.

Notes

CTA changes text from 'Continue' to 'Build My Plan' to reflect concluding stage of onboarding.