Brand

Colors

Color is a powerful brand identifier. It also provides contrast and helps define hierarchy to guide our customers’ attention. We believe that color should be used boldly, but not excessively. Consider the value that color contributes to your message. When someone thinks of Twilio, the first color we want to come to mind is Twilio Red. However, we have an extensive palette of colors beyond red to create a vibrant universe. Our color palette maintains unity across all Twilio properties, from marketing to product design.


Color distribution

It is important to display our colors in the correct relationship with one another. We use bright colors deliberately to guide viewers attention and highlight important pieces of information or to create vibrant illustrations. When selecting colors, consider how familiar your audience is with Twilio.

Rookie audience

A rookie audience has had limited or no exposure to the Twilio brand. For this audience our primary concern is recognition. We emphasize Twilio Red and avoid introducing too many secondary colors.

Veteran audience

A veteran audience has had consistent, repeated exposure to the Twilio brand. For this audience, our primary concern is building a relationship. We use our secondary palette more liberally while we expand the Twilio universe.

Night mode

When an environment demands a subdued brand presence, we have the option of making Night the prominent color. In this context, Twilio Red is used as a highlight color.



Color values

Color values always need to be consistent in all applications. Please reference our color chart below for brand approved RGB, Hex, CMYK, and PMS color values.


Primary palette

Our primary palette defines our brand. When people think of Twilio, they should think of these three colors.

Name
Twilio Red
RGB
242 47 70
Hex
F22F46
CMYK
0 93 79 0
PMS
185
Name
Night
RGB
0 20 137
Hex
001489
CMYK
100 87 0 20
PMS
Reflex Blue
Name
White
RGB
255 255 255
Hex
FFFFF
CMYK
0 0 0 0
PMS
-

Secondary palette

Our secondary palette enables us to create a diverse visual universe. We use these colors to help guide attention through a layout or illustration.

Secondary palette
RGB
HEX
CMYK
PMS
Name
Blue-50 (Cerulean)
RGB
0 140 255
Hex
008CFF
CMYK
75 18 0 0
PMS
2925
Name
Green-50 (Treefrog)
RGB
54 213 118
Hex
36D576
CMYK
64 0 71 0
PMS
7479
Name
Tangerine
RGB
244 124 34
Hex
F47C22
CMYK
0 45 97 0
PMS
3588
Name
Yellow-40 (Egg Yolk)
RGB
255 221 53
Hex
FFDD35
CMYK
5 1 93 0
PMS
3955
Name
Purple-50 (Orchid)
RGB
140 91 216
Hex
8C5BD8
CMYK
54 67 0 0
PMS
265

Extended palette

Our extended palette allows us to create a complete environment. We use these shades to support the primary and secondary color palettes to create depth or hierarchy. These colors should not be seen as dominate in a composition.

Gray

Grays
RGB
HEX
CMYK
PMS
Name
Gray-100
RGB
18 28 45
Hex
121c2d
CMYK
88 63 40 85
PMS
433
Name
Gray-90
RGB
31 48 76
Hex
1F304C
CMYK
- - - -
PMS
-
Name
Gray-80
RGB
57 71 98
Hex
394762
CMYK
78 57 39 56
PMS
432
Name
Gray-70
RGB
75 86 113
Hex
4B5671
CMYK
66 48 33 47
PMS
432 (85%)
Name
Gray-60
RGB
96 107 133
Hex
606B85
CMYK
63 45 34 25
PMS
431
Name
Gray-50
RGB
136 145 170
Hex
8891AA
CMYK
50 34 27 11
PMS
430
Name
Gray-40
RGB
174 178 193
Hex
AEB2C1
CMYK
35 23 19 2
PMS
429
Name
Gray-30
RGB
202 205 216
Hex
CACDD8
CMYK
21 13 8 0
PMS
428
Name
Gray-20
RGB
225 227 234
Hex
E1E3EA
CMYK
11 7 4 0
PMS
428 (50%)
Name
Gray-10
RGB
244 244 246
Hex
F4F4F6
CMYK
5 3 2 0
PMS
428 (25%)

