Please enable Javascript
Skip to main content

Iconography

Our iconography is connected to our typography at a fundamental level to maximize recognition and ownability. Icons and their usage principles were designed to communicate quickly and effectively across all touchpoints (from product to environment to marketing).

Taxonomy

System icons

Dimensional icons

Badges

System icons

Our icon system is inspired by transportation iconography. It aims to be bold, communicative, and hard-working. Each icon has an outlined and filled version. Filled versions work well at small sizes in product, while the outlined version works better in signage and marketing.

Taxonomy

Rider

Move

Location

Work

Airport

Arrive

Vehicle

Bus

Ferry

Construction

All icons should be drawn on a 24x24px grid frame, with a 3px stroke width for outlines. Each frame includes keylines and a 1px padding on all sides as guidance. However, it’s acceptable to go beyond the padding or off the keylines if doing so improves the optical balance of the icon.

Filled icon

24 x 24 px grid

Linear icon

24 x 24 px grid

Container

In cases where the icon is contained inside a circle, the diameter of the circle can be determined by doubling the width of the icon. Icons should be optically centered within the container.

Filled icon

2x (48x48px grid)

Linear icon

2x (48x48px grid)

Dimensional icons

Dimensional icons are based on our system icon language, specifically designed for usage in cases such as VR and AR.

System icon

Skewed icon

Icon should be skewed based on the perspective of the generated environments.

Dimensional icon

Dimensional icons should still feel graphic without skeuomorphic properties, using solid colors to differentiate the surfaces.

Applications

Banner

Billboard

Web

App

Notification and activity logs

Summary

01

Our icons are inspired by transportation

02

Iconography is functional and expressive

03

Build equity in the arrow