This library is still in development and is available only for internal usage at VTEX.
Skip to main content

Iconography

Iconography

Version: Next

Iconography

<IconActivity />
<IconAlarm />
<IconArchive />
<IconArrowCircleUpRight />
<IconArrowCounterClockwise />
<IconArrowDown />
<IconArrowLeft />
<IconArrowLineDown />
<IconArrowLineUp />
<IconArrowRight />
<IconArrowSquareOut />
<IconArrowSquareUpRight />
<IconArrowUUpLeft />
<IconArrowUp />
<IconArrowUpRight />
<IconArrowsClockwise />
<IconBarcode />
<IconBell />
<IconCalendarBlank />
<IconCaretDown />
<IconCaretLeft />
<IconCaretRight />
<IconCaretUp />
<IconChartBar />
<IconChartLineUp />
<IconChatText />
<IconCheck />
<IconCheckCircle />
<IconClock />
<IconCloudArrowUp />
<IconCode />
<IconCopySimple />
<IconCornersOut />
<IconCreditCard />
<IconCube />
<IconCurrencyCircleDollar />
<IconDotsSixVertical />
<IconDotsThreeVertical />
<IconEnvelope />
<IconEye />
<IconEyeSlash />
<IconFaders />
<IconFileText />
<IconFlag />
<IconFolder />
<IconGearSix />
<IconGift />
<IconGlobeHemisphereWest />
<IconHandbagSimple />
<IconHeadset />
<IconHeart />
<IconHouse />
<IconIdentificationCard />
<IconImageSquare />
<IconKey />
<IconLayout />
<IconLink />
<IconLinkBreak />
<IconList />
<IconListDashes />
<IconListNumbers />
<IconLockKey />
<IconLockKeyOpen />
<IconMagnifyingGlass />
<IconMagnifyingGlassPlus />
<IconMapPin />
<IconMegaphone />
<IconMinus />
<IconNotebook />
<IconPaperPlaneTilt />
<IconPaperclip />
<IconPencil />
<IconPlus />
<IconPrinter />
<IconQuestion />
<IconReceipt />
<IconRocketLaunch />
<IconRows />
<IconShareNetwork />
<IconShoppingCartSimple />
<IconSignOut />
<IconSquaresFour />
<IconStack />
<IconStorefront />
<IconTag />
<IconTextAlignCenter />
<IconTextAlignLeft />
<IconTextAlignRight />
<IconTextBolder />
<IconTextItalic />
<IconTextUnderline />
<IconTicket />
<IconTrash />
<IconTruck />
<IconUser />
<IconUsers />
<IconWarning />
<IconWarningCircle />
<IconX />
<IconXCircle />
<IconXOctagon />

Variations

Weight

By default, all icons from the library are rendered with the value outline. They all have support to be either fill or outline. Example:

Loading...

Size

By default, all icons from the library are rendered with the value regular. They all have support to be either small or regular. Example:

Loading...

Mirrored

Use the mirrored property to mirror the icon direction, for example:

Loading...

Props

All props of svg JSX.Element.

NameTypeDescriptionRequiredDefault
csxStyleObjectStyles properties🚫-
weightoutline, weightIcon weight🚫outline
sizesmall, regularIcon size🚫regular
mirroredbooleanWhether the icon direction is mirrored or not🚫false