--- title: Introducing Hanami Icons | daily.dev description: Hanami Icons is a new gem that brings icon support to the Hanami framework, built on top of the author's shared Icons gem. It offers the same interface as the... canonical: https://daily.dev/posts/introducing-hanami-icons-716yxcipf twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Introducing Hanami Icons | daily.dev og:description: Hanami Icons is a new gem that brings icon support to the Hanami framework, built on top of the author's shared Icons gem. It offers the same interface as the... og:url: https://daily.dev/posts/introducing-hanami-icons-716yxcipf og:image: https://api.daily.dev/og/posts/716YxCiPF.png og:image:alt: Introducing Hanami Icons og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Introducing Hanami Icons **[RUBYLAND](https://daily.dev/sources/rubyla)** · 4 min read · 0 upvotes · 0 comments ## Summary Hanami Icons is a new gem that brings icon support to the Hanami framework, built on top of the author's shared Icons gem. It offers the same interface as the existing Rails Icons gem: one view helper, CLI generators, and support for any icon library or your own SVG folder. It ships with twelve first-party libraries, ranging from 49 icons in SidekickIcons to more than 9,000 in Phosphor. You install it, run `hanami generate icons --library=lucide`, and use `icon "check"` in views, with sprite generation available via `hanami generate icons:sprite`. The gem is at version 0.6.0 and still considered early. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### How do I add icon libraries like Heroicons or Lucide to a Hanami app? Use the Hanami Icons gem, added with `gem "hanami_icons", group: [:default, :cli]` since Hanami loads CLI extensions from the :cli Bundler group. Run `bundle install` then `hanami generate icons --library=lucide`, which writes a provider config, registers helpers in app/views/helpers.rb, and syncs the chosen library. It supports twelve first-party libraries including Heroicons, Lucide, Tabler, Feather, and Phosphor. _daily.dev surfaces gem releases like this for developers tracking the growing Hanami ecosystem._ ### How do I render an SVG sprite instead of inline icons in Hanami? Generate a sprite with `hanami generate icons:sprite`, then reference symbols with the `sprite_icon` helper, such as `sprite_icon "check"` or `sprite_icon "search", class: "icon icon-small fill-blue-500"`. This avoids repeating the same SVG paths on pages with many icons. Point config.default_sprite_location at the generated file or a CDN, or set it to nil to inline the sprite with icons_sprite. _Developers optimizing icon rendering can follow gem updates like this via daily.dev._ ### Can I use my own custom SVG icons instead of a prebuilt library in Hanami Icons? Yes, any directory under app/assets/svg/icons is treated as a library, so adding an SVG there and calling `icon "apple", library: "simple_icons"` works directly. Libraries with variants use a variant subdirectory like heroicons/outline/check.svg. You can also sync a custom library from a git repository using HanamiIcons.configure with a custom_library source URL. _daily.dev helps Ruby developers keep up with practical gem features like custom icon sources._ ## Similar posts on daily.dev - [Introducing Icons: Add any icon library to your Ruby app](https://daily.dev/posts/introducing-icons-add-any-icon-library-to-your-ruby-app-mzpwbtyg2) · RUBYLAND · 0 upvotes · 0 comments - [Continuations 2026/04: i18n support](https://daily.dev/posts/continuations-2026-04-i18n-support-ixxw5ftkr) · RUBYLAND · 0 upvotes · 0 comments - [GitHub - woylie/ex\_icon: Generic icon library for Phoenix LiveView](https://daily.dev/posts/github---woylie-ex-icon-generic-icon-library-for-phoenix-liveview-rpzxbvooz) · ElixirStatus · 0 upvotes · 0 comments - [Hanami, Why?: Introductions](https://daily.dev/posts/hanami-why-introductions-lrxtqazr0) · Lobsters · 1 upvotes · 0 comments - [Help us test the Hanami 3.0 release candidate](https://daily.dev/posts/help-us-test-the-hanami-3-0-release-candidate-3adiqxfyd) · RUBYLAND · 1 upvotes · 0 comments --- Tags: [#open-source](https://daily.dev/tags/open-source), [#ruby](https://daily.dev/tags/ruby), [#rails](https://daily.dev/tags/rails), [#hanami](https://daily.dev/tags/hanami) [View this post on daily.dev](https://daily.dev/posts/introducing-hanami-icons-716yxcipf) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Introducing Hanami Icons","url":"https://daily.dev/posts/introducing-hanami-icons-716yxcipf","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/introducing-hanami-icons-716yxcipf"},"datePublished":"2026-10-29T08:27:33.095Z","dateModified":"2026-10-29T08:27:59.815Z","description":"Hanami Icons is a new gem that brings icon support to the Hanami framework, built on top of the author's shared Icons gem. It offers the same interface as the...","image":"https://media.daily.dev/image/upload/s--OHB84bZF--/f_auto/v1722860399/public/Placeholder%2010","thumbnailUrl":"https://media.daily.dev/image/upload/s--OHB84bZF--/f_auto/v1722860399/public/Placeholder%2010","isAccessibleForFree":true,"articleSection":"RUBYLAND","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"RUBYLAND","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/rubyla","url":"https://daily.dev/sources/rubyla"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/introducing-hanami-icons-716yxcipf","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"open-source,ruby,rails,hanami","timeRequired":"PT4M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"RUBYLAND","item":"https://daily.dev/sources/rubyla"},{"@type":"ListItem","position":3,"name":"Introducing Hanami Icons"}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/introducing-hanami-icons-716yxcipf#faq","mainEntity":[{"@type":"Question","name":"How do I add icon libraries like Heroicons or Lucide to a Hanami app?","acceptedAnswer":{"@type":"Answer","text":"Use the Hanami Icons gem, added with `gem \"hanami_icons\", group: [:default, :cli]` since Hanami loads CLI extensions from the :cli Bundler group. Run `bundle install` then `hanami generate icons --library=lucide`, which writes a provider config, registers helpers in app/views/helpers.rb, and syncs the chosen library. It supports twelve first-party libraries including Heroicons, Lucide, Tabler, Feather, and Phosphor. daily.dev surfaces gem releases like this for developers tracking the growing Hanami ecosystem."}},{"@type":"Question","name":"How do I render an SVG sprite instead of inline icons in Hanami?","acceptedAnswer":{"@type":"Answer","text":"Generate a sprite with `hanami generate icons:sprite`, then reference symbols with the `sprite_icon` helper, such as `sprite_icon \"check\"` or `sprite_icon \"search\", class: \"icon icon-small fill-blue-500\"`. This avoids repeating the same SVG paths on pages with many icons. Point config.default_sprite_location at the generated file or a CDN, or set it to nil to inline the sprite with icons_sprite. Developers optimizing icon rendering can follow gem updates like this via daily.dev."}},{"@type":"Question","name":"Can I use my own custom SVG icons instead of a prebuilt library in Hanami Icons?","acceptedAnswer":{"@type":"Answer","text":"Yes, any directory under app/assets/svg/icons is treated as a library, so adding an SVG there and calling `icon \"apple\", library: \"simple_icons\"` works directly. Libraries with variants use a variant subdirectory like heroicons/outline/check.svg. You can also sync a custom library from a git repository using HanamiIcons.configure with a custom_library source URL. daily.dev helps Ruby developers keep up with practical gem features like custom icon sources."}}]} ```