Our icons use a consistent line weight that lends a light, airy feeling. They provide a better experience by ensuring clear communication of our brand, from online booking to in-flight experience.
Icons can be used sparingly as visual helpers. Overuse can overwhelm or distract our users.
Common uses for icons are:
Icons convey secondary visual information, so they should be ignored by screen readers; text should be sufficient to convey meaning to non-sighted users.
If an icon is used as a standalone way of conveying information, color contrast rules should apply.
American Airlines uses a custom icon font to display icons for the user interface on aa.com. This custom font contains 144 glyphs used in various interface elements on aa.com.
People
.icon-people
code = \10e000
Attendant
.icon-attendant
code = \10e001
Stairs
.icon-stairs
code = \10e002
Escalator down
.icon-escalator-b
code = \10e003
Escalator up
.icon-escalator
code = \10e004
Hotel
.icon-hotel
code = \10e005
Special assistance
.icon-specialAssistance
code = \10e006
Seats
.icon-seats
code = \10e007
Carseat
.icon-carseat
code = \10e008
Stroller
.icon-stroller
code = \10e009
Check in
.icon-checkin
code = \10e00a
Book
.icon-book
code = \10e00b
Account
.icon-account
code = \10e00c
Join
.icon-join
code = \10e00d
Suitcase
.icon-suitcase
code = \10e00e
Two bags
.icon-twobags
code = \10e00f
Three bags
.icon-threebags
code = \10e010
Check bags
.icon-checkbags
code = \10e011
Trolley
.icon-Trolley
code = \10e012
Bag info
.icon-baginfo
code = \10e013
Flight
.icon-flight
code = \10e014
Car
.icon-car
code = \10e015
Taxi
.icon-taxi
code = \10e016
Vacation
.icon-vacation
code = \10e017
Activity
.icon-activity
code = \10e018
Entertainment
.icon-entertainment
code = \10e019
Cruise
.icon-cruise
code = \10e01a
Food
.icon-food
code = \10e01b
Food purchase
.icon-foodpurchase
code = \10e01c
Snack
.icon-snack
code = \10e01d
Drink
.icon-drink
code = \10e01e
Coffee
.icon-coffee
code = \10e01f
No smoking
.icon-nosmoking
code = \10e020
Payment
.icon-payment
code = \10e021
Cash
.icon-cash
code = \10e022
Scan swipe
.icon-scanswipe
code = \10e023
Promotion
.icon-promotion
code = \10e024
Boarding pass
.icon-boardingpass
code = \10e025
One day pass
.icon-onedaypass
code = \10e026
Mobile
.icon-mobile
code = \10e027
No mobile
.icon-nomobile
code = \10e028
Game
.icon-game
code = \10e029
Contact
.icon-contact
code = \10e02a
.icon-print
code = \10e02b
Website
.icon-website
code = \10e02c
.icon-email
code = \10e02d
Clock
.icon-clock
code = \10e02e
WiFi
.icon-wifi
code = \10e02f
Location
.icon-location
code = \10e030
Maps
.icon-maps
code = \10e031
GPS
.icon-gps
code = \10e032
Home
.icon-home
code = \10e033
Notifications
.icon-notifications
code = \10e034
Feedback
.icon-feedback
code = \10e035
Settings
.icon-settings
code = \10e036
Tools
.icon-tools
code = \10e037
Login
.icon-login
code = \10e038
Search
.icon-search
code = \10e039
Calendar
.icon-calendar
code = \10e03a
Help
.icon-help
code = \10e03b
Info
.icon-info
code = \10e03c
Error
.icon-error
code = \10e03d
Warning
.icon-warning
code = \10e03e
New page
.icon-newpage
code = \10e03f
Arrow up
.icon-arrow-up
code = \10e040
Arrow down
.icon-arrow-down
code = \10e041
Arrow left
.icon-arrow-left
code = \10e042
Arrow right
.icon-arrow-right
code = \10e043
Circle up
.icon-circle-up
code = \10e044
Circle down
.icon-circle-down
code = \10e046
Circle left
.icon-circle-left
code = \10e047
Circle right
.icon-circle-right
code = \10e048
Check
.icon-check
code = \10e049
Cancel
.icon-cancel
code = \10e04a
Circle check
.icon-circle-check
code = \10e04b
Close
.icon-close
code = \10e04c
More
.icon-more-13px
code = \10e04d
Collapse
.icon-collapse
code = \10e04e
Expand
.icon-expand
code = \10e04f
Explosives
.icon-explosives
code = \10e050
Bullets
.icon-bullets
code = \10e051
Fireworks
.icon-fireworks
code = \10e052
Gas cylinder 45°
.icon-gascylinder45
code = \10e053
Oxygen tank
.icon-oxygentank
code = \10e054
Aerosol
.icon-aerosol
code = \10e055
Gas cylinder
.icon-gascylinder
code = \10e056
Radioactive
.icon-radioactive
code = \10e057
Flammable
.icon-flammable
code = \10e058
Gas can
.icon-gascan
code = \10e059
Match
.icon-match
code = \10e05a
Nail polish remover
.icon-nailpolishremover
code = \10e05b
Chainsaw smooth
.icon-chainsawsmooth
code = \10e05c
Chainsaw
.icon-chainsaw
code = \10e05d
Lighter and fluid
.icon-lighterandfluid
code = \10e05e
Corrosive
.icon-corrosive
code = \10e05f
E-cigarette
.icon-ecigar
code = \10e076
Oxidizer
.icon-oxidizer
code = \10e060
Bleach
.icon-bleach
code = \10e061
Hydrogen peroxide
.icon-hydrogenperoxide
code = \10e062
Ajax comet
.icon-ajaxcomet
code = \10e063
Skull and bones
.icon-skullandbones
code = \10e064
Skull and bones bottle
.icon-skullandbonesbottle
code = \10e065
Skull and bones box
.icon-skullandbonesbox
code = \10e066
Car battery
.icon-carbattery
code = \10e067
Lightning bolt
.icon-lightningbolt
code = \10e068
Lithium ion
.icon-lithiumion
code = \10e069
Drill
.icon-drill
code = \10e06a
Edit
.icon-edit
code = \10e06b
List
.icon-list
code = \10e06c
Menu
.icon-menu
code = \10e06d
Power port
.icon-power-port
code = \10e06e
Clothes hanger
.icon-clothes-hanger
code = \10e06f
Delete
.icon-delete
code = \10e070
Add
.icon-add
code = \10e071
Preferences
.icon-preferences
code = \10e072
Like
.icon-like
code = \10e073
Document
.icon-doc
code = \10e074
Pets
.icon-pets
code = \10e075
Locate
.icon-locate
code = \10e089
Handbag
.icon-handbag
code = \10e900
Briefcase
.icon-briefcase
code = \10e901
Book bag
.icon-bookbag
code = \10e902
Carry on
.icon-carryon
code = \10e903
Ban
.icon-ban
code = \10e904
Image
.icon-image
code = \10e087
Trash
.icon-trash
code = \10e088
Fast Wi-Fi
.icon-high-speed-wifi
code = \1e090
Power plug
.icon-power-plug
code = \1e091
Powder
.icon-powder
code = \1e092