Illustration

To-do lists are a balancing act. So is Thumbtack’s illustration style. Here's how it all fits together.

Illustration style

Every Thumbtack illustration is made up of abstract pieces, carefully assembled into one balanced structure. The pieces build on each other to mimic the momentum of checking off your to-do’s.

Illustrations have a ratio of 1:1, with at least 50px padding on each side. The background should always be pure white (#ffffff).

Illustration attributes

Monuments
Characters build abstract pieces into impressive structures.

Interactive
Characters can confidently create their environments. No task is too big or small.

Balanced
Elements are carefully assembled. Every piece has its place.

Grounded
Monuments are supported by a black foundation.

Harmony
Shapes and lines of different weights are balanced out with positive and negative space.

Transparency
Like thin pieces of paper, subtle color overlays create a handcrafted look.

Using color

Black and blue are the main colors, with indigo as a secondary hue and yellow as an accent. Save green for things that are actually green — like trees or money. Add depth by using different tints from the color palette.

Thumbtack blue
009FD9
RGB - 0, 159, 217
CMYK - 75, 21, 0, 0

3EB6E3
RGB - 62, 182, 227
CMYK -

99DAF0
RGB - 153, 218, 240
CMYK -

D1ECF7
RGB - 209, 236, 247
CMYK -

Black
2F3033
RGB - 47, 48, 51
CMYK - 72, 65, 60, 59

Indigo
5968E2
RGB - 89, 104, 226
CMYK - 72, 64, 0, 0

808BE8
RGB - 128, 139, 232
CMYK -

9CA4EF
RGB - 156, 164, 239
CMYK -

BDC3F3
RGB - 189, 195, 243
CMYK -

DFE1FA
RGB - 223, 225, 250
CMYK -

Yellow
FEBE14
RGB - 254, 190, 20
CMYK -

FFDD80
RGB - 255, 221, 128
CMYK -

FFEBB3
RGB - 255, 235, 179
CMYK -

Small

Small illustrations are used alongside copy or calls to action. They’re usually balanced clusters of one to three symbols. Keep it minimal and don’t add lots of detail or characters. Dimensions should be no larger than 70px.

Medium

Medium illustrations are used in product to represent features, encourage an action or accompany empty states. They have three to five elements, but don’t usually feature characters. Dimensions are no larger than 500px.

Large

Large illustrations can be used at key moments in the product. They feature characters that build or interact with monuments. Don’t make it a party; stick to three people at most. Keep dimensions between 180px and 1600px wide.