Sam

Wanna do lunch?
Sam
Wanna do lunch?
Sam
Wanna do lunch?
Sam
Wanna do lunch?
Sam
Wanna do lunch?
632
Sam
Wanna do lunch?
632
Sam
Wanna do lunch?
632
Ok Google
Ambient mode while device is being
charged
Interactive mode while device is
being charged
Interactive mode with hotword
Ok Google Ok Google
632 632 632
104 DP
MAX
HEIGHT
12 DP
2 DP
52 DP
14 DP
14 DP
8 DP
Ambient mode while device is being
charged
Google Custom
Hotword + Indicator Position
Hotword appears when entering
interactive mode and disappears
after 3 seconds
12 DP
8 DP BLOCK
32 DP BLOCK
Ok Google
Ok Google
Ok Google
Snippet text Snippet text
ROBOTO LIGHT 16 SP
Position: BOTTOM Position: MIDDLE Position: TOP
12 DP
86 DP
8 DP
8 DP BLOCK
24 DP BLOCK
CENTER RIGHT
14 DP
14 DP
96 DP
40 DP
MIN CARD
14 DP
14 DP
12 DP
LEFT CENTER RIGHT LEFT CENTER RIGHT LEFT
40 DP
MIN CARD
36 DP
118 DP
64 DP
104 DP
MAX
HEIGHT
12 DP 12 DP 8 DP 8 DP
Snippet text
Ok Google
Ok Google
LEFT
14 DP
14 DP 16 DP
18 DP
COLOR #000
OPACITY 30%
12 DP
System indicator background
protection.
8 DP BLOCK
Archive
Labels with two lines
look like this
Reply
ROBOTO LIGHT 16 SP ROBOTO LIGHT 20 SP
16 DP
12 DP
104 DP
104 DP
16 DP 16 DP 16 DP
24 DP 24 DP
12 DP
8 DP BLOCK
64 DP ICON
ASSET SIZE
Big action buttons cast a dark
scrim over the background.
Overlay #000 at 50% opacity.
Big actions use big icons.
ic_full_*
BLUE CIRCLE
COLOR #2878ff
PRESSED
COLOR #2955C5
104 DP
48 DP
INTERIOR
Label with one line
Labels with two lines
look like this
Reply
Sam
Wanna do lunch?
632
CURRENT PAGE
NEXT PAGE
12 DP
8 DP
8 DP BLOCK
Sam Blitzstein
Sam Blitzstein
Wanna do lunch?
632
632
ROBOTO LIGHT 16 SP
COLOR #434343
40 DP
Regular peek card Short peek card with custom
clockface
12 DP
8 DP BLOCK
12 DP 8 DP
8 DP
8 DP
8 DP
Sam Blitzstein
8 DP BLOCK
On long press, grow dot
outward from center.
Apply 50% black on top of
background.
Press state for quit button.
RED CIRCLE
COLOR #ff5151
ic_full_cancel
PRESSED
COLOR #b83120
104 DP
100% DOMINANT COLOR
OVERLAY
20% #000
100% DOMINANT COLOR
OVERLAY
20% #000
100% DOMINANT COLOR
OVERLAY
20% #000
Blue Bird
Standard two line
text notication
Fire
Standard two line
text notication
Snapper
Standard two line
text notication
8 DP BLOCK
Money
Money Money
(Remix)
Naomi Pilgrim
Naomi Pilgrim
Money Money
(Remix)
Naomi Pilgrim
ROBOTO LIGHT CONDENSED 20 SP
COLOR #a2a2a2
ROBOTO LIGHT CONDENSED 16 SP
COLOR #434343
12 DP
2 DP
12 DP 12 DP
8 DP 12 DP 12 DP 8 DP 12 DP
20 DP
20 DP
20 DP
Artist one line only
Track title on two lines max
Artist one line only
Track title on one line
8 DP BLOCK 32 DP ICON
12 DP
12 DP
2 DP
Artist
Track title
Previous Next Thumbs up
ROBOTO LIGHT 20 SP
16 DP
12 DP
104 DP
104 DP
16 DP 16 DP 16 DP
24 DP 24 DP
12 DP
8 DP BLOCK
64 DP ICON
ASSET SIZE
Big action buttons cast a dark
scrim over the background.
Overlay #000 at 50% opacity.
Big actions use big icons.
ic_full_*
BLUE CIRCLE
COLOR #2878ff
PRESSED
COLOR #2955C5
104 DP
48 DP
INTERIOR
Label with one line
+3 more
ROBOTO LIGHT 14 SP
#434343
12 DP
36 DP
Airplane mode
Enabled
Dont forget
your phone!
Battery is at
20%
632 632 632
32 DP ICON 24 DP INTERIOR
COLOR #434343
12 DP
12 DP
8 DP 12 DP 12 DP
20 DP
20 DP
Dismissable card added to
stack.
ic_alert_airplanemode
When breaking connection with
your phone, vibrate and dosplay
this card. ic_alert_nophone
When battery is at 20%
ic_alert_lowbattery
8 DP BLOCK 32 DP ICON
Roboto Condensed Light
20 SP
32 DP APP ICON
12 DP
16 DP
16 DP
12 DP
12 DP 12 DP
12 DP
12 DP
16 DP 16 DP 12 DP
8 DP BLOCK
Card title
Card title
Large 40
Cras nec enim in
felis vulputate sed
malesuada a vitae
blandit ipsum.
32 DP APP ICON
12 DP
12 DP
4 DP
4 DP
16 DP 12 DP
12 DP
12 DP
16 DP 12 DP
8 DP BLOCK
Card title
Card Body
PRIMARY TEXT COLOR
#434343
SECONDARY TEXT COLOR
#a2a2a2
ROBOTO CONDENSED LIGHT
SIZE 20 SP
ROBOTO CONDENSED LIGHT
SIZE 20 SP
Abc
Abc
30th and Mission
Navigate to
30th and Mission
Navigate to
ROBOTO LIGHT CONDENSED 20 SP
COLOR #a2a2a2
ROBOTO LIGHT CONDENSED 16 SP
COLOR #434343
12 DP
2 DP
12 DP
8 DP 12 DP 12 DP
12 DP
32 DP
8 DP BLOCK 32 DP ICON
32 DP ICON 24 DP INTERIOR
Header
Secondary
64 DP ICON
ASSET SIZE
GREEN CIRCLE
COLOR #1ce8b5
104 DP
48 DP
INTERIOR
Austin Robison
Standard two line
text notication
Austin Robison
Standard three line
text notication will
look just like this
Austin Robison
Standard four line
text notication will
look just like this
example here
632 632 632
96 DP
96 DP 96 DP
8 DP BLOCK
Every line of text adds 24 DP
to the height of the card.
Oh man thats so cool!
If a card is any taller than
96 DP we have to push a bit
of it below the fold.
Austin Robison
Standard ve line
text notication will
look just like this
example here that
contains ve lines
Austin Robison
This is an example
of the maximum
card height before
we truncate, fanny
pack umami kitsch
authentic pop-up
bicycle rights wolf
moon cardigan
Austin Robison
This is an example
of a card exceeding
the max height and
truncating the card.
Tapping this card
will expand the
card and reveal
more text
632 632 632
96 DP 96 DP 96 DP
8 DP BLOCK
Taller than 240 DP or 9 lines
of text? We fade you out at the
bottom and truncate you.
9 lines of text, or 240 DP is
safe. This is the max size
before we need to truncate.
Cond Light 20
Cond Light 20
gluten-free vneck
Austin Robison
Standard four line
text notication will
look just like this
example here
Austin Robison
This is an example
of a card exceeding
the max height and
truncating the card.
Tapping this card
will expand the
card and reveal
more text
632 632 632
28 DP
96 DP
28 DP
24 DP
16 DP
12 DP
12 DP
8 DP BLOCK 32 DP APP ICON
COLOR #a2a2a2
COLOR #434343
16 DP
12 DP
28 DP 28 DP
24 DP
24 DP
24 DP
24 DP
24 DP
24 DP
24 DP
24 DP
24 DP
24 DP
16 DP
16 DP
Header
Body
Austin Robison
Standard two line
text notication
Cond Light 20
Cond Light 20 SP
Austin Robison
Standard one line!
632 632 632
28 DP
28 DP
16 DP
12 DP
72 DP
8 DP BLOCK
This just so happens to be the
smallest card youll ever see.
Imagine that. Its only 72 DP!
At 96 DP, this sucker is the
tallest card that will ever float
on your home screen.