Heyyyy: Stories that text back

Colors

• #13141Fmodal_dim · dimmed_scrim_background
• #FFFFFFdialog_surface · modal_card_surface
• #EBE9FDbell_circle_bg · icon_backdrop
• #4C38EAbell_color · bell_icon_tint
• #1A1B4Btext_title · dialog_headline
• #535878text_body · dialog_message
• #EFF0F4btn_cancel_bg · secondary_button_fill
• #535878btn_cancel_text · secondary_button_text
• #761BE5btn_confirm_bg · primary_button_fill
• #FFFFFFbtn_confirm_text · primary_button_text

Type

• dialog_titleSF Pro Display · 52px · 800 · #1A1B4B
• dialog_bodySF Pro Text · 38px · 400 · #535878
• button_labelSF Pro Text · 42px · 600 · #FFFFFF
• secondary_button_labelSF Pro Text · 42px · 600 · #535878

Elements

• notification_modal · modal_dialog

  Centered floating card covering center portion of screen · White rounded card with soft shadows over blurred/dimmed swipe screen

• bell_icon_container · icon_badge

  Top-centered inside modal, 180x180px circle · Circular light lavender badge containing a saturated indigo bell icon

• modal_actions · button_group

  Two equal pill buttons side by side at bottom of modal card, approx 110px height each · Left button light grey fill with dark text, right button saturated violet-purple fill with white text

Layout

Modal permission prompt overlaid on top of dimmed character profile screen with paired action buttons.

Notes

Underlying character image is a different shot/photo in the set, showing active navigation beneath.