#5 OrionPlayground

Drew a illustration with Google Calendar Style

Recently, I have finished a project, theme Music Player, with Google Calendar Style, and I want to share some experience at here.

Before I clicked my Photoshop, I read the Google Calendar UX Team’s article about how to design this beautiful style. In conclusion, there two main aspects of Calendar’s brand:

Deliberate use of color.
Diverse and inclusive representations of people and activities.
Google Calendar


Google was good at using high contrast color to reveal product’s spirits, such as Bright Sun #FFD733 with Royal Blue #376FE9, it can amplify UI element and help people catch the point quickly.


Shadow is an important element in Google Style’s illustration, it provide important visual cues about objects’ depth and directional movement. In the picture, the book’s shadow was longer than earphone’s, these details made the paint persuasive.

Noise point

Noise points are used to display the shadow and make the illustration like a paper.

Rotate angle

Proper rotate angle make diverse shadow, it usually set as 15°.

Regular graphic

Almost every graphics in Google Style’s illumination were regular, it provided a sense of order.

Like what you read? Give Lin Xiaopeng a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.