Tokens

Tokens(Android)

Design variables that power Thumbtack’s UI.

Version:12.1.1 View sourceChangelogReport issue
Install:implementation 'com.github.thumbtack:thumbprint-tokens:v12.1.1'
Import:import com.github.thumbtack.thumbprinttokens.R

Color

These are the colors we use at Thumbtack.

Token NameValue
tp_blue_100
#eaf6fa
tp_blue_200
#b3ebff
tp_blue_300
#79d2f2
tp_blue
#009fd9
tp_blue_500
#007fad
tp_blue_600
#005979
tp_indigo_100
#e8f1fd
tp_indigo_200
#cce1ff
tp_indigo_300
#96c2ff
tp_indigo
#5968e2
tp_indigo_500
#4f54b3
tp_indigo_600
#383c80
tp_purple_100
#f5efff
tp_purple_200
#dfccff
tp_purple_300
#c9acfd
tp_purple
#8d56eb
tp_purple_500
#6637b6
tp_purple_600
#492782
tp_green_100
#e1fdf3
tp_green_200
#c6f7da
tp_green_300
#73e4a2
tp_green
#2db783
tp_green_500
#16855b
tp_green_600
#054e33
tp_yellow_100
#fdf7e7
tp_yellow_200
#ffebb3
tp_yellow_300
#ffdd80
tp_yellow
#febe14
tp_yellow_500
#a77005
tp_yellow_600
#714601
tp_red_100
#ffeff0
tp_red_200
#ffd9d9
tp_red_300
#ffb0b0
tp_red
#ff5a5f
tp_red_500
#b22d31
tp_red_600
#7d0d10
tp_black_300
#676d73
tp_black
#2f3033
tp_gray_200
#fafafa
tp_gray_300
#e9eced
tp_gray
#d3d4d5
tp_white
#ffffff

Duration

Token NameValue
tp_duration_1
75
tp_duration_2
150
tp_duration_3
200
tp_duration_4
250
tp_duration_5
300
tp_duration_6
350

Scrim

Values for transparent light and dark curtains that cover content.

Token NameValue
tp_scrim_light_80
#ccffffff
tp_scrim_dark_80
#cc000000

Space

Token NameValue
tp_space_1
4dp
tp_space_2
8dp
tp_space_3
16dp
tp_space_4
24dp
tp_space_5
32dp
tp_space_6
48dp
Was this page helpful?

We use this feedback to improve the quality of our documentation.