Icons

Our icon set includes those shown below. The typical pattern for these is to use an <i> tag with a class as indicated below.


General Guidelines

Icons are an effective way to enforce the purpose of an experience. Icons are broken out into two main categories: Actions and Features. In order to ensure that the icons are adding to the clarity of an experience and not creating confusion, we adhere to two principles.

Actions take priority over features.

Example:

Add Product, the add action take priority over the Product feature. Add Product and Add Post both carry the add icon.

Feature icons are reserved for their feature.

Example:

Marketing uses the Megaphone icon. We do not use the megaphone icon for other treatments such as an in-app announcement.


Action Icons

add

Add Actions

check

Confirm Actions

copy

Copy & Clone Actions

customize

Customize Actions

download

Download Actions

gear

Configure Actions

handle

Drag Actions

launch

Leave Experience Actions

pen

Edit Actions

preview-on

Preview Actions

remove

Clear Actions

search

Search Actions

trash

Delete Actions

upload

Upload Actions


Feature Icons

automations

Automations

calendar-date

Events

cart

Checkout

cart-add

Checkout

chart

Analytics

comment

Comments

coupon

Coupons

drop

Drip

filters

Filters

folder

Categories

folder-group

Sub Categories

form

Forms

mail

Email Broadcasts

megaphone

Marketing

monitor

Website

product

Products

refresh

Email Sequences

user-circle

People

user-star

Partners


Dialogue Icons

check-circle

Confirmation Dialogues

danger

Danger Dialogues

flag

Announcement Dialogues

info-circle

Information Dialogues

question-circle

Help Dialogues

warning

Warning Dialogues


All Icons

access-key

add

add-circle

add-image

add-small

align-center

align-justify

align-left

align-right

archive

arrow-corner

arrow-down

arrow-left

arrow-right

arrow-up

assessment

at-sign

attach

automations

ban

bank

bell

blog

bold

broadcast

calendar-date

calendar-schedule

calendar-simple

card-amex

card-android

card-apple

card-discover

card-generic

card-mastercard

card-paypal

card-stripe

card-update

card-visa

caret-down

caret-left

caret-right

caret-up

cart

cart-add

chart

chart-filled

check

check-circle

check-circle-filled

circle-1

circle-2

circle-3

circle-4

circle-5

circle-6

circle-7

circle-8

circle-9

clock

closed-captions

code

color

columns

comment

connect

contact

conversation

copy

coupon

course

credit-card

custom-field

customize

danger

danger-filled

delete-circle

delete-key

delete-x

dollar

dot-menu-horizontal

down-small

download

downsell

draft

drop

duplicate

email-activity

enlarge

enlarge-vertical

expand

favorite

feedback

file

file-money

filter

flag

folder

folder-group

form

form-field

fullscreen

gear

gear-filled

grant-offer

handle

handle-2

handle-2-vertical

hashtag

heading-large

heading-small

headset

help

help-filled

home

home-alt

home-filled

horizontal-line

image

info-circle

info-circle-filled

italic

kajabi

kajabi-filled

lab

launch

layout-grid

layout-list

left-small

list-bullet

list-details

list-numbers

location

lock

lock-alt

logo-facebook

logo-instagram

logo-linkedin

logo-tiktok

logo-twitter

loop

mail

mapped

margin-left

margin-right

megaphone

megaphone-filled

menu

menu-alt

menu-bordered

merge

microphone

microphone-off

monitor

monitor-filled

move-left

move-right

multi-pay

newsletter

null

one-off-session

one-time

package

pause

payout

pen

phone-portrait

phone-toolbar

play

play-circle

play-outline

plug

present

preview-off

preview-on

product

product-filled

question-circle

quote

redo

refresh

remove

remove-circle

rename

reset-password

restore

right-small

round-dollar

rows

screen-share-off

screen-share-on

search

search-small

send-message

sequences

skipped

slash-divider

speaker

stack

star

stop

strikethrough

subscript

subscriptions

super-admin

superscript

sync

tablet-landscape

tablet-portrait

tag

tag-filled

theme-store

trash

underline

undo

unlock

unmapped

up-small

upload

url

user

user-circle

user-circle-filled

user-star

user-star-filled

users

users-alt

video-off

video-on

warning

warning-filled

window-paragraph

world