Icons
Icons are used for drawing an attention to specific actions.
Guidelines
For guidelines on how to use the icons, see the icon component.
Icon colors
You can usually have icons inherit their color from the surrounding text. If you need a standalone icon, select from a status color or one of our icon colors:
colorIconPrimary
colorIconPrimary
#252A31
rgb(37, 42, 49)
colorIconSecondary
colorIconSecondary
#5F738C
rgb(95, 115, 140)
colorIconTertiary
colorIconTertiary
#BAC7D5
rgb(186, 199, 213)
Using icons
In Sketch
All our icons our directly in the root of our Sketch library.
In React
In the mobile application
We have the icon font ready for use in mobile applications, copy the code of the icon you need and apply where necessary.
Outside of our codebase
If you need to use our icons outside of our React environment or mobile apps, you have 3 ways of doing so.
- Find the icon you want in the list below and download the SVG or copy its source.
- Download the whole icon set as a ZIP file.
- Download a PNG file for any icon through the Orbit icon CDN.
List of icons
-
QR-codeE193
-
accommodationE085
-
account-circleE134
-
air-conditioningE184
-
airplane0061
-
airplane-downE101
-
airplane-landing0025
-
airplane-returnE159
-
airplane-takeoff002a
-
airplane-upE160
-
airplane-up-offE102
-
airport-securityE035
-
alertE07F
-
alert-circle0055
-
allE061
-
anywhere0067
-
appleE199
-
arrow-downE0A0
-
arrow-upE09F
-
atmE02C
-
attachmentE104
-
baggage-cabinE106
-
baggage-cabin-noneE174
-
baggage-checked0068
-
baggage-checked-noneE021
-
baggage-personal-itemE156
-
baggage-personal-item-noneE175
-
baggage-recheckE105
-
baggage-setE107
-
baggage-storageE147
-
billing-detailsE108
-
boarding-gateE00A
-
boatE139
-
bug004e
-
bus003c
-
cakeE187
-
calendar0066
-
calendar-anytime0041
-
calendar-range007a
-
calendar-trip-lengthE109
-
cameraE017
-
carE03A
-
car-doorE185
-
car-rentalE030
-
chartE176
-
chat0039
-
check0056
-
check-circle0053
-
chevron-double-leftE202
-
chevron-double-rightE203
-
chevron-downE09D
-
chevron-left0021
-
chevron-rightE01F
-
chevron-up006d
-
childE050
-
child-friendlyE05D
-
circleE013
-
circle-emptyE179
-
circle-filledE180
-
circle-smallE148
-
city0063
-
clock0065
-
close0058
-
close-circle0074
-
cocktailE038
-
codeE141
-
coffeeE02F
-
color-pickerE200
-
compareE155
-
compassE07E
-
contact-email0076
-
credit-card0075
-
customer-supportE194
-
dealsE142
-
device-desktopE158
-
device-mobileE157
-
diamondE197
-
documentE110
-
downloadE014
-
duplicateE154
-
edit0045
-
edit-offE00D
-
email0047
-
entertainmentE06E
-
exchangeE032
-
facebookE002
-
feedbackE140
-
filters0026
-
flight-direct0043
-
flight-multicity005d
-
flight-nomadE150
-
flight-return0073
-
flight-servicesE049
-
fuelE183
-
full-screenE0A6
-
full-screen-offE111
-
galleryE064
-
gender-manE152
-
gender-womanE151
-
googleE003
-
gps-fixed0022
-
gps-iosE161
-
gps-not-fixedE191
-
gps-offE01C
-
gridE06D
-
gymE089
-
historyE153
-
infantE186
-
information-circle0052
-
instagramE112
-
insurance0027
-
insurance-confirmed0072
-
insurance-off003a
-
invoiceE113
-
item-completedE149
-
kiwicomE143
-
kiwicom-careE144
-
kiwicom-guaranteeE145
-
leisureE178
-
linkE057
-
linkedinE114
-
listE115
-
location0024
-
location-a006a
-
location-add003f
-
location-b006b
-
location-c005e
-
location-d005f
-
location-e0060
-
location-f007b
-
location-g007c
-
location-h007d
-
location-i007e
-
location-j005c
-
lockE169
-
lock-openE170
-
logoutE0A7
-
loungeE04E
-
mapE001
-
markdownE201
-
mealE116
-
menu-hamburger0044
-
menu-kebabE117
-
menu-meatballsE07D
-
messagesE135
-
messages-outlineE136
-
minusE118
-
minus-circleE119
-
money0040
-
money-transfer-inE167
-
money-transfer-outE168
-
moonE090
-
musical-instrumentsE086
-
new-windowE05E
-
nonstopE120
-
notificationE018
-
notification-addE195
-
notification-offE023
-
notification-onE025
-
online-checkinE00F
-
online-checkin-offE00E
-
outlookE181
-
paidE121
-
parkingE03E
-
partnersE164
-
passenger0077
-
passenger-add0029
-
passenger-outlineE137
-
passenger-removeE173
-
passengers0028
-
passport0051
-
petE043
-
pharmacyE034
-
phoneE058
-
playgroundE053
-
plusE122
-
plus-circleE027
-
poolE123
-
power-plugE06F
-
power-plug-off0033
-
priority-boardingE08D
-
profitE166
-
promo-codeE081
-
question-circle0046
-
radarE198
-
radius-search0064
-
refundE165
-
relaxE046
-
reload0032
-
remove0057
-
replace0049
-
restaurant0031
-
route-no-stops006f
-
route-one-stop0071
-
route-two-stops0070
-
searchE07C
-
seatE02A
-
seat-aisleE189
-
seat-extra-legroomE190
-
seat-windowE188
-
securityE146
-
self-transferE020
-
send004d
-
settings0038
-
shareE016
-
share-androidE068
-
share-iosE163
-
shoppingE036
-
show-lessE124
-
show-moreE125
-
sightseeingE015
-
smokingE037
-
smoking-offE126
-
sortE171
-
spaE04A
-
sport-equipmentE127
-
sportsE042
-
star-emptyE08C
-
star-full0023
-
subwayE06A
-
suitcaseE02D
-
sunE096
-
sunriseE08E
-
taxi003b
-
terminalE196
-
terms-and-conditionsE0A4
-
thumb-downE128
-
thumb-upE01B
-
ticket002e
-
ticket-outlineE138
-
timelapseE000
-
timerE177
-
tipsE047
-
toiletsE129
-
trainE028
-
transmissionE182
-
tripE130
-
twitterE131
-
uberE162
-
uploadE172
-
user-groupE192
-
visaE132
-
visibilityE005
-
visibility-offE004
-
walkE052
-
walletE133
-
wheelchairE088
-
wifiE062
-
wifi-off005a
Any icons missing?
Request it on #plz-orbit on Kiwi.com Slack, in our Spectrum community, or as a Github issue.