Red

Reds
RGB
HEX
CMYK
PMS
Name
Red-100
RGB
49 12 12
Hex
310c0c
CMYK
- - - -
PMS
-
Name
Red-90
RGB
74 11 11
Hex
4a0b0b
CMYK
28 89 60 77
PMS
2449
Name
Red-80
RGB
117 12 12
Hex
750c0c
CMYK
2 97 72 52
PMS
1815
Name
Red-70
RGB
173 17 17
Hex
ad1111
CMYK
0 97 78 22
PMS
1805
Name
Red-60
RGB
214 31 31
Hex
d61f1f
CMYK
0 92 72 6
PMS
1797
Name
Red-50
RGB
235 86 86
Hex
eb5656
CMYK
0 75 57 0
PMS
178
Name
Red-40
RGB
245 138 138
Hex
f58a8a
CMYK
0 58 29 0
PMS
177
Name
Red-30
RGB
246 177 177
Hex
f6b1b1
CMYK
0 34 9 0
PMS
176
Name
Red-20
RGB
252 207 207
Hex
fccfcf
CMYK
0 17 5 0
PMS
176 (50%)
Name
Red-10
RGB
254 236 236
Hex
feecec
CMYK
0 9 2 0
PMS
176 (25%)

Oranges

Orange
RGB
HEX
CMYK
PMS
Name
Orange-100
RGB
64 19 15
Hex
40130F
CMYK
0 68 100 67
PMS
1545
Name
Orange-90
RGB
84 25 20
Hex
541914
CMYK
0 68 100 67
PMS
1545
Name
Orange-80
RGB
141 49 24
Hex
8D3118
CMYK
0 71 100 38
PMS
1535
Name
Orange-70
RGB
195 83 35
Hex
C35323
CMYK
0 68 100 7
PMS
159
Name
Orange-60
RGB
244 124 34
Hex
F47C22
CMYK
0 62 97 0
PMS
158
Name
Orange-50
RGB
250 153 80
Hex
FA9950
CMYK
0 45 97 0
PMS
3588
Name
Orange-40
RGB
255 179 122
Hex
FFB37A
CMYK
0 30 71 0
PMS
150
Name
Orange-30
RGB
250 194 160
Hex
FAC2A0
CMYK
0 17 47 0
PMS
148
Name
Orange-20
RGB
253 220 196
Hex
FDDCC4
CMYK
0 9 24 0
PMS
148 (50%)
Name
Orange-10
RGB
254 245 238
Hex
FEF5EE
CMYK
0 4 12 0
PMS
148 (25%)

Yellows

Yellows
RGB
HEX
CMYK
PMS
Name
Yellow-100
RGB
61 33 6
Hex
3D2106
CMYK
- - - -
PMS
-
Name
Yellow-90
RGB
84 51 8
Hex
543308
CMYK
19 46 91 67
PMS
7553
Name
Yellow-80
RGB
133 92 21
Hex
855C15
CMYK
0 34 100 36
PMS
132
Name
Yellow-70
RGB
194 142 0
Hex
C28E00
CMYK
0 34 100 18
PMS
3547
Name
Yellow-60
RGB
232 180 7
Hex
E8B407
CMYK
0 20 100 0
PMS
3514
Name
Yellow-50
RGB
250 209 0
Hex
FAD100
CMYK
0 5 100 0
PMS
116
Name
Yellow-40
RGB
255 221 53
Hex
FFDD35
CMYK
0 2 99 0
PMS
108
Name
Yellow-30
RGB
255 233 128
Hex
FFE980
CMYK
1 0 79 0
PMS
106
Name
Yellow-20
RGB
255 241 179
Hex
FFF1B3
CMYK
1 0 40 0
PMS
106 (50%)
Name
Yellow-10
RGB
255 251 234
Hex
FFFBEA
CMYK
0 0 20 0
PMS
106 (25%)

Greens

