UX Framework
Icons
Search the component library

Icons

v2.5.0-beta.1
Download UI Kit v1.9.0 Code

This component provides a standard set of UI icons across Pearson applications.

Download UI Kit v1.9.0 Code

Usage Guidelines

Use Pearson icons with a purpose. Do not use them as decorations or alter their intended use.

Features

  • 18px and 24px icons
  • CSS class
  • Guidelines

Dependencies

Colors v3.0.1

Documents

UX Accessibility Checklist

Documentation Assets (Sketch)

Pearson Icons

Pearson icons are available in two sizes, 18x18 and 24x24 pixels. You can incorporate them into your design by downloading the Pearson-icons.sketch file, located above.

Note: All icons are fixed within 18x18 and 24x24 pixels container.

For desktop web app development

Use 18x18 pixel icons in your designs. You do not need to provide SVG or backup PNG, simply note the class name from the icons list or within the Pearson-icons.sketch file.

For mobile app development

Use 18x18 pixel icons a your foundation and up-scale 24x24 pixel icons for larger screens.

General icons

Adobe Acrobat
Archive
Ban
Book
Breadcrumb
Calendar
Camera
Camera-video
Capslock
Check-lg
Check-sm
Chevron-back
Chevron-next
Chevron-back-sm
Chevron-next-sm
Comment
Clock
Delete
Download
Upload
Edit
Ellipsis
Email
File
File-Excel
File-PDF
File-Powerpoint
File-Word
Flip Card
Font-lg
Font-sm
Font-setting
Person
Group
Help-fill
Help-outline
Image
Info-fill
Info-outline
Link
Note
Notification
Point-back
Point-next
Print
Remove-lg
Remove-sm
Search-lg
Search-sm
Settings
Shopping Cart
Tip
Warning
General    
adobe-acrobat-18 adobe-acrobat-24
archive-18 archive-24
ban-18 ban-24
book-18 book-24
breadcrumb-18 breadcrumb-24
calendar-18 calendar-24
camera-18 camera-24
camera-video-18 camera-video-24
capslock-18 capslock-24
check-lg-18 check-lg-24
check-sm-18 check-sm-24
chevron-back-18 chevron-back-24
chevron-next-18 chevron-next-24
chevron-back-sm-18 chevron-back-sm-24
chevron-next-sm-18 chevron-next-sm-24
comment-18 comment-24
clock-18 clock-24
delete-18 delete-24
desktop-18 desktop-24
download-18 download-24
upload-18 upload-24
edit-18 edit-24
ellipsis-18 ellipsis-24
email-18 email-24
file-18 file-24
file-excel-18 file-excel-24
file-pdf-18 file-pdf-24
file-powerpoint-18 file-powerpoint-24
file-word-18 file-word-24
flip-card-18 flip-card-24
font-lg-18 font-lg-24
font-sm-18 font-sm-24
font-setting-18 font-setting-24
person-18 person-24
group-18 group-24
help-fill-18 help-fill-24
help-outline-18 help-outline-24
image-18 image-24
info-fill-18 info-fill-24
info-outline-18 info-outline-24
link-18 link-24
note-18 note-24
notification-18 notification-24
point-back-18 point-back-24
point-next-18 point-next-24
print-18 print-24
remove-lg-18 remove-lg-24
remove-sm-18 remove-sm-24
search-lg-18 search-lg-24
search-sm-18 search-sm-24
settings-18 settings-24
shopping-cart-18 shopping-cart-24
tip-18 tip-24
warning-18 warning-24

Player icons

Audio-off
Audio-high
Audio-low
Pause
Play
Screen-full
Screen-minimize
Player    
audio-off-18 audio-off-24
audio-high-18 audio-high-24
audio-low-18 audio-low-24
pause-18 pause-24
play-18 play-24
screen-full-18 screen-full-24
screen-minimize-18 screen-minimize-24

Toggle icons

Bookmark-off
Bookmark-on
Checkbox-off
Checkbox-on
Checkbox-tristate
Dropdown-close-sm
Dropdown-open-sm
Favorite-off
Favorite-on
Item-add
Item-remove
Lock-close
Lock-open
Pivot-close
Pivot-open
Radio-button-off
Radio-button-on
Show-off
Show-on
Sortable
Sort-down
Sort-up
View-list
View-tile
Zoom-in
Zoom-out
Toggle    
bookmark-off-18 bookmark-off-24
bookmark-on-18 bookmark-on-24
checkbox-off-18 checkbox-off-24
checkbox-on-18 checkbox-on-24
checkbox-tristate-18 checkbox-tristate-24
dropdown-close-18 dropdown-close-24
dropdown-open-18 dropdown-open-24
dropdown-close-sm-18 dropdown-close-sm-24
dropdown-open-sm-18 dropdown-open-sm-24
favorite-off-18 favorite-off-24
favorite-on-18 favorite-on-24
item-add-18 item-add-24
item-remove-18 item-remove-24
lock-close-18 lock-close-24
lock-open-18 lock-open-24
pivot-close-18 pivot-close-24
pivot-open-18 pivot-open-24
radio-button-off-18 radio-button-off-24
radio-button-on-18 radio-button-on-24
show-off-18 show-off-24
show-on-18 show-on-24
sortable-18 sortable-on-24
sort-down-18 sort-down-24
sort-up-18 sort-up-24
view-list-18 view-list-24
view-tile-18 view-tile-24
zoom-in-18 zoom-in-24
zoom-out-18 zoom-out-24

Name Guide

The name describes the intended use, variation, and pixel size.

Colors

Standard Colors:

Status Colors: (optional)

Label Spacing

Use a minimum spacing, 10 pixel, between the icon and label.

Touch Target

You can use Pearson icons as buttons. To ensure accessibility across desktop and mobile devices, a minimum touch target, 44 x 44 pixel, is required for each icon.

Changelog

2.5.0-beta.1

  • NEW ICONS: adobe-acrobat, comment, download, upload, file-excel, file-pdf, file-powerpoint, file-word, flip-card, shopping-cart

2.4.0-beta.1

  • ADDED: Icon recommendations for desktop web apps and mobile apps
  • NEW ICONS: Breadcrumb, Link
  • FIXED: Copy in the example image for Name Guide

2.3.0-beta.2

  • ADDED: Feature links
  • CHANGED: Updated name guide

2.3.0-beta.1

  • ADDED: print-18, print-24, and updated pixel containers
  • REMOVED: Scaling information

2.2.0

  • ADDED: sortable-18, sortable-24

2.1.0

  • ADDED: dropdown-sm, chevron-sm, sort, ellipsis, edit
  • TWEAKED: checkbox, radio-button, help-outline, info-outline

2.0.0

Updated icons to use new branding style

1.1.0

  • ADDED: question-circle, caret-right, caret-down, light-bulb-o, and icons for archive action, plus reading, business case, video, and image content types
  • TWEAKED: Icons should now all be displayed in Pitch (#231f20)

1.0.0

Initial release