---
title: Icons
description: Button and button-link fields use this shared icon set. Pick an id in the editor; use none for no icon.
---

## General

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/home.svg" alt="Home" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `home` | Home |
| <img src="/icons/link.svg" alt="Link" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `link` | Link |
| <img src="/icons/magnifying-glass.svg" alt="Magnifying Glass" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `magnifying-glass` | Magnifying Glass |
| <img src="/icons/information-circle.svg" alt="Information Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `information-circle` | Information Circle |
| <img src="/icons/question-mark-circle.svg" alt="Question Mark Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `question-mark-circle` | Question Mark Circle |
| <img src="/icons/exclamation-circle.svg" alt="Exclamation Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `exclamation-circle` | Exclamation Circle |
| <img src="/icons/exclamation-triangle.svg" alt="Exclamation Triangle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `exclamation-triangle` | Exclamation Triangle |
| <img src="/icons/shield-check.svg" alt="Shield Check" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `shield-check` | Shield Check |
| <img src="/icons/cog-6-tooth.svg" alt="Cog 6 Tooth" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `cog-6-tooth` | Cog 6 Tooth |
| <img src="/icons/sparkles.svg" alt="Sparkles" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `sparkles` | Sparkles |
| <img src="/icons/globe-alt.svg" alt="Globe Alt" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `globe-alt` | Globe Alt |

## Actions

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/check.svg" alt="Check" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `check` | Check |
| <img src="/icons/check-circle.svg" alt="Check Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `check-circle` | Check Circle |
| <img src="/icons/x-mark.svg" alt="X Mark" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `x-mark` | X Mark |
| <img src="/icons/plus.svg" alt="Plus" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `plus` | Plus |
| <img src="/icons/minus.svg" alt="Minus" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `minus` | Minus |
| <img src="/icons/plus-circle.svg" alt="Plus Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `plus-circle` | Plus Circle |
| <img src="/icons/minus-circle.svg" alt="Minus Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `minus-circle` | Minus Circle |
| <img src="/icons/ellipsis-horizontal.svg" alt="Ellipsis Horizontal" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `ellipsis-horizontal` | Ellipsis Horizontal |
| <img src="/icons/ellipsis-vertical.svg" alt="Ellipsis Vertical" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `ellipsis-vertical` | Ellipsis Vertical |
| <img src="/icons/pencil-square.svg" alt="Pencil Square" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `pencil-square` | Pencil Square |
| <img src="/icons/trash.svg" alt="Trash" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `trash` | Trash |
| <img src="/icons/arrow-path.svg" alt="Arrow Path" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-path` | Arrow Path |
| <img src="/icons/arrow-down-tray.svg" alt="Arrow Down Tray" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-down-tray` | Arrow Down Tray |
| <img src="/icons/arrow-up-tray.svg" alt="Arrow Up Tray" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-up-tray` | Arrow Up Tray |
| <img src="/icons/share.svg" alt="Share" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `share` | Share |
| <img src="/icons/clipboard-document.svg" alt="Clipboard Document" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `clipboard-document` | Clipboard Document |
| <img src="/icons/document-duplicate.svg" alt="Document Duplicate" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `document-duplicate` | Document Duplicate |
| <img src="/icons/bookmark.svg" alt="Bookmark" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bookmark` | Bookmark |

## Navigation

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/arrow-left.svg" alt="Arrow Left" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-left` | Arrow Left |
| <img src="/icons/arrow-right.svg" alt="Arrow Right" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-right` | Arrow Right |
| <img src="/icons/arrow-right-on-rectangle.svg" alt="Arrow Right On Rectangle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-right-on-rectangle` | Arrow Right On Rectangle |
| <img src="/icons/arrow-up.svg" alt="Arrow Up" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-up` | Arrow Up |
| <img src="/icons/arrow-down.svg" alt="Arrow Down" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrow-down` | Arrow Down |
| <img src="/icons/chevron-left.svg" alt="Chevron Left" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-left` | Chevron Left |
| <img src="/icons/chevron-right.svg" alt="Chevron Right" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-right` | Chevron Right |
| <img src="/icons/chevron-up.svg" alt="Chevron Up" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-up` | Chevron Up |
| <img src="/icons/chevron-down.svg" alt="Chevron Down" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-down` | Chevron Down |
| <img src="/icons/chevron-up-down.svg" alt="Chevron Up Down" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-up-down` | Chevron Up Down |
| <img src="/icons/chevron-double-left.svg" alt="Chevron Double Left" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-double-left` | Chevron Double Left |
| <img src="/icons/chevron-double-right.svg" alt="Chevron Double Right" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-double-right` | Chevron Double Right |
| <img src="/icons/chevron-double-up.svg" alt="Chevron Double Up" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-double-up` | Chevron Double Up |
| <img src="/icons/chevron-double-down.svg" alt="Chevron Double Down" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chevron-double-down` | Chevron Double Down |
| <img src="/icons/bars-3.svg" alt="Bars 3" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bars-3` | Bars 3 |
| <img src="/icons/bars-2.svg" alt="Bars 2" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bars-2` | Bars 2 |
| <img src="/icons/bars-4.svg" alt="Bars 4" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bars-4` | Bars 4 |
| <img src="/icons/bars-3-bottom-left.svg" alt="Bars 3 Bottom Left" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bars-3-bottom-left` | Bars 3 Bottom Left |
| <img src="/icons/arrows-up-down.svg" alt="Arrows Up Down" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrows-up-down` | Arrows Up Down |
| <img src="/icons/arrows-right-left.svg" alt="Arrows Right Left" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrows-right-left` | Arrows Right Left |
| <img src="/icons/arrows-pointing-out.svg" alt="Arrows Pointing Out" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrows-pointing-out` | Arrows Pointing Out |
| <img src="/icons/arrows-pointing-in.svg" alt="Arrows Pointing In" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `arrows-pointing-in` | Arrows Pointing In |
| <img src="/icons/map-pin.svg" alt="Map Pin" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `map-pin` | Map Pin |
| <img src="/icons/map.svg" alt="Map" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `map` | Map |