Greens
RGB
HEX
CMYK
PMS
Name
Green-100
RGB
5 41 18
Hex
052912
CMYK
- - - -
PMS
-
Name
Green-90
RGB
13 58 31
Hex
0D3A1F
CMYK
75 2 100 77
PMS
2411
Name
Greens-80
RGB
11 96 45
Hex
0B602D
CMYK
78 11 84 54
PMS
7483
Name
Green-70
RGB
14 124 58
Hex
0E7C3A
CMYK
91 0 100 26
PMS
356
Name
Green-60
RGB
20 176 83
Hex
14B053
CMYK
81 0 93 0
PMS
7481
Name
Green-50
RGB
54 213 118
Hex
36D576
CMYK
64 0 71 0
PMS
7479
Name
Green-40
RGB
123 234 165
Hex
7BEAA5
CMYK
33 0 29 0
PMS
7478
Name
Green-30
RGB
162 246 195
Hex
A2F6C3
CMYK
21 0 21 0
PMS
2253
Name
Green-20
RGB
209 250 224
Hex
D1FAE0
CMYK
10 0 10 0
PMS
2253 (50%)
Name
Green-10
RGB
237 253 243
Hex
EDFDF3
CMYK
5 0 5 0
PMS
2253 (25%)

Blues

Blues
RGB
HEX
CMYK
PMS
Name
Blue-100
RGB
6 3 58
Hex
06033A
CMYK
- - - -
PMS
-
Name
Blue-90
RGB
3 11 93
Hex
030B5D
CMYK
100 78 0 57
PMS
281
Name
Blue-80
RGB
0 20 137
Hex
001489
CMYK
100 87 0 20
PMS
Reflex Blue
Name
Blue-70
RGB
4 60 181
Hex
043CB5
CMYK
100 76 0 9
PMS
293
Name
Blue-60
RGB
2 99 224
Hex
0263E0
CMYK
100 56 0 3
PMS
300
Name
Blue-50
RGB
0 140 255
Hex
008CFF
CMYK
75 18 0 0
PMS
2925
Name
Blue-40
RGB
102 178 255
Hex
66B2FF
CMYK
55 13 0 0
PMS
292
Name
Blue-30
RGB
153 205 255
Hex
99CDFF
CMYK
38 4 0 0
PMS
291
Name
Blue-20
RGB
204 228 255
Hex
CCE4FF
CMYK
19 2 0 0
PMS
291 (50%)
Name
Blue-10
RGB
235 244 255
Hex
EBF4FF
CMYK
10 1 0 0
PMS
291 (25%)

Purples

Purple
RGB
HEX
CMYK
PMS
Name
Purple-100
RGB
22 4 51
Hex
160433
CMYK
- - - -
PMS
-
Name
Purple-90
RGB
34 9 74
Hex
22094A
CMYK
89 100 0 58
PMS
2695
Name
Purple-80
RGB
56 14 120
Hex
380E78
CMYK
97 100 0 19
PMS
2685
Name
Purple-70
RGB
88 23 189
Hex
5817BD
CMYK
81 99 0 0
PMS
267
Name
Purple-60
RGB
109 46 209
Hex
6D2ED1
CMYK
71 88 0 0
PMS
266
Name
Purple-50
RGB
140 91 216
Hex
8C5BD8
CMYK
54 67 0 0
PMS
265
Name
Purple-40
RGB
166 127 227
Hex
A67FE3
CMYK
39 56 0 0
PMS
2577
Name
Purple-30
RGB
200 175 240
Hex
C8AFF0
CMYK
24 38 0 0
PMS
2567
Name
Purple-20
RGB
231 220 250
Hex
E7DCFA
CMYK
12 19 0 0
PMS
2567 (50%)
Name
Purple-10
RGB
245 240 252
Hex
F5F0FC
CMYK
6 10 0 0
PMS
2567 (25%)
Accessibility and color

We are committed to following AA standard contrast ratios. We select colors with sufficient contrast so that our content is legible to all customers.

Are your colors accessible?