Icons

Basic

AlertIcon

ArrowDownLeftIcon

ArrowDownRightIcon

ArrowDownIcon

ArrowLeftIcon

ArrowRightIcon

ArrowUpLeftIcon

ArrowUpRightIcon

ArrowUpIcon

BackwardLastIcon

BackwardIcon

BrandsMilesAndMoreIcon

CheckCircleOutlineIcon

CheckCircleSolidIcon

ChevronDownIcon

ChevronLeftIcon

ChevronRightIcon

ChevronUpIcon

ClockIcon

CloseCircleOutlineIcon

CloseCircleSolidIcon

CloseIcon

CogIcon

CompassIcon

CrosshairsIcon

DirectionArrowCircleOutlineIcon

DirectionArrowOutlineIcon

DirectionArrowSolidIcon

DoubleArrowUpIcon

DownloadIcon

EnvelopeReinviteIcon

EnvelopeIcon

FaceIdIcon

ForwardLastIcon

ForwardIcon

GlobeIcon

HeartOutlineIcon

HeartSolidIcon

InfoCircleOutlineIcon

InfoCircleSolidIcon

KeyboardAlphabeticalIcon

KeyboardNumericIcon

KeyboardIcon

LegalBannerOutlineIcon

LegalBannerSolidIcon

ListIcon

LockClosedIcon

LockOpenIcon

MagnifyingGlassIcon

MenuIcon

PhoneIcon

PlusCircleOutlineIcon

PlusCircleSolidIcon

QrCodeIcon

QuestionmarkIcon

SettingsIcon

ShareIcon

SheetOutlineIcon

SheetSolidIcon

ShieldIcon

SpeechbubblesPairIcon

SpeechbubblesSingleIcon

SpeedometerIcon

StarCircleSolidIcon

StopWatchIcon

TouchIdIcon

TrashBinIcon

TravelExpensesIcon

PlusIcon

TrophyIcon

LightningIcon

PenIcon

Trip

BriefcaseIcon

CalendarCheckedIcon

CalendarIcon

DestinationIcon

FlashlightOffIcon

FlashlightOnIcon

GiftIcon

HouseIcon

LabelCheckedIcon

LabelPlusIcon

LabelIcon

MapIcon

MortarboardIcon

PedestrianIcon

PersonOutlineIcon

PersonSolidIcon

PickUpIcon

PinIcon

StarOutlineIcon

StarSolidIcon

SurgeCircleOutlineIcon

SurgeCircleSolidIcon

WrenchIcon

ChangeDestinationIcon

FlagOutlineIcon

Battery/Fuel

Battery10Icon

Battery100Icon

Battery25Icon

Battery50Icon

Battery75Icon

BatteryChargingIcon

BatteryEmptyIcon

BatteryGenericIcon

Fuel0Icon

Fuel10Icon

Fuel100Icon

Fuel25Icon

Fuel50Icon

Fuel75Icon

FuelGenericIcon

Multimobility

BikeRiderOutlineIcon

BikeRiderSolidIcon

BlackCabOutlineIcon

BlackCabSolidIcon

BusOutlineIcon

BusSolidIcon

CarOutlineIcon

CarSolidIcon

FreeNowArrowIcon

PersonHailingOutlineIcon

PersonHailingSolidIcon

ScooterOutlineIcon

ScooterSolidIcon

TrainOutlineIcon

TrainSolidIcon

Options

BrandsConcurIcon

BrandsMercedesIcon

DogIcon

DriverHeartIcon

FavoriteBannerOutlineIcon

FavoriteBannerSolidIcon

ParcelIcon

PlaneIcon

SpeechbubblesCommentIcon

VanIcon

Payment

AmericanExpressIcon

ApplePayIcon

BankNoteIcon

CreditCardPlusIcon

CreditCardIcon

GooglePayIcon

MastercardIcon

PayPalIcon

VisaIcon

CalculatorIcon

DigitalPaymentIcon

TippingIcon

WalletIcon

VoucherIcon

Service Types

28x28

TwoPeopleCircleIcon

BoltCircleIcon

LeafCircleIcon

WheelchairCircleIcon

LiteCircleIcon

24x24

TwoPeopleOutlineIcon

BoltOutlineIcon

LeafOutlineIcon

WheelchairOutlineIcon

LabelOutlineIcon

TwoPeopleSolidIcon

BoltSolidIcon

LeafSolidIcon

WheelchairSolidIcon

LabelSolidIcon

Inline icons

12x12

InfoCircleOutlineIcon

LabelSolidIcon

SurgeCircleSolidIcon

Flags

code="EU"

code="DE"

code="AT"

code="NL"

code="BE"

code="ES"

code="PE"

code="RO"

code="IT"

code="SE"

It is also possible to preview all flags included in this library with the selector below.

Design Documentation

Specs

Icon sizes
Default (24px)Service Types (28px)Inline (12px)

The content of an icon should remain inside of the inner safe zone and should only extend into the padding between the save and trim area if additional visual weight is needed. Do not place any part of the icon outside of the trim area.

Gap

Used as unique brand styleNot used when meaning of icon breaksNot used in multimobility icons

Most of the icons contain an open edge which is part of our unique brand style. The 2x width gap is only used in icons, where it is not breaking the meaning of the icon. The multimodality icons, which are used in the tab bar are not including the gap.

Corner Radius

Combination of 2px and 0px corder radius for solidityReplacing a circle shape with 2px corner radius used on four cornersDon’t add corner radius of 2px to every circle if it breaks the meaning of the icon

The border radius of 2px is used in every icon where it makes sense. The corner radius is based on our UI components e.g. buttons and annotations. Often it is a combination of 2px and 0px border radius to create a round and friendly but also stable icon.

Color

Colors for fuel/battery icons to indicate remaining percentExternal icons such e.g. the Paypal icon uses their own brand colorsActive/selected tab bar icons are colored in Action Blue 900

The default color for our icons is Authentic Blue 900.

Outline