Substack

Colors

• #FFFFFFBackground White · screen background · primary button text · secondary button background
• #242424Primary Dark · headline · secondary button text
• #595959Body Text Muted · email instructions paragraph
• #FE5C00Brand Orange Accent · primary button fill · inline text action link
• #E0E0E0Code Box Border · digit input box outline · resend button outline

Type

• TitleNewsreader · 72px · 700 · #242424
• Body InstructionsSF Pro Text · 34px · 400 · #595959
• Action Link TextSF Pro Text · 34px · 500 · #FE5C00
• Primary Button TextSF Pro Text · 36px · 600 · #FFFFFF
• Secondary Button TextSF Pro Text · 36px · 600 · #242424

Elements

• OTP Code Input Group · pin_input

  Row of 6 boxes evenly spaced across width (~144px wide by ~168px high each), gap ~22px · Rounded rectangle cells with thin light gray border and centered dot placeholder

• Open email app Button · button

  Bottom action area, width ~984px, height ~120px · Filled vibrant orange with white centered bold text

• Resend email Button · button

  24px below primary button, width ~984px, height ~120px · Outlined white button with 1px gray border and dark text

Layout

Verification flow layout: navigation back button, serif page header, instructive paragraph with inline fallback link, 6-digit pin code entry, and paired action buttons at the bottom.

Notes

PIN input cells each contain a subtle placeholder dot prior to user entry.