Description of icon
Flex UI
API Reference

Flex Icons

Flex's icons are available for use in customisations. You can use these to easily create visually consistent buttons in the Flex header or side navigation panel.

Example:

import { Icon } from '@twilio/flex-ui';
const Component = (props) => {
return (
<Icon icon="Accept"/>
);
}

Available Icons

(information)
Icon names are case-sensitive

  • Accept

  • AcceptLarge

  • Add

  • Agent

  • AgentBold

  • AgentNotify

  • AgentNotifyBold

  • Agents

  • AgentsBold

  • AgentsView

  • AgentsViewBold

  • Alert

  • AlertError

  • AlertTriangle

  • Analyze

  • AnalyzeBold

  • AppDegraded

  • ArrowDown

  • ArrowLeft

  • ArrowRight

  • ArrowUp

  • Attachment

  • Audio

  • BackArrow

  • Bell

  • BellBold

  • Bold

  • Bulb

  • BulbBold

  • Call

  • CallBold

  • CallSmall

  • Channel

  • ChatGeneral

  • Clock

  • Close

  • CloseLarge

  • Cogs

  • ConnectionError

  • Copy

  • Dashboard

  • DashboardBold

  • Dashboards

  • DashboardsBold

  • Data

  • DataBold

  • DebuggerWarning

  • DefaultAvatar

  • DefaultAvatarBold

  • Dialpad

  • DialpadLarge

  • Directory

  • DirectoryBold

  • Download

  • DragHandle

  • Edit

  • Email

  • EmailBold

  • Empty

  • EmptyContent

  • Error

  • Eye

  • EyeBold

  • Facebook

  • FacebookBold

  • FacebookMessenger

  • File

  • FileAttachment

  • FileAudio

  • FileImage

  • FileVideo

  • Filter

  • FilterTrigger

  • FilterUp

  • FlexBanner

  • FlexDebugger

  • Folder

  • Format

  • Fullscreen

  • GenericDoc

  • GenericImage

  • GenericTask

  • GenericTaskBold

  • GoogleBusinessMessages

  • GreenIndicator

  • GreyIndicator

  • GroupCall

  • GroupCallBold

  • Hamburger

  • HamburgerNotify

  • Hangup

  • HangupBold

  • HangupLarge

  • Help

  • HelpBold

  • Hold

  • HoldBold

  • HoldBoldSmall

  • HoldLarge

  • HoldLargeBold

  • HoldOff

  • HoldOffLarge

  • IncomingCall

  • IncomingCallBold

  • IncomingTransfer

  • IncomingTransferBold

  • Info

  • InfoBold

  • Information

  • Inspections

  • InspectionsBold

  • Italic

  • LeaveCall

  • LeaveCallLarge

  • Line

  • LineBold

  • Link

  • Loading

  • Logout

  • LogoutBold

  • Message

  • MessageBold

  • Messaging

  • Minimize

  • Minus

  • MonitorBoldLarge

  • MonitorOffLarge

  • MonitorSmall

  • More

  • Mute

  • MuteBold

  • MuteLarge

  • MuteLargeBold

  • NewTask

  • NoCRM

  • NoChat

  • NoData

  • NotificationDegraded

  • NotificationOperational

  • Open

  • OpenInNewWindow

  • OrderedList

  • OutboundCall

  • OutboundCallBold

  • PaperClip

  • Participant

  • Pause

  • Pdf

  • Play

  • PointerArrowDown

  • ProductChannel

  • Questionnaires

  • QuestionnairesBold

  • Queue

  • Queues

  • QueuesBold

  • Read

  • Resize

  • Search

  • SendLarge

  • Settings

  • SettingsBold

  • SideMenuOff

  • SideMenuOn

  • Sms

  • SmsAlt

  • SmsBold

  • SmsV2

  • SpeechSearches

  • SpeechSearchesBold

  • Strikethrough

  • Success

  • Suggested

  • Supervisor

  • SupervisorBold

  • Supportability

  • SupportabilityBold

  • TasksLarge

  • TasksSmall

  • Thumbdown

  • ThumbdownBold

  • Thumbup

  • ThumbupBold

  • Transfer

  • TransferBold

  • TransferLarge

  • Twilio

  • Underline

  • UnorderedList

  • User

  • Video

  • VideoBold

  • VirtualAgent

  • Voice

  • VoiceBold

  • VoiceSmall

  • Volume

  • VolumeBold

  • Warning

  • Webchat

  • Whatsapp

  • WhatsappBold

Rate this page

Need some help?

We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd by visiting Twilio's Stack Overflow Collective or browsing the Twilio tag on Stack Overflow.