Heyyyy: Stories that text back

Colors

• #F9F8FBScreen Background · Screen background canvas
• #25215AHeader Navy · Feature headline typography
• #E2DFEBCard Border · Container border and internal dividers
• #9C0CE5Level Badge Gradient Start · Level 10 badge gradient start
• #4B44E8Level Badge Gradient End · Level 10 badge gradient end
• #F3F1F8Bubble Light Grey · Message bubbles
• #8C18E6Send Button Violet · Input send action button
• #5A45E5Dot Active · Current page indicator dot
• #D1CDDCDot Inactive · Inactive page indicator dots

Type

• Feature Headline-apple-system · 34px · 800 · #25215A
• Contact Header Name-apple-system · 24px · 700 · #25215A
• Badge Text-apple-system · 20px · 700 · #FFFFFF
• Chat Bubble Text-apple-system · 26px · 500 · #25215A
• Input Placeholder-apple-system · 24px · 500 · #64627E

Elements

• Navigation Bar · navigation_bar

  Top row with back chevron and header 'They remember everything.'. · Left chevron and bold navy typography.

• Chat Frame Card · card

  Central rounded white bordered card simulating chat UI. · White background, thin stroke border, contains high-affinity level state.

• Relationship Level Badge · badge

  Placed on right side of top contact bar in chat card; pill badge ~120px wide. · Purple-to-blue gradient fill with text 'Level 10 🔥'.

• Message Thread · chat_bubble_group

  Left-aligned message bubbles: 'had fun last night..', 'for you 🥰', and portrait photo in pink bikini. · Subtle grey rounded bubbles with emoji and rounded photo message.

• Chat Input Field · input_group

  Docked at bottom of card with placeholder 'Message...' and send arrow icon. · Pill-style input box with violet circle send button.

• Carousel Indicator · pagination_dots

  Row of 3 dots centered below chat frame; 3rd dot is active (purple). · Two muted grey dots followed by one active indigo/purple dot.

Layout

Third slide in the feature onboarding carousel demonstrating advanced interaction ('Level 10' progression) and persistent memory feature.

Notes

Pagination dot index 3 reflects third slide in the introductory carousel.