Substack

Colors

• #FFFFFFBackground White · screen surface
• #242424Primary Dark · header title
• #3CA3F9Focused Border Blue · input active border
• #D1D5DBKeyboard Gray · virtual keyboard background
• #FFFFFFKeycap White · individual keyboard key face
• #F0F0F2Disabled Button Fill · action button background
• #B0B3BADisabled Button Text · action button label

Type

• Step HeaderNewsreader · 72px · 700 · #242424
• Keyboard Key LabelsSF Pro Text · 44px · 400 · #000000

Elements

• Email Text Input · input_field

  Width ~984px, height ~130px, horizontal margins 48px · Sky blue border stroke with inner placeholder text

• Continue Action Button · button

  Placed above virtual keyboard, width ~984px, height ~116px · Muted gray disabled button

• System Virtual Keyboard · keyboard

  Docked at the bottom of viewport, full screen width, height ~820px · QWERTY layout with rounded rectangular white keycaps on soft gray backing plate

Layout

Form screen with soft keyboard docked at the bottom; submit button is elevated directly above the keyboard tray.

Notes

Standard iOS style alphanumeric keyboard overlay.