Skip to content

Dashboards and KPIs (Mobile)

Mobile packData display

Mobile summary homes, KPI cards, balance headers, widget grids, period switchers, insight and goal cards and quick actions.

components
8
variants
25
recreations
3
themes
5

Also for desktop: Dashboards and KPIs

What’s inside

Eight dashboard patterns for phones: summary home screens for money and health, KPI cards with sparklines or week bars, a balance header with hide and multi-currency, widget grids, a period switcher, insight cards, goal cards and quick actions. Charts are vectors sized from their values, and every page includes a full phone screen in context.

  • 8 sets, from KPI cards to full 390 by 844 home screens
  • Charts drawn from their values, with previous period dashed
  • Loading and no-data states on KPI cards
  • 3 recreations of real money, health and sleep apps
  • Summary home, every variant

    Summary home

    3 variants

    • Money
    • Health
    • Loading
  • KPI card, every variant

    KPI card

    Free sample

    5 variants

    • Change
    • Sparkline
    • Week bars
    • Loading
    • No data
  • Balance header, every variant

    Balance header

    3 variants

    • Default
    • Hidden
    • Multi-currency
  • Widget grid, every variant

    Widget grid

    3 variants

    • Two by two
    • Hero chart
    • Mixed
  • Period switcher, every variant

    Period switcher

    3 variants

    • Week
    • Month
    • Year
  • Insight card, every variant

    Insight card

    3 variants

    • Info
    • Good news
    • Needs a look
  • Goal card, every variant

    Goal card

    3 variants

    • On track
    • Behind
    • Reached
  • Quick actions, every variant

    Quick actions

    2 variants

    • Four
    • Three
Figma file
SuperDuper Pack: Dashboards and KPIs (Mobile)
Themes
Light, Dark, Light high contrast, Dark high contrast and Wireframe
Densities
Comfortable and Compact
Also in the file
Usage and accessibility notes, motion specs, Figma variables
Covers 2 screen patterns
Home and Charts & dashboard

How Revolut, Apple Health and Oura do it

Recreations of real products, so you can compare approaches side by side. They are approximate, built from public product knowledge, with placeholder data and no third-party artwork.

  • Money home, every variant

    Money home

    Recreated from Revolut

  • Health summary, every variant

    Health summary

    Recreated from Apple Health

  • Sleep readiness, every variant

    Sleep readiness

    Recreated from Oura

Not affiliated with, endorsed or sponsored by Revolut, Apple Health and Oura. Their names are trade marks of their owners and are used only to say what each recreation is based on.

KPI card, every variant

See the kpi card full size, free

A two-up KPI card showing a change, a sparkline or week bars, plus loading and no-data states. All 5 variants, free to see with a SuperDuperUI account. The Figma file comes with the pack.

  • Avatars, images and placeholders

    Mobile12 components205 variants3 recreations

    Avatars, presence, stacks, story rings, image frames, photo grids and viewers for phone apps, with vector placeholders.

    $9, or included with Pro

  • Cards, tiles and carousels

    Mobile15 components121 variants2 recreations

    Mobile listing, media and stat cards, tiles, shelves, carousels and a swipe stack, with pressed, focus and loading states.

    $9, or included with Pro

  • Lists and rows

    Mobile18 components217 variants3 recreations

    Mobile list rows built on one anatomy: settings, toggles, media, people, chats, transactions and more.

    $9, or included with Pro

Questions about the dashboards and kpis pack

  • One Figma file: SuperDuper Pack: Dashboards and KPIs (Mobile). It has 8 components with 25 variants, 3 recreations, and notes on when to use each part. Everything uses Figma variables, so you can change the colours and type to match your product.