Iconography

Overview

Firefox desktop has 3 standard icon sizes:

12×12

This size is typically used for badging.

16×16

This is the default icon size.

20×20

This size is primarily used for navigation icons in about:preferences.

Larger sizes

Any larger sizes are for edge cases only and should be used sparingly.

Library

If you need usage clarification or help choosing an appropriate icon for your project, please reach out to #acorn-design-system on Slack.

add-12

add-circle-fill-12

airplane-12

audio-12

unmute

audio-smaller-12

unmute

audio-muted-12

audio-muted-smaller-12

barbell-12

bike-12

bookmarks-12

Alias: star

book-12

Alias: school

briefcase-12

Alias: work

bookmark-fill-12

Use for badging search results

close-12

close-circle-fill-12

chevron-down-12

chevron-left-12

chevron-right-12

chevron-up-12

craft-12

diamond-12

email-mask-12

email-shield-12

external-link-12

Action, open, new window, new tab, arrow

flower-12

Alias: miscellaneous

gift-box-12

globe-12

hammer-12

heart-12

Alias: personal

heart-rate-12

leaf-12

makeup-12

media-fill-12

Use for badge in tab, auto-play, media

media-blocked-fill-12

Use for badge in tab, auto-play blocked, media blocked

media-fill-no-circle-12

Use for badge in tab, auto-play, media playing

musical-note-12

notification-fill-12

Use to badge App Menu, Downloads, FxA avatars

palette-12

paw-print-12

pause-fill-12

play-fill-12

pin-fill-12

Use for badging search results, new tab sites

search-12

soccer-ball-12

sync-12

Use for menu status animation of syncing... Appears in FxA menu or app menu

shopping-cart-12

sparkle-single-12

video-game-controller-12

warning-fill-12

Use for badging app menu, downloads, and FxA avatars

No results found for your search.

add-16

Plus

add-circle-fill-16

Use: Zoom In in App Menu

Plus

add-text-16

PDF.js

all-tabs-16

Use: to indicate All Tabs or Tab tray.
Note: for desktop, this icon is not in use atm, chevron-down is the current "all-tabs" icon to open the menu [March 2022]

app-menu-16

app-menu-space-16

arrow-clockwise-16

Rotate, refresh, direction

arrow-counterclockwise-16

Rotate, refresh, direction, counter

arrow-down-line-16

navigation, end, jump to end, last arrow

arrow-trending-16

Alias: trending, staggered, staggering, up

audio-16

Speaker, sound on, playing, volume

audio-muted-16

Speaker, sound off, muted, mute, volume

auto Play-16

avatar-signed-in-fill-16

FxA

avatar-signed-in-fill-custom-initial-16

FxA, first initial, generic, generated

avatar-signed-out-16

FxA

back-16

barbell-16

bike-16

book-16

Alias: school

bookmark-16

Alias: star

bookmark-fill-16

Alias: star, saved

bookmarks-tray-16

Alias: star, tray

blocked-popup-16

briefcase-16

Alias: work

camera-16

Video, web RTC, camera

camera-16

canvas-16

Image, thumbnail

checkmark-16

Success

checkmark-circle-fill-16

Success

chevron-down-16

chevron-down-small-16

chevron-double-right-16

chevron-left-16

chevron-right-16

chevron-up-16

close-16

X, cross

close-circle-fill-16

X, cross

closed-caption-16

Subtitle

closed-tabs-16

recent, recently, tab

color-picker-16

dropper, eyedropper, sample, tool

competitiveness-16

competition, competitor, trophy

craft-16

critical-16

critical-fill-16

cryptominer-16

current-view-16

Eye, visible, visibility, page

cursor-arrow-16

Pointer, mouse, text selection tool

data-clearance-16

fire, clear, private, end, session

delete-16

garbage can, bin, trash, remove, control, action

globe-16

globe, site icon, world, website, www, placeholder, profile

device-mobile-16

phone, cellphone

diamond-16

downloads-16

Use: Toolbar.

Arrow Down, tray

error-16

error-fill-16

edit-16

edit-16

Pencil, action, control

edit-active-16

edit-active-16

Use: Edit in active state only.

Pencil, pen

edit-squiggle-16

edit-squiggle-16

Pencil, write, draw, scribble

email-mask-16

email-shield-16

even-spreads-16

View, page

