{"id":50138747,"url":"https://github.com/ream88/phx_icons","last_synced_at":"2026-05-24T00:02:23.297Z","repository":{"id":351599662,"uuid":"1211694582","full_name":"ream88/phx_icons","owner":"ream88","description":"Dynamic icon library for Phoenix LiveView. Auto-discovers, downloads, and inlines SVG icons from multiple providers at compile time.","archived":false,"fork":false,"pushed_at":"2026-05-08T08:34:04.000Z","size":62,"stargazers_count":5,"open_issues_count":0,"forks_count":1,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-08T10:29:08.989Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://phx-icons-demo.fly.dev","language":"Elixir","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ream88.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-04-15T16:48:39.000Z","updated_at":"2026-05-08T08:34:08.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/ream88/phx_icons","commit_stats":null,"previous_names":["ream88/phx_icons"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/ream88/phx_icons","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ream88%2Fphx_icons","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ream88%2Fphx_icons/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ream88%2Fphx_icons/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ream88%2Fphx_icons/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ream88","download_url":"https://codeload.github.com/ream88/phx_icons/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ream88%2Fphx_icons/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33416315,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-23T22:14:44.296Z","status":"ssl_error","status_checked_at":"2026-05-23T22:14:43.778Z","response_time":53,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-05-24T00:02:20.300Z","updated_at":"2026-05-24T00:02:23.292Z","avatar_url":"https://github.com/ream88.png","language":"Elixir","funding_links":[],"categories":[],"sub_categories":[],"readme":"# PhxIcons\n\n\u003c!-- MDOC !--\u003e\n\nIcon library for Phoenix LiveView that scans your templates at compile time,\ndownloads only the icons you actually use, and inlines the SVGs as compiled\nfunction clauses. Zero runtime overhead, no unused icons bundled, no Node.js\nrequired.\n\n## Installation\n\n```elixir\ndef deps do\n  [{:phx_icons, \"~\u003e 0.1.1\"}]\nend\n```\n\n## Quick start\n\nAdd `use PhxIcons` to your component module:\n\n```elixir\ndefmodule MyAppWeb.CoreComponents do\n  use Phoenix.Component\n  use PhxIcons\nend\n```\n\nUse icons in your templates:\n\n```heex\n\u003c.icon name=\"heroicons:heart\" class=\"size-6 text-red-500\" /\u003e\n\u003c.icon name=\"lucide:search\" class=\"size-4\" /\u003e\n\u003c.icon name=\"flagpack:at\" class=\"size-8\" /\u003e\n```\n\nThat's it. The icons are discovered, downloaded, and compiled automatically.\n\n## How it works\n\n1. `use PhxIcons` scans all `.heex` and `.ex` files for `name=\"provider:icon\"`\n   references at compile time\n2. Missing icons are downloaded from the provider's GitHub release archive (ZIP\n   files are cached in `/tmp/icons/`)\n3. Each icon becomes a pattern-matched function clause with the SVG inlined\n4. `__mix_recompile__?/0` triggers recompilation when new icon references appear\n\n## Configuration\n\nConfigure providers in `config/config.exs`:\n\n```elixir\nconfig :phx_icons,\n  providers: %{\n    \"heroicons\" =\u003e {PhxIcons.Providers.Heroicons, \"2.2.0\"},\n    \"heroicons-solid\" =\u003e {PhxIcons.Providers.Heroicons, \"2.2.0\", style: \"solid\"},\n    \"heroicons-mini\" =\u003e {PhxIcons.Providers.Heroicons, \"2.2.0\", style: \"mini\"},\n    \"heroicons-micro\" =\u003e {PhxIcons.Providers.Heroicons, \"2.2.0\", style: \"micro\"},\n    \"lucide\" =\u003e {PhxIcons.Providers.Lucide, \"0.469.0\"},\n    \"tabler\" =\u003e {PhxIcons.Providers.Tabler, \"3.41.1\"},\n    \"phosphor\" =\u003e {PhxIcons.Providers.Phosphor, \"2.0.8\"},\n    \"simple-icons\" =\u003e {PhxIcons.Providers.SimpleIcons, \"16.16.0\"},\n    \"flagpack\" =\u003e {PhxIcons.Providers.Flagpack, \"2.1.0\"},\n    \"lineicons\" =\u003e {PhxIcons.Providers.Lineicons, \"5.0\"}\n  }\n```\n\nYou can also pre-download all icons from a provider, a specific list, or extra icons in addition to the icons discovered in your codebase:\n\n```elixir\nconfig :phx_icons,\n  providers: %{\n    # Download all icons upfront\n    \"heroicons\" =\u003e {PhxIcons.Providers.Heroicons, \"2.2.0\", download: :all},\n    # Download a specific set\n    \"lucide\" =\u003e {PhxIcons.Providers.Lucide, \"0.469.0\", download: ~w(search check x)},\n    # Download discovered icons plus these extra icons\n    \"tabler\" =\u003e {PhxIcons.Providers.Tabler, \"3.41.1\", download: {:also, ~w(settings user)}}\n  }\n```\n\n## Built-in providers\n\n| Provider | Prefix | Variants |\n|----------|--------|----------|\n| [Heroicons](https://heroicons.com) | `heroicons` | outline (default), `-solid`, `-mini`, `-micro` |\n| [Lucide](https://lucide.dev) | `lucide` | single style |\n| [Tabler](https://tabler.io/icons) | `tabler` | outline (default), `-filled` |\n| [Phosphor](https://phosphoricons.com) | `phosphor` | regular (default), `-bold`, `-thin`, `-light`, `-fill`, `-duotone` |\n| [Simple Icons](https://simpleicons.org) | `simple-icons` | brand logos |\n| [Flagpack](https://flagpack.xyz) | `flagpack` | country flags |\n| [Lineicons](https://lineicons.com) | `lineicons` | single style |\n\n```heex\n\u003c.icon name=\"heroicons:heart\" class=\"size-6\" /\u003e\n\u003c.icon name=\"heroicons-solid:heart\" class=\"size-6\" /\u003e\n\u003c.icon name=\"heroicons-mini:heart\" class=\"size-5\" /\u003e\n\u003c.icon name=\"tabler:star\" class=\"size-6\" /\u003e\n\u003c.icon name=\"tabler-filled:star\" class=\"size-6\" /\u003e\n\u003c.icon name=\"phosphor:bell\" class=\"size-6\" /\u003e\n\u003c.icon name=\"phosphor:bell-duotone\" class=\"size-6\" /\u003e\n\u003c.icon name=\"simple-icons:github\" class=\"size-6 fill-current\" /\u003e\n\u003c.icon name=\"flagpack:us\" class=\"h-6 w-auto\" /\u003e\n\u003c.icon name=\"lineicons:github\" class=\"size-6\" /\u003e\n```\n\n## Custom providers\n\nImplement the `PhxIcons.Provider` behaviour:\n\n```elixir\ndefmodule MyApp.Providers.CustomIcons do\n  @behaviour PhxIcons.Provider\n\n  @impl true\n  def release_url(version) do\n    \"https://github.com/org/repo/archive/refs/tags/v#{version}.zip\"\n  end\n\n  @impl true\n  def svg_path(version, icon_name, _opts) do\n    \"repo-#{version}/icons/#{icon_name}.svg\"\n  end\nend\n```\n\nThen register it in your config:\n\n```elixir\nconfig :phx_icons,\n  providers: %{\n    \"custom\" =\u003e {MyApp.Providers.CustomIcons, \"1.0.0\"}\n  }\n```\n\n## Testing\n\nPhxIcons ships with test helpers to assert icons are rendered:\n\n```elixir\nimport PhxIcons.Test\n\nhtml = render_component(\u0026MyAppWeb.CoreComponents.icon/1, name: \"heroicons:heart\")\nassert_icon(html, \"heroicons:heart\")\nrefute_icon(html, \"heroicons:x-mark\")\n```\n\n\u003c!-- MDOC !--\u003e\n\n## License\n\nMIT — see [LICENSE](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fream88%2Fphx_icons","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fream88%2Fphx_icons","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fream88%2Fphx_icons/lists"}