Here's every dashicon that ships with WordPress. Type to filter the list, and click any icon to copy its class name to your clipboard.
admin-appearance
admin-collapse
admin-comments
admin-customizer
admin-generic
admin-home
admin-links
admin-media
admin-multisite
admin-network
admin-page
admin-plugins
admin-post
admin-settings
admin-site
admin-site-alt
admin-site-alt2
admin-site-alt3
admin-tools
admin-users
airplane
album
align-center
align-full-width
align-left
align-none
align-pull-left
align-pull-right
align-right
align-wide
amazon
analytics
archive
arrow-down
arrow-down-alt
arrow-down-alt2
arrow-left
arrow-left-alt
arrow-left-alt2
arrow-right
arrow-right-alt
arrow-right-alt2
arrow-up
arrow-up-alt
arrow-up-alt2
arrow-up-duplicate
art
awards
backup
bank
beer
bell
block-default
book
book-alt
buddicons-activity
buddicons-bbpress-logo
buddicons-buddypress-logo
buddicons-community
buddicons-forums
buddicons-friends
buddicons-groups
buddicons-pm
buddicons-replies
buddicons-topics
buddicons-tracking
building
businessman
businessperson
businesswoman
button
calculator
calendar
calendar-alt
camera
camera-alt
car
carrot
cart
category
chart-area
chart-bar
chart-line
chart-pie
clipboard
clock
cloud
cloud-saved
cloud-upload
code-standards
coffee
color-picker
columns
controls-back
controls-forward
controls-pause
controls-play
controls-repeat
controls-skipback
controls-skipforward
controls-volumeoff
controls-volumeon
cover-image
dashboard
database
database-add
database-export
database-import
database-remove
database-view
desktop
dismiss
download
drumstick
edit
edit-large
edit-page
editor-aligncenter
editor-alignleft
editor-alignright
editor-bold
editor-break
editor-code
editor-code-duplicate
editor-contract
editor-customchar
editor-expand
editor-help
editor-indent
editor-insertmore
editor-italic
editor-justify
editor-kitchensink
editor-ltr
editor-ol
editor-ol-rtl
editor-outdent
editor-paragraph
editor-paste-text
editor-paste-word
editor-quote
editor-removeformatting
editor-rtl
editor-spellcheck
editor-strikethrough
editor-table
editor-textcolor
editor-ul
editor-underline
editor-unlink
editor-video
ellipsis
email
email-alt
email-alt2
embed-audio
embed-generic
embed-photo
embed-post
embed-video
excerpt-view
exit
external
facebook
facebook-alt
feedback
filter
flag
food
format-aside
format-audio
format-chat
format-gallery
format-image
format-quote
format-status
format-video
forms
fullscreen-alt
fullscreen-exit-alt
games
google
googleplus
grid-view
groups
hammer
heading
heart
hidden
hourglass
html
id
id-alt
image-crop
image-filter
image-flip-horizontal
image-flip-vertical
image-rotate
image-rotate-left
image-rotate-right
images-alt
images-alt2
index-card
info
info-outline
insert
insert-after
insert-before
instagram
laptop
layout
leftright
lightbulb
linkedin
list-view
location
location-alt
lock
lock-duplicate
marker
media-archive
media-audio
media-code
media-default
media-document
media-interactive
media-spreadsheet
media-text
media-video
megaphone
menu
menu-alt
menu-alt2
menu-alt3
microphone
migrate
minus
money
money-alt
move
nametag
networking
no
no-alt
open-folder
palmtree
paperclip
pdf
performance
pets
phone
pinterest
playlist-audio
playlist-video
plugins-checked
plus
plus-alt
plus-alt2
podio
portfolio
post-status
pressthis
printer
privacy
products
randomize
reddit
redo
remove
rest-api
rss
saved
schedule
screenoptions
search
share
share-alt
share-alt2
shield
shield-alt
shortcode
slides
smartphone
smiley
sort
sos
spotify
star-empty
star-filled
star-half
sticky
store
superhero
superhero-alt
table-col-after
table-col-before
table-col-delete
table-row-after
table-row-before
table-row-delete
tablet
tag
tagcloud
testimonial
text
text-page
thumbs-down
thumbs-up
tickets
tickets-alt
tide
translation
trash
twitch
twitter
twitter-alt
undo
universal-access
universal-access-alt
unlock
update
update-alt
upload
vault
video-alt
video-alt2
video-alt3
visibility
warning
welcome-add-page
welcome-comments
welcome-learn-more
welcome-view-site
welcome-widgets-menus
welcome-write-blog
whatsapp
wordpress
wordpress-alt
xing
yes
yes-alt
youtube
No icons match that filter.
It’s very simple to use WordPress's built-in icon font dashicons for a custom post type menu icon. When you register a post type, set the menu_icon argument to the CSS class of the dashicon you wish to use.
register_post_type( 'testimonials', [
'public' => true,
'menu_icon' => 'dashicons-format-status',
'label' => 'Testimonials',
'supports' => array( 'title', 'editor', 'custom-fields' )
] );It’s also simple to use a dashicon as an ACF options page icon. When you register a options page with the acf_add_options_page function, set the icon_url argument to the dashicon you want to use.
acf_add_options_page( array(
'page_title' => 'Theme Options',
'menu_title' => 'Theme Options',
'menu_slug' => 'theme-options',
'capability' => 'edit_posts',
'icon_url' => 'dashicons-format-status',
) );Custom SVGs can also be used instead with any of these options, including the acf_register_block_type function. You can set the icon parameter to the dashicon you want to use (excluding the "dashicon-" namespace), or alternatively use a custom SVG like this:
acf_register_block_type([
'name' => 'highlights',
'title' => 'Highlight Columns',
'description' => 'Two-column product or feature highlights.',
'render_callback' => function ($block, $content = '', $is_preview = false, $post_id = 0) {
echo view('blocks.highlight-columns', [
'block' => $block,
'content' => $content,
'is_preview' => $is_preview,
'post_id' => $post_id,
]);
},
'category' => 'formatting',
'icon' => 'screenoptions',
'keywords' => ['highlights', 'columns', 'text'],
]);acf_register_block_type([
...
'icon' => file_get_contents(get_theme_file_path('resources/icons/custom-block-icon.svg')),
]);Not specifically related to dashicons, but related to what they're used for: sometimes if a dashicons isn't available that works well it's good to be able to use your own SVG as a menu_icon or icon_url. You can do that by passing the SVG as an inline base64 encoded string with the following approach:
$svg = '';
$encoded_svg = 'data:image/svg+xml;base64,' . base64_encode($svg);
// ACF options page
acf_add_options_page( array(
'page_title' => 'Theme Options',
'menu_title' => 'Theme Options',
'menu_slug' => 'theme-options',
'capability' => 'edit_posts',
'icon_url' => $encoded_svg,
) );
// Custom post type
register_post_type( 'testimonials', [
'public' => true,
'menu_icon' => $encoded_svg,
'label' => 'Testimonials',
'supports' => array( 'title', 'editor', 'custom-fields' )
] );WordPress only loads the dashicons stylesheet in the admin (and on the front end when the admin bar shows for logged-in users). To use dashicons in your theme for all visitors, enqueue the stylesheet core already ships:
add_action( 'wp_enqueue_scripts', function () {
wp_enqueue_style( 'dashicons' );
} );Then any element with the two classes renders an icon:
<span class="dashicons dashicons-admin-site"></span>One caveat worth weighing: the dashicons font is roughly 36KB and you'll usually use a handful of icons at most. For front-end work, inlining the two or three SVGs you actually need is lighter and avoids the extra request entirely. Keep the icon font for the admin, where it's already loaded.
A lot has changed since this reference was first published in 2013, when dashicons arrived with the WordPress 3.8 admin redesign:
import { Icon, starFilled } from '@wordpress/icons';
<Icon icon={ starFilled } />menu_icon, icon_url, and the examples above remain fully supported. For new admin menus and ACF options pages they're still the simplest choice; for block icons and front-end icons, SVG is the modern default.