PackageTrack

npm · #4440

@heroicons/react

2.2.0tailwindlabs/heroicons ↗

<p align="center"> <a href="https://heroicons.com" target="_blank"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tailwindlabs/heroicons/HEAD/.github/logo-dark.svg"> <source media="(pref

Release timeline

127 releases since 2021
202120222023202420252026

Releases

  1. 2.2.018 Nov 2024
    Release notes2 sources agree

    Added

    • Add React 19 support (#1247)

    Fixed

    • Removed unnecessary clipping path from solid/arrow-left-circle (#1211)
    Open source →
    Additional notes

    v2.2.0 Latest

    Latest

    Compare

    Choose a tag to compare

    Open source →
  2. 2.1.510 Jul 2024
    Release notes2 sources agree

    Added

    • Add new icons (arrow-turn-*, bold, calendar-date-range, divide, document-currency-*, equals, h1, h2, h3, italic, link-slash, numbered-list, percent-badge, slash, strikethrough, underline)
    Open source →
    Additional notes

    v2.1.5

    Compare

    Choose a tag to compare

    Open source →
  3. 2.1.417 Jun 2024
    Release notes2 sources agree

    Fixed

    • Improve tree-shakability of React package (#1192)
    Open source →
    Additional notes

    v2.1.4

    Compare

    Choose a tag to compare

    Open source →
  4. 2.1.322 Mar 2024
    Release notes2 sources agree
    • Improve project READMEs (#1152)
    Open source →
    Additional notes

    v2.1.3

    Compare

    Choose a tag to compare

    Open source →
  5. 2.1.222 Mar 2024
    Release notes2 sources agree
    • Include license file with published packages (#1151)
    Open source →
    Additional notes

    v2.1.2

    Compare

    Choose a tag to compare

    Open source →
  6. 2.1.118 Dec 2023
    Release notes2 sources agree

    Fixed

    • Fixed chevrons in mini set (#1106)
    Open source →
    Additional notes

    v2.1.1

    Compare

    Choose a tag to compare

    Open source →
  7. 2.1.018 Dec 2023
    Release notes

    We just released Heroicons v2.1 which includes a brand new micro style — a full set of almost three hundred 16×16 icons designed for tighter, higher density UIs.

    Learn more about the new set in the announcement post →

    Added

    • Added full set of 16×16 micro icons
    • Added arrow-left-start-on-rectangle and arrow-right-end-on-rectangle icons to all sets

    Changes

    • Minor improvements to the receipt-percent, receipt-refund, speaker-wave, speaker-x-mark, tag, ticket, window, video-camera-slash, plus, and minus icons in the mini set
    • Minor improvements to chevron-down, chevron-left, chevron-right, chevron-up, and chevron-up-down icons in all sets

    Deprecations

    • Renamed arrow-left-on-rectangle to arrow-left-end-on-rectangle
    • Renamed arrow-right-on-rectangle to arrow-right-start-on-rectangle
    • All *-small icons in the outline and solid sets, use mini set instead
    • All *-small icons in the mini set, use micro set instead
    Open source →
    Additional notes

    Added

    • Added micro icon set (#1104)
    • Rebuilt some icons for better clarity (#1104)
    Open source →
    Additional notes

    v2.1.0

    Compare

    Choose a tag to compare

    Open source →
  8. 2.0.189 May 2023
    Release notes2 sources agree

    Fixed

    • Fix incorrect esm paths in package.json for both React and Vue (#988)
    Open source →
    Additional notes

    v2.0.18

    Compare

    Choose a tag to compare

    Open source →
  9. 2.0.1730 Mar 2023
    Release notes2 sources agree

    Fixed

    • Fix React icon types (#966)
    Open source →
    Additional notes

    v2.0.17

    Compare

    Choose a tag to compare

    Open source →
  10. 2.0.1617 Feb 2023
    Release notes

    Fixed

    • Add root-level import (#936)
    Open source →
    Additional notes

    Fixed

    • Add root-level import (#936)
    Open source →
    Additional notes

    v2.0.16

    Compare

    Choose a tag to compare

    Open source →
  11. 2.0.158 Feb 2023
    Release notes2 sources agree

    Fixed

    • Fix icon tree-shaking (#929)
    Open source →
  12. 2.0.1425 Jan 2023
    Release notes2 sources agree

    Fixed

    • Fix React ref types (#903)

    Changed

    • Specify explicit package exports (#920)
    Open source →
  13. 2.0.132 Nov 2022
    Release notes2 sources agree

    Fixed

    • Fix minus icon alignment (0a88242)
    Open source →
  14. 2.0.125 Oct 2022
    Release notes2 sources agree

    Fixed

    • Add title and titleId props to the React types (#814)
    • Fix information-circle icon alignment (#846)
    Open source →
  15. 2.0.1112 Sept 2022
    Release notes2 sources agree

    Added

    • Add new icons (bug-ant, eye-dropper, pause-circle, play-circle, power, rocket-launch, square-2-stack-3d, stop-circle, trophy, tv, viewfinder-circle, window) (#809)
    Open source →
  16. 2.0.1030 Aug 2022
    Release notes

    Fixed

    • Fix arrow-path direction and fix optical alignment of exclamation-triangle (#786)
    Open source →
  17. 2.0.930 Aug 2022
    Release notes

    Added

    • Allow setting title via prop (#779)

    • Add new icons (arrow-small-down, arrow-small-left, arrow-small-right, arrow-small-up, battery-0, battery-100, battery-50, cube-transparent, currency-bangladeshi, minus-small, paint-brush, plus-small, variable, wallet, arrow-path-rounded-square) and fix optical alignment and appearance of icons (bookmark-slash, bookmark, exclamation-triangle, table-cells, view-columns, arrow-path) (#785)

    Open source →
  18. 2.0.826 Aug 2022
    Release notes

    Fixed

    • Fix optical alignment and size of icons (heart, minus, pencil-square, user-plus, x-mark, hand-thumb-up, hand-thumb-down) (#767)
    • Fix size of icons (arrow-down-left, arrow-down-right, arrow-down, arrow-left, arrow-right, arrow-up-left, arrow-up-right, arrow-up) (#768)
    • Fix optical alignment and size of tag icon (#769)
    • Fix size of check icon (#770)

    Added

    • Add user-minus icon
    Open source →
  19. 2.0.725 Aug 2022
    Release notes

    Fixed

    • Improve optical alignment and sizing of icons (hand-thumb-up, hand-thumb-down, plus, minus) (#746)
    Open source →
  20. 2.0.625 Aug 2022
    Release notes

    Fixed

    • Fix size of icons (chevron-double-down, chevron-double-left, chevron-double-right, chevron-double-up, chevron-down, chevron-left, chevron-right, chevron-up, funnel, minus, plus) (#763)
    Open source →
  21. 2.0.525 Aug 2022
    Release notes

    Fixed

    • Modify the curved design of the check-* icons to a straight check (#762)
    Open source →
  22. 2.0.424 Aug 2022
    Release notes

    Fixed

    • Remove additional stroke from outline icons (bars-arrow-down,bars-arrow-up,chevron-up-down, rss) (#759)
    Open source →
  23. 2.0.324 Aug 2022
    Release notes

    Added

    • Add missing icons from v1 (bars-arrow-down,bars-arrow-up,chevron-up-down, rss) (#758)

    Fixed

    • Fix inconsistent naming for 'code-bracket' icons (#756)
    Open source →
    Additional notes

    Added

    • Add missing icons from v1 (bars-arrow-down,bars-arrow-up,chevron-up-down, rss) (#758)

    Fixed

    • Fix inconsistent naming for 'code-bracket' icons (#756)
    Open source →
  24. 2.0.224 Aug 2022
    Release notes2 sources agree

    Fixed

    • Fix typo in exclamation-* icons (#735)
    Open source →
  25. 2.0.123 Aug 2022
    Release notes

    Added

    • Warn when trying to import from v1 paths (f508658)
    Open source →
  26. 2.0.023 Aug 2022
    Release notes

    We just released Heroicons v2.0 — a brand new icon set, illustrated from scratch, that includes icons in three distinct styles.

    • Outline — line icons with a 1.5px stroke, drawn in a 24px view box.
    • Solid — solid icons with filled shapes, drawn in a 24px view box.
    • Mini — solid icons with filled shapes, drawn in a 20px view box.

    Check out all of the new icons on the redesigned Heroicons v2.0 website.

    Upgrading from v1

    Heroicons v2.0 is a brand new icon set with a different visual style, so don't feel like you need to upgrade to avoid "being on the old version".

    If you like how the v1 icons look in your project, stick with them! Heroicons v2 is more like Terminator 2 than OpenSSL 2 — they represent our best work but these are just little SVG pictures, the version you choose to use is personal preference, not a technical decision.

    If you do want to upgrade to v2, understand that because it's an all-new icon set, switching to Heroicons v2 is more like migrating to a new icon set than it is just updating a dependency in your project. We've tried to make it pretty smooth, but because it's a new set, a lot things like import paths and icon names have changed, so there is some manual work involved in migrating.

    Update dependencies

    Install the latest version of the package you're using via npm:

    # Using React
npm install @heroicons/react@latest

# Using Vue
npm install @heroicons/vue@latest

    Update imports

    Since Heroicons v2.0 comes with a new third style, we've updated the import paths for all of the icons to make them more explicit and future-proof.

    # Using React

- import { ... } from '@heroicons/react/solid'
+ import { ... } from '@heroicons/react/20/solid'

- import { ... } from '@heroicons/react/outline'
+ import { ... } from '@heroicons/react/24/outline'

# Using Vue

- import { ... } from '@heroicons/vue/solid'
+ import { ... } from '@heroicons/vue/20/solid'

- import { ... } from '@heroicons/vue/outline'
+ import { ... } from '@heroicons/vue/24/outline'

    Update icon names

    Many of the icons have been renamed to more literal names that describe what the icon is, instead of describing what the icon should be used for. For example, mail has been renamed to envelope, and search has been renamed to magnifying-glass.

    Here is a list of all of the icons that have been renamed along with their updated names:

    v1.0.6 v2.0.10
    adjustments adjustments-vertical
    annotation chat-bubble-bottom-center-text
    archive archive-box
    arrow-circle-down arrow-down-circle
    arrow-circle-left arrow-left-circle
    arrow-circle-right arrow-right-circle
    arrow-circle-up arrow-up-circle
    arrow-narrow-down arrow-long-down
    arrow-narrow-left arrow-long-left
    arrow-narrow-right arrow-long-right
    arrow-narrow-up arrow-long-up
    arrow-sm-left arrow-small-left
    arrow-sm-right arrow-small-right
    arrow-sm-up arrow-small-up
    arrow-sm-down arrow-small-down
    arrows-expand arrows-pointing-out
    badge-check check-badge
    ban no-symbol
    bookmark-alt bookmark-square
    cash banknotes
    chart-square-bar chart-bar-square
    chat-alt-2 chat-bubble-left-right
    chat-alt chat-bubble-left-ellipsis
    chat chat-bubble-oval-left-ellipsis
    chip cpu-chip
    clipboard-check clipboard-document-check
    clipboard-copy clipboard-document
    clipboard-list clipboard-document-list
    cloud-download cloud-arrow-down
    cloud-upload cloud-arrow-up
    code code-bracket
    collection rectangle-stack
    color-swatch swatch
    cursor-click cursor-arrow-rays
    database circle-stack
    desktop-computer computer-desktop
    device-mobile device-phone-mobile
    document-add document-plus
    document-download document-arrow-down
    document-remove document-minus
    document-report document-chart-bar
    document-search document-magnifying-glass
    dots-circle-horizontal ellipsis-horizontal-circle
    dots-horizontal ellipsis-horizontal
    dots-vertical ellipsis-vertical
    download arrow-down-tray
    duplicate square-2-stack
    emoji-happy face-smile
    emoji-sad face-frown
    external-link arrow-top-right-on-square
    exclamation exclamation-triangle
    eye-off eye-slash
    fast-forward forward
    filter funnel
    folder-add folder-plus
    folder-download folder-arrow-down
    folder-remove folder-minus
    globe globe-americas
    hand hand-raised
    inbox-in inbox-arrow-down
    library building-library
    lightning-bolt bolt
    location-marker map-pin
    login arrow-left-on-rectangle
    logout arrow-right-on-rectangle
    mail-open envelope-open
    mail envelope
    menu-alt-1 bars-3-center-left
    menu-alt-2 bars-3-bottom-left
    menu-alt-3 bars-3-bottom-right
    menu-alt-4 bars-2
    menu bars-3
    minus-sm minus-small
    music-note musical-note
    office-building building-office
    pencil-alt pencil-square
    phone-incoming phone-arrow-down-left
    phone-missed-call phone-x-mark
    phone-outgoing phone-arrow-up-right
    photograph photo
    plus-sm plus-small
    puzzle puzzle-piece
    qrcode qr-code
    receipt-tax receipt-percent
    refresh arrow-path
    reply arrow-uturn-left
    rewind backward
    save-as arrow-down-on-square-stack
    save arrow-down-on-square
    search-circle magnifying-glass-circle
    search magnifying-glass
    selector chevron-up-down
    sort-ascending bars-arrow-up
    sort-descending bars-arrow-down
    speakerphone megaphone
    status-offline signal-slash
    status-online signal
    support lifebuoy
    switch-horizontal arrows-right-left
    switch-vertical arrows-up-down
    table table-cells
    template rectangle-group
    terminal command-line
    thumb-down hand-thumb-down
    thumb-up hand-thumb-up
    translate language
    trending-down arrow-trending-down
    trending-up arrow-trending-up
    upload arrow-up-tray
    user-add user-plus
    user-remove user-minus
    view-boards view-columns
    view-grid-add squares-plus
    view-grid squares-2x2
    view-list bars-4
    volume-off speaker-x-mark
    volume-up speaker-wave
    x x-mark
    zoom-in magnifying-glass-plus
    zoom-out magnifying-glass-minus
    Open source →
    Additional notes

    Added

    • Completely new icon set, checkout the release notes for more info.
    Open source →
  27. 1.0.62 Mar 2022
    Release notes

    Added

    • Add forwardRef support for React components (#614)

    Fixed

    • Add sideEffects to package.json files (#572)
    • Fix folder icons (#598)
    • Fix Vue TypeScript declarations (#608)
    • Move stroke-width from path to svg (#631)
    Open source →
    Additional notes

    Added

    • Add forwardRef support for React components (#614)

    Fixed

    • Add sideEffects to package.json files (#572)
    • Fix folder icons (#598)
    • Fix Vue TypeScript declarations (#608)
    • Move stroke-width from path to svg (#631)
    Open source →
  28. 1.0.522 Oct 2021
    Release notes2 sources agree

    Fixed

    • Add MIT license to package.json files (#317)
    • Add aria-hidden="true" attribute (#261)
    • Fix solid arrows-expand fill color (#515)
    • Add {"type": "module"} to esm package.json files
    Open source →
  29. 1.0.417 Aug 2021
    Release notes2 sources agree

    Fixed

    • Fix Vue type declarations (#322)
    Open source →
  30. 1.0.326 Jul 2021
    Release notes2 sources agree

    Added

    • Add Vue type declarations (#254)
    Open source →
  31. 1.0.29 Jul 2021
    Release notes2 sources agree

    Fixed

    • Add correct plus icons
    Open source →
  32. 1.0.114 Apr 2021
    Release notes2 sources agree

    Added

    • Add small arrow icons (arrow-sm-up, arrow-sm-right, arrow-sm-down, arrow-sm-left)
    Open source →
  33. 1.0.029 Mar 2021

    Nothing published for this version

  34. 0.1.026 Jan 2021

    Nothing published for this version

  35. 0.0.1-alpha.626 Jan 2021pre-release

    Nothing published for this version

  36. 0.0.1-alpha.526 Jan 2021pre-release

    Nothing published for this version

  37. 0.0.1-alpha.426 Jan 2021pre-release

    Nothing published for this version

  38. 0.0.1-alpha.325 Jan 2021pre-release

    Nothing published for this version

  39. 0.0.1-alpha.225 Jan 2021pre-release

    Nothing published for this version

  40. 0.0.1-alpha.125 Jan 2021pre-release

    Nothing published for this version

  41. 0.0.0-insiders.fe073d21 Nov 2022pre-release

    Nothing published for this version

  42. 0.0.0-insiders.fe04b0c2 Nov 2022pre-release

    Nothing published for this version

  43. 0.0.0-insiders.fb6bdfa22 Mar 2024pre-release

    Nothing published for this version

  44. 0.0.0-insiders.fa902f426 Dec 2024pre-release

    Nothing published for this version

  45. 0.0.0-insiders.f937b6f17 Oct 2023pre-release

    Nothing published for this version

  46. 0.0.0-insiders.f73682513 Feb 2024pre-release

    Nothing published for this version

  47. 0.0.0-insiders.f64c10b9 May 2023pre-release

    Nothing published for this version

  48. 0.0.0-insiders.f53375d25 Jan 2023pre-release

    Nothing published for this version

  49. 0.0.0-insiders.f327cbe18 Nov 2024pre-release

    Nothing published for this version

  50. 0.0.0-insiders.eee05eb6 Jun 2023pre-release

    Nothing published for this version

  51. 0.0.0-insiders.edb952625 Jan 2023pre-release

    Nothing published for this version

  52. 0.0.0-insiders.ec6d82a16 Dec 2023pre-release

    Nothing published for this version

  53. 0.0.0-insiders.ec572ad27 Apr 2023pre-release

    Nothing published for this version

  54. 0.0.0-insiders.ea53d0730 Aug 2022pre-release

    Nothing published for this version

  55. 0.0.0-insiders.e9cf3d48 Feb 2023pre-release

    Nothing published for this version

  56. 0.0.0-insiders.e58d0225 Oct 2022pre-release

    Nothing published for this version

  57. 0.0.0-insiders.e2e487f17 Jun 2024pre-release

    Nothing published for this version

  58. 0.0.0-insiders.e268d0a17 Jun 2024pre-release

    Nothing published for this version

  59. 0.0.0-insiders.df1be9e13 Feb 2024pre-release

    Nothing published for this version

  60. 0.0.0-insiders.ddb4af025 Jan 2023pre-release

    Nothing published for this version