5.0.0
What's new
- Top to bottom re-draw of every icon to better match the latest iOS and Material platform styles.
- Plenty of additions to help you get icons you need for your project.
- Instead of platform specific variants for each icon we are providing appearance variants (filled, outline, and sharp) for each icon.
- Using appearance variants:
<ion-icon name="heart"></ion-icon> <!--filled variant--> <ion-icon name="heart-outline"></ion-icon> <!--outline variant--> <ion-icon name="heart-sharp"></ion-icon> <!--sharp variant-->
- There will no longer be auto-switching for platform specificity when using Ionicons in an Ionic Framework app. If you'd like to switch icon styles based on the platform in Ionic use the
mdandiosattributes and provide the platform specific icon/variant name.
<ion-icon ios="heart-outline" md="heart-sharp"></ion-icon>
- Adjust the stroke weight via CSS for icons that use the outline variant.
BREAKING CHANGES
The table below outlines icons that were removed or renamed.
| Icon Name | Status | Notes | |
|---|---|---|---|
| add-circle | ❌ | deleted | re-added as "circled" icon |
| alert | ✏️ | renamed | renamed to "alert-circle" |
| appstore | ❌ | deleted | added as google play & apple app store logos |
| arrow-dropdown-circle | ✏️ | renamed | md version added as "caret-down-circle", ios version added as "chevron-down-circle" |
| arrow-dropdown | ✏️ | renamed | md version added as "caret-down", ios version added as "chevron-down-circle-outline" |
| arrow-dropleft-circle | ✏️ | renamed | md version added as "caret-back-circle", ios version added as "chevron-back-circle" |
| arrow-dropleft | ✏️ | renamed | md version added as "caret-back", ios version added as "chevron-back-circle-outline" |
| arrow-dropright-circle | ✏️ | renamed | md version added as "caret-forward-circle", ios version added as "chevron-forward-circle" |
| arrow-dropright | ✏️ | renamed | md version added as "caret-forward", ios version added as "chevron-forward-circle-outline" |
| arrow-dropup-circle | ✏️ | renamed | md version added as "caret-up-circle", ios version added as "chevron-up-circle" |
| arrow-dropup | ✏️ | renamed | md version added as "caret-up", ios version added as "chevron-up-circle-outline" |
| arrow-round-back | ❌ | deleted | becomes "arrow-back" |
| arrow-round-down | ❌ | deleted | becomes "arrow-down" |
| arrow-round-forward | ❌ | deleted | becomes "arrow-forward" |
| arrow-round-up | ❌ | deleted | becomes "arrow-up" |
| at | ✏️ | renamed | becomes "at-circle" |
| bowtie | ❌ | deleted | |
| chatboxes | ✏️ | renamed | renamed to "chatbox" |
| clock | ❌ | deleted | |
| contact | ✏️ | renamed | renamed to "person-circle" |
| contacts | ✏️ | renamed | renamed to "people-circle" |
| done-all | ✏️ | renamed | renamed to "checkmark-done" |
| fastforward | ✏️ | renamed | renamed to "play-forward" |
| filing | ✏️ | renamed | renamed to "file-tray" |
| logo-freebsd-devil | ❌ | deleted | |
| logo-game-controller-a | ❌ | deleted | |
| logo-game-controller-b | ❌ | deleted | added as "game-controller" |
| logo-googleplus | ❌ | deleted | |
| hand | ❌ | deleted | split into "hand-left" and "hand-right" |
| heart-empty | ✏️ | renamed | renamed to "heart-outline" |
| jet | ❌ | deleted | use "airplane" |
| list-box | ❌ | deleted | |
| lock | ✏️ | renamed | renamed to "lock-closed" |
| microphone | ❌ | deleted | |
| model-s | ❌ | deleted | added as "car-sport" |
| more | ❌ | deleted | use "ellipsis-horizontal" for ios and "ellipsis-vertical" for md |
| notifications-outline | ❌ | deleted | exists as circled version |
| outlet | ❌ | deleted | |
| paper | ✏️ | renamed | renamed to "newspaper" |
| logo-polymer | ❌ | deleted | |
| pie | ✏️ | renamed | renamed to "pie-chart" |
| photos | ❌ | deleted | use "image" or "images" |
| qr-scanner | ✏️ | renamed | renamed to "qr-code" |
| quote | ❌ | deleted | |
| redo | ✏️ | renamed | renamed to "arrow-redo" |
| reorder | ❌ | deleted | added as "reorder-two", "reorder-three", "reorder-four" |
| return-left | ✏️ | renamed | renamed to "return-down-back" |
| return-right | ✏️ | renamed | renamed to "return-down-forward" |
| rewind | ✏️ | renamed | renamed to "play-back" |
| reverse-camera | ✏️ | renamed | renamed to "camera-reverse" |
| share-alt | ❌ | deleted | |
| skip-backward | ✏️ | renamed | renamed to "play-skip-back" |
| skip-forward | ✏️ | renamed | renamed to "play-skip-forward" |
| stats | ✏️ | renamed | renamed to "stats-chart" |
| swap | ❌ | deleted | use "swap-horizontal" or "swap-vertical" |
| switch | ✏️ | renamed | renamed to "toggle" |
| text | ✏️ | renamed | renamed to "chatbox-ellipses" |
| undo | ✏️ | renamed | renamed to "arrow-undo" |
| unlock | ✏️ | renamed | renamed to "lock-open" |