Mullvad VPN

Colors

• #1d2d44Dark Navy Background · background
• #ffffffWhite Text · titles · body text · account number
• #388e3cGreen Button · button fill

Type

• TitleSF Pro · 42px · bold · #ffffff
• BodySF Pro · 26px · regular · #ffffff
• Account NumberSF Pro · 32px · semibold · #ffffff
• ButtonSF Pro · 28px · semibold · #ffffff

Elements

• Add Time Button · button

  Bottom of the screen, full-width with padding · Green solid rounded rectangle with white text

• Copy Icon · icon

  Adjacent to the account number · White outline copy clipboard icon

• Info Icon · icon

  Next to device name · White info circle icon

Layout

Success state screen displaying congratulatory message, newly generated account number with copy button, device name, descriptive explanatory text, and a primary 'Add time' button at the bottom.

Notes

Account creation success screen.