export-data-16

Arrow, save

extension-16

Puzzle, piece, add-ons

extension-critical-16

Puzzle, piece, add-ons

extension-fill-16

Puzzle, piece, add-ons

external-link-16

Action, open, new window, new tab, arrow

extension-warning-16

Puzzle, piece, add-ons

find-in-page-16

fingerprinter-16

flower-16

Alias: miscellaneous

folder-16

folder-arrow-down-16

Save, file, download

folder-fill-16

footprints-16

Shoe prints

forward-16

forward-small-16

fullscreen-disabled-16

Use: App menu.

Arrow, action, control, view

fullscreen-expand-16

Use: App menu.

Arrow, action, control, maximize, view

fullscreen-exit-16

Use: App menu.

Arrow, action, control., close, minimize, view

fx-view-16

firefox view, cabinet, file, filing, archive

gift-16

present, what's new, profile

hammer-16

hand-16

Hands, palm, finger, touch, five, gesture, move

heart-16

Alias: personal

heart-rate-16

help-16

help-fill-16

highlighter-16

history-16

Clock, recent, places, time, past

home-16

Use: Toolbar.

House, navigation

horizontal-scrolling-16

Scroll, mouse, view, page

image-tracker-16

import-data-16

Arrow, save

import-export-16

Arrow up, arrow down, data

information-16

Info, document properties

information-fill-16

layer-16

Layers, reveal, square

leaf-16

library-16

Book, books, saved data, places

lightbulb-16

list-16

Sort, document, outline

line-arrow-up-16

navigation, beginning, back to start, first arrow

list-arrow-left-16

Sort, document, outline

local-host-16

local-network-16

location-16

Map marker, pin, geo-location, location

lock-16

Security, SSL, HTTPS, safe, encrypted

lock-document-16

Security, SSL, HTTPS, safe, encrypted, note

lock-insecure-16

Security, SSL, HTTP, unsafe, alert, notification.

Note: Add red color to the slash (relies on Light/Dark Theme)

lock-warning-16

Security, SSL, HTTP, unsafe, alert, notification, triangle, exclamation mark

login-16

Key, password manager

makeup-16

mic-16

Microphone, audio, speakers

midi-16

Music, musical note

newsfeed-16

no-spreads-16

Default, view, single, page

notifications-16

Message, text bubble

odd-spreads-16

View, page

open-tabs-16

tab

packaging-16

package, parcel, box

page-actions-16

Overflow, 3 dots, more, meatball, menu

page-landscape-16

Horizontal, print, orientation, format, page, document, outline, paper, file

page-portrait-16

Vertical, print, orientation, format, page, document, outline, paper, file

page-scrolling-16

Arrows, arrow up and down, controls, scroll up, scroll down, current

page-thumbnails-16

Image, view, sort, preview, page, pages, show

palette-16

paperclip-16

Attach, attachment, file

passkey-16

User

pause-fill-16

Control, action

paw-print-16

permission-16

Use: Address bar.

Permission, settings

picture-in-picture-closed-16

Media, pop out video, control, action, exit

picture-in-picture-open-16

Media, pop out video, control, action

pin-16

Thumbtack

pin-fill-16

Thumbtack

plane-16

play-fill-16

Control, action

playback-forward-16

Media, forward, fast, player, track, control

playback-rewind-16

Media, rewind, back, player, track, control

plugin-16

Lego, building block

pocket-16

pocket-fill-16

popup-subitem-16

Arrow, down, nested, indent

price-16

tag

presentation-mode-16

Present, display, play, view, page

print-16

Printer, device, page

private-mode-circle-fill-16

Mask, incognito, ghost

private-mode-fill-16

Mask, incognito, ghost

quality-16

check

reader-mode-16

Page, view, text-only

screenshare-16

search-16

Magnifying glass, find

search-in-circle-16

Magnifying glass, find

search-in-circle-right-16

Magnifying glass, find

settings-16

Gear, cog, preferences

share-macOS-16

Arrow, up, tray

share-winOS-16

Arrow, right

shield-16

ETP, enhanced tracking protection, trackers, protection panel

shipping-16

truck

show password-16

Eye, visible, show, hide

shopping-16

checker, review

shopping-cart-16

sidebar-collapsed-16

sidebar-collapsed-right-16

sidebar-left-16

Customize, view

sidebar-expanded-16

sidebar-expanded-right-16

sidebar-hidden-16

sidebar-right-16

Customize, view

soccer-ball-16

social-tracker-16

Thumbs down, dislike

sort-16

List, order, filter

sparkles-16

Star, magic, AI

sparkle-single-16

storage-16

Hard drive

subtract-16

Zoom out, minus, remove

subtract-circle-fill-16

Use: Zoom Out in App Menu.

Minus, remove

sync-16

FxA, arrows

synced-tabs-16

Devices, desktop, mobile, computer, phone

tab-16

tab-group-16

taskbar-add-tab-16

taskbar-move-tab-16

taskbar-remove-tab-16

text-cursor-16

i-cursor, i-beam, vertical line

themes-16

Paintbrush, colorways, add-ons

top-sites-16

Grid, boxes, new tab

tracking-cookies-16

trending-16

Lightning bolt, new tab, flash, bowie, thunderbolt, electric, Pikachu

update-16

update-circle-fill-16

vertical-scrolling-16

Scroll, mouse, view, page

vertical-tabs-16

video-game-controller-16

warning-16

warning-fill-16

window-16

wrapped-scrolling-16

Wrap, page, current, view

xr-16

Augmented reality, virtual, virtual reality, extended reality, mixed reality, goggles

No results found for your search.

add-20

Alias: plus

airplane-20

barbell-20

bike-20

book-20

Alias: school

bookmark-20

Alias: star

briefcase-20

Alias: work

color-picker-20

dropper, eyedropper, sample, tool

competitiveness-20

competition, competitor, trophy

content-width-20

Alias: reader view, content, text

craft-20

critical-20

Exclamation mark.

critical-fill-20

Exclamation mark.

globe-20

Globe. Site Icon. World. Website. Web site. Placeholder. Profile.

delete-20

Garbage can, bin, trash. Remove.

diamond-20

email-mask-20

email-shield-20

extension-20

Puzzle piece. Add-ons.

extension-fill-20

Puzzle piece. Fill. Add-ons.

experiments-20

Atom. Molecule.

flower-20

Alias: miscellaneous

gift-20

present, what's new, profile

hammer-20

heart-20

Alias: personal

heart-rate-20

help-20

Support. Learn more. Question mark.

help-fill-20

Support. Learn more. Question mark.

highlights-20

Stars. Sparkles. Magic.

history-20

Clock, recent, places, time, past

home-20

House. Base.

information-20

Alert. Notification.

information-fill-20

Alert. Notification.

justify-center-20

Alias: reader view, content, text

justify-left-20

Alias: reader view, content, text

justify-right-20

Alias: reader view, content, text

languages-20

leaf-20

letter-spacing-20

Alias: reader view, content, text

line-spacing-20

Alias: reader view, content, text

lock-20

Security. SSL.

makeup-20

musical-note-20

newsfeed-20

palette-20

paw-print-20

plugin-20

Permission. Lego. Building block.

private-mode-circle-fill-20

Mask. Fill. Hidden. Incognito. Ghost. color #8000D7

search-20

Magnifying Glass. Find. Look.

settings-20

Gear. Cog. Preferences.

shield-20

ETP.

shield-blocked-20

ETP.

shopping-cart-20

skip-backward-20

Alias: narrate, narration, control

skip-forward-20

Alias: narrate, narration, control

soccer-ball-20

sparkle-single-20

stocks-20

price, market, chart

sync-20

Arrows. FxA.

tab-tray-20

Alias: tabs, all tabs

thumbs-down-20

rate, rating

themes-20

Paintbrush. Colorways. Add-ons.

thumbs-up-20

rate, rating

update-circle-20

Arrow. Up.

video-game-controller-20

warning-20

Alert. Notification. Exclamation point mark. Triangle

warning-fill-20

Alert. Notification. Exclamation point mark. Triangle

word-spacing-20

Alias: reader view, content, text

No results found for your search.

baseball-32

basketball-32

cricket-32

bat

football-32

golf-32

ball

hockey-32

stick

racing-32

flag, checkered

soccer-ball-32

football,

No results found for your search.

bookmark-40

Alias: star

book-40

Alias: school

briefcase-40

Alias: work

flower-40

Alias: miscellaneous

heart-40

Alias: personal

shopping-cart-40

No results found for your search.