Skip to Content
GuidesIcons

Icons

We use Google Material Symbols icons with our Optimizely Design System via the @optiaxiom/icons package.

360 Degrees

Agent

Align Center

Align Justify

Align Left

Align Right

Angle Down

Angle Right

Angles Up Down

Arrow Down

Arrow Down AZ

Arrow Down Short Wide

Arrow Down Wide Short

Arrow Down ZA

Arrow Left

Arrow Left From Line

Arrow Left Long

Arrow Left To Line

Arrow Right

Arrow Right Arrow Left

Arrow Right From Bracket

Arrow Right From Line

Arrow Right Long

Arrow Right Solid

Arrow Right To Bracket

Arrow Right To Line

Arrow Rotate Left

Arrow Rotate Right

Arrow Trend Down

Arrow Trend Up

Arrow Turn Down Left

Arrow Turn Up

Arrow Up

Arrow Up Right And Arrow Down Left From Center

Arrow Up Right From Square

Arrows From Dotted Line

Arrows From Line

Arrows Left Right

Arrows Maximize

Arrows Minimize

Arrows Repeat

Arrows Rotate

Arrows Up Down Left Right

Assured Workload

Asterisk

At

Badge Percent

Ball Pile

Ban

Barcode

Bars

Bars Sort

Bars Staggered

Bell

Bell Slash

Bold

Bolt

Book

Book Open

Bookmark Solid

Books

Border All

Border None

Box

Box Archive

Box Open

Boxes Stacked

Brackets Curly

Brackets Square

Brain

Briefcase

Browser

Browsers

Bug

Bullhorn

Bullseye Pointer

Calendar

Calendar Clock

Calendar Days

Caret Down Solid

Caret Up Solid

Cart Circle Check

Cart Minus

Cart Plus

Cart Shopping

Cart Shopping Fast

Chart Column

Chart Line

Chart Mixed

Check

Check Circle Solid

Check Double

Chevron Down

Chevron Left

Chevron Right

Chevron Up

Circle

Circle Arrow Down

Circle Arrow Up

Circle Check

Circle Check Solid

Circle Chevron Down

Circle Dollar

Circle Dot

Circle Exclamation

Circle Half Stroke Solid

Circle Info

Circle Minus

Circle Pause

Circle Play

Circle Plus

Circle Question

Circle Small Solid

Circle Solid

Circle Stop

Circle User

Circle Xmark

Circle Xmark Solid

Clipboard

Clipboard Check

Clock

Clock Rotate Left

Clone

Code

Code Branch

Columns 3

Comment

Comment Plus

Comments

Copy

Cube

Cubes

Database

Desktop

Diagram Subtask

Diagram Venn

Diamond

Display

Dollar Sign

Download

Droplet

Ellipsis Solid

Ellipsis Stroke

Ellipsis Stroke Vertical

Envelope

Envelope Open

Eraser

Expand

Eye

Eye Slash

Face Smile

File

File Arrow Up

File Chart Pie

File Exclamation

File Export

File Image

File Import

File Lines

File Pdf

File Pen

File Plus

File Spreadsheet

File Video

File Word

File Zipper

Files

Filter

Filter Slash

Flag

Flag Pennant

Flask

Floppy Disk

Folder

Folder Arrow Down

Folder Blank

Folder Bookmark

Folder Closed

Folder Image

Folder Open

Folder Plus

Folder Tree

Folder User

Folders

Gallery Thumbnails

Gauge

Gear

Gift

Glasses Round

Globe

Grid

Grid 2

Grid 2 Plus

Grid Dividers

Grip

Grip Lines Vertical

Grip Vertical

Hand Pointer

Hashtag

Heading

Highlighter

Horizontal Rule

House

House Blank

Image

Image Landscape

Image Portrait

Image Slash

Images

Inbox Full

Input Numeric

Input Pipe

Input Text

Italic

Key

Key Skeleton Left Right

Language

Laptop Mobile

Layer Group

Left To Line

Lightbulb

Line Height

Link

Link Horizontal

Link Horizontal Slash

Link Slash

List

List Check

List Dropdown

List Ol

List Tree

List Ul

Location Dot

Lock

Lock Open

Magnifying Glass

Magnifying Glass Minus

Magnifying Glass Plus

Megaphone

Memo Pad

Message Bot

Message Lines

Messages

Microchip Ai

Mobile

Money Bill

Money Check Pen

Monitor Waveform

Mouse Pointer

Mug Hot

Music

Objects Align Bottom

Objects Align Center Vertical

Objects Align Top

Octagon Minus

Paint Roller

Panorama

Paper Plane Top

Paperclip

Paste

Pause

Pen

Pen Field

Pen Line

Pen Slash

Pen To Square

People Simple

Phone

Pipe

Pipe Section

Play

Plus

Presentation Screen

Puzzle Piece

Quote Right

Rectangle List

Rectangle Wide

Reply

Right From Line

Robot

Rocket

Rss

Scissors

Screwdriver Wrench

Search

Server

Shapes

Share Nodes

Shield Check

Shield Keyhole

Ship

Sidebar

Sitemap

Slider

Sliders

Sliders Simple

Sort Solid

Sparkles

Spinner

Split

Square

Square Check

Square Dashed

Square Plus

Square Poll Horizontal

Square User

Stairs

Star

Store

Strikethrough

Sub Agent

Subscript

Sun Bright

Superscript

Table Cells

Table Layout

Tablet

Tag

Terminal

Text

Thumbs Down

Thumbs Down Solid

Thumbs Up

Thumbs Up Solid

Thumbtack

Thumbtack Solid

Timeline Arrow

Toggle Off

Toolbox

Trash Can

Triangle Exclamation

Truck

Truck Medical

Underline

Upload

User

User Check

User Group

User Lock

User Pen

User Plus

User Robot

User Slash

User Xmark

Users

Vials

Video

Wave Pulse

Webhook

Window Restore

Xmark

Installation

npm install @optiaxiom/icons

Simply import the icon components and use them in your application.

import { IconDelete } from "@optiaxiom/icons"; <IconDelete />;

Icons accept a size prop to control their dimensions:

import { IconDelete } from "@optiaxiom/icons"; <IconDelete size="sm" />;

Each icon also has a filled variant via the filled prop:

import { IconDelete } from "@optiaxiom/icons"; <IconDelete filled />;
Last updated on