## Communication

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/envelope.svg" alt="Envelope" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `envelope` | Envelope |
| <img src="/icons/phone.svg" alt="Phone" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `phone` | Phone |
| <img src="/icons/chat-bubble-left.svg" alt="Chat Bubble Left" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chat-bubble-left` | Chat Bubble Left |
| <img src="/icons/chat-bubble-left-right.svg" alt="Chat Bubble Left Right" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `chat-bubble-left-right` | Chat Bubble Left Right |
| <img src="/icons/megaphone.svg" alt="Megaphone" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `megaphone` | Megaphone |
| <img src="/icons/bell.svg" alt="Bell" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bell` | Bell |
| <img src="/icons/bell-alert.svg" alt="Bell Alert" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `bell-alert` | Bell Alert |
| <img src="/icons/social-whatsapp.svg" alt="Social Whatsapp" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `social-whatsapp` | Social Whatsapp |
| <img src="/icons/social-x.svg" alt="Social X" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `social-x` | Social X |
| <img src="/icons/social-facebook.svg" alt="Social Facebook" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `social-facebook` | Social Facebook |
| <img src="/icons/social-linkedin.svg" alt="Social Linkedin" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `social-linkedin` | Social Linkedin |

## Media

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/play.svg" alt="Play" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `play` | Play |
| <img src="/icons/pause.svg" alt="Pause" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `pause` | Pause |
| <img src="/icons/stop.svg" alt="Stop" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `stop` | Stop |
| <img src="/icons/photo.svg" alt="Photo" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `photo` | Photo |
| <img src="/icons/video-camera.svg" alt="Video Camera" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `video-camera` | Video Camera |
| <img src="/icons/musical-note.svg" alt="Musical Note" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `musical-note` | Musical Note |
| <img src="/icons/microphone.svg" alt="Microphone" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `microphone` | Microphone |
| <img src="/icons/speaker-wave.svg" alt="Speaker Wave" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `speaker-wave` | Speaker Wave |
| <img src="/icons/camera.svg" alt="Camera" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `camera` | Camera |
| <img src="/icons/tv.svg" alt="Tv" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `tv` | Tv |

## Commerce

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/shopping-cart.svg" alt="Shopping Cart" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `shopping-cart` | Shopping Cart |
| <img src="/icons/shopping-bag.svg" alt="Shopping Bag" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `shopping-bag` | Shopping Bag |
| <img src="/icons/credit-card.svg" alt="Credit Card" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `credit-card` | Credit Card |
| <img src="/icons/banknotes.svg" alt="Banknotes" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `banknotes` | Banknotes |
| <img src="/icons/tag.svg" alt="Tag" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `tag` | Tag |
| <img src="/icons/gift.svg" alt="Gift" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `gift` | Gift |
| <img src="/icons/receipt-percent.svg" alt="Receipt Percent" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `receipt-percent` | Receipt Percent |

## People

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/user.svg" alt="User" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `user` | User |
| <img src="/icons/users.svg" alt="Users" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `users` | Users |
| <img src="/icons/user-circle.svg" alt="User Circle" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `user-circle` | User Circle |
| <img src="/icons/user-plus.svg" alt="User Plus" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `user-plus` | User Plus |
| <img src="/icons/identification.svg" alt="Identification" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `identification` | Identification |

## Files

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/document.svg" alt="Document" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `document` | Document |
| <img src="/icons/document-text.svg" alt="Document Text" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `document-text` | Document Text |
| <img src="/icons/folder.svg" alt="Folder" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `folder` | Folder |
| <img src="/icons/folder-open.svg" alt="Folder Open" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `folder-open` | Folder Open |
| <img src="/icons/paper-clip.svg" alt="Paper Clip" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `paper-clip` | Paper Clip |
| <img src="/icons/archive-box.svg" alt="Archive Box" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `archive-box` | Archive Box |

## Time & weather

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/calendar.svg" alt="Calendar" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `calendar` | Calendar |
| <img src="/icons/calendar-days.svg" alt="Calendar Days" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `calendar-days` | Calendar Days |
| <img src="/icons/clock.svg" alt="Clock" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `clock` | Clock |
| <img src="/icons/sun.svg" alt="Sun" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `sun` | Sun |
| <img src="/icons/moon.svg" alt="Moon" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `moon` | Moon |

## Devices & visibility

| | Id | Name |
| :---: | --- | --- |
| <img src="/icons/computer-desktop.svg" alt="Computer Desktop" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `computer-desktop` | Computer Desktop |
| <img src="/icons/device-phone-mobile.svg" alt="Device Phone Mobile" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `device-phone-mobile` | Device Phone Mobile |
| <img src="/icons/device-tablet.svg" alt="Device Tablet" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `device-tablet` | Device Tablet |
| <img src="/icons/eye.svg" alt="Eye" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `eye` | Eye |
| <img src="/icons/eye-slash.svg" alt="Eye Slash" width="28" height="28" class="not-prose" style="margin:0;display:inline-block;vertical-align:middle" /> | `eye-slash` | Eye Slash |

## No icon

Set icon to "none" (or leave unset where the editor allows) when the control should show no glyph.
