Dashicons in WordPress 5.5 (the final update)

Earlier this year, a post was published on the Make WordPress Design blogblog (versus network, site) detailing the short road ahead for Dashicons.

We’ve recently discussed how to best move forward with icons in WordPress. The blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor uses SVG icons directly, and the rest of WordPress uses the Dahsicons icon font. One of the challenges with an icon font is that it’s one big compiled “sprite”, and so even though it gets cached well, for every icon you add the sprite grows bigger. With SVG you include just the icons you need.

@joen – Next steps for Dashicons

Dashicons were originally brought into CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. as part of the MP6 project that redesigned the entire WordPress adminadmin (and super admin) (see #25858). A lot has changed over the last 7+ years and it’s time to explore better, more efficient ways to manage icons in WordPress Core.

This update will be the final update to the Dashicons icon font in WordPress Core.

Don’t worry, the Dashicons font is not going anywhere. It will continue to be bundled with WordPress in future releases. However, requests to add new icons to the font will no longer be accepted.

New icons

In the final Dashicons update being included in the 5.5 releaseRelease A release is the distribution of the final version of an application. A software release may be either public or private and generally constitutes the initial or new generation of a new or upgraded application. A release is preceded by the distribution of alpha and then beta versions of the software., 65 new icons have been added. This includes 26 icons that were merged into the icon font that already existed in the block editor.

Reminder: The WOFF 1.0 format (while still included for backwards compatibility) will not include these new icons. The reasons for this were detailed in the Dashicons developer note accompanying WordPress 5.2.

Block editor

Icon CSSCSS Cascading Style Sheets. Class Code
dashicons-align-pull-left f10a
dashicons-align-pull-right f10b
dashicons-block-default f12b
dashicons-cloud-saved f137
dashicons-cloud-upload f13b
dashicons-columns f13c
dashicons-cover-image f13d
dashicons-embed-audio f13e
dashicons-embed-generic f13f
dashicons-embed-photo f144
dashicons-embed-post f146
dashicons-embed-video f149
dashicons-exit f14a
dashicons-html f14b
dashicons-info-outline f14c
dashicons-insert-after f14d
dashicons-insert-before f14e
dashicons-insert f10f
dashicons-remove f14f
dashicons-shortcode f150
dashicons-table-col-after f151
dashicons-table-col-before f152
dashicons-table-col-delete f15a
dashicons-table-row-after f15b
dashicons-table-row-before f15c
dashicons-table-row-delete f15d
dashicons-saved f15e

Social

Icon CSS Class Code
dashicons-amazon f162
dashicons-google f18b
dashicons-linkedin f18d
dashicons-pinterest f192
dashicons-podio f19c
dashicons-reddit f195
dashicons-spotify f196
dashicons-twitch f199
dashicons-whatsapp f19a
dashicons-xing f19d
dashicons-youtube f19b

Databases

Icon CSS Class Code
dashicons-database-add f170
dashicons-database-export f17a
dashicons-database-import f17b
dashicons-database-remove f17c
dashicons-database-view f17d
dashicons-database f17e

Notifications

Icon CSS Class Code
dashicons-bell f16d

Transportation

Icon CSS Class Code
dashicons-airplane f15f
dashicons-car f16b

Devices

Icon CSS Class Code
dashicons-calculator f16e
dasicons-games f18a
dashicons-printer f193

Food & beverage

Icon CSS Class Code
dashicons-beer f16c
dashicons-coffee f16f
dashicons-drumstick f17f
dashicons-food f187

Miscellaneous

Icon CSS Class Code
dashicons-bank f16a
dashicons-hourglass f18c
dashicons-money-alt f18e
dashicons-open-folder f18f
dashicons-pdf f190
dashicons-pets f191
dashicons-privacy f194
dashicons-superhero f198
dashicons-superhero-alt f197
dashicons-edit-page f186
dashicons-fullscreen-alt f188
dashicons-fullscreen-exit-alt f189

Thank you to anyone and everyone that has contributed to Dashicons over the last 7+ years.


To see all of the changes to Dashicons since the last update included in WordPress 5.2, check out the repository on GitHub or the ticketticket Created for both bug reports and feature development on the bug tracker. on TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. (#49913). To get a complete overview of all icons please visit developer.wordpress.org/resource/dashicons/.

Props @empireoflight, @joen, and @casiepa for proofreading.

#5-5, #dashicons, #dev-notes, #ui