Skip to content

Grok

The Grok iOS app, rebuilt in Figma as a working library. Every screen is editable, every component is real and every colour is a variable.

screens
125
flows
36
components
136
icon
1

Version 1 · iOS · Added 12 Nov 2026

Grok Imagine 2 screen

Step through a flow, then import it

36 flows, each in the order it was recorded. Pick one and play it screen by screen, then paste the whole flow into Figma.

Grok flow, step 1: Imagine 6

Step 1 of 9

Tap add in prompt bar

Imagine 6

How you get here: Changes in place

Import this flow

Open the SuperDuper UI plugin in Figma to paste these 9 screens into your file as editable layers.

Open the full flow page

All 9 steps

Every screen, grouped by app area

Paste any screen into your file with the plugin. All of WhatsApp and a complete flow from every app are free.

The foundations come with it

Components, colours and type are Figma components, variables and styles, so you can re-theme every Grok screen in one go.

Components

136 components with their variants, used across every Grok screen.

  • Scrim
  • Scroll fade
  • Scroll indicator
  • App logo
  • App icon tile
  • XAI mark
  • Sign in mark
  • Brand tile
  • Avatar
  • Wordmark
  • XAI accounts mark
  • App icon

Colours

Colour variables with light and dark modes, so you can re-theme every screen in one go.

Type and icons

Text styles for every size, plus 1 icon as components.

Real apps, rebuilt in Figma.

Other libraries give you a picture of the screen. We give you the file: named layers, real components and variables you can change.

screenshot.pngEditable Figma file
9:41

Cancellation policy

Before you book, make sure you’re comfortable
with the Host’s cancellation policy. Keep in mind
that Airbnb’s Extenuating Circumstance policy
doesn’t cover cancellations due to illness or
travel disruptions caused by COVID-19.

Cancel by

25 Oct

16:00

Full refund: Get back 100% of
what you paid

30 Oct

16:00

(check-in)

Partial refund: Get back 50% of
every night but the first one. No
refund of the first night or the
service fee

Learn more about cancellation policies

Learn more about cancellation policies

9:41

Cancellation policy

Before you book, make sure you’re comfortable
with the Host’s cancellation policy. Keep in mind
that Airbnb’s Extenuating Circumstance policy
doesn’t cover cancellations due to illness or
travel disruptions caused by COVID-19.

Cancel by

25 Oct

16:00

Full refund: Get back 100% of
what you paid

30 Oct

16:00

(check-in)

Partial refund: Get back 50% of
every night but the first one. No
refund of the first night or the
service fee

Learn more about cancellation policies

Learn more about cancellation policies

The Airbnb file, as it ships. Every clone is built the same way.

LayersAssets
  • Cancellation policy
  • Nav bar
  • Title
  • Intro
  • Policy row
  • Policy row
  • Refund rule
  • Link

89components with variants

71colour variables, light and dark

63text styles

Questions about the Grok file

  • 125 editable screens across 13 areas of the app, 36 flows in recorded order and 136 components with their variants. Layers are named, colours are variables and text uses styles, so you can edit, restyle and reuse any screen.

Not affiliated with, endorsed or sponsored by Grok. Grok is a trade mark of its owner. Recreated for design reference and education.

Rights holder? Tell us and we reply within 2 working days

Buying for a team? See team options

Get real flows
free in Figma

All of WhatsApp, and a complete flow from every app. No card needed.