{"id":21446083,"url":"https://github.com/svileng/svg","last_synced_at":"2025-12-11T23:46:48.088Z","repository":{"id":62430340,"uuid":"99855960","full_name":"svileng/svg","owner":"svileng","description":"Tools for caching and serving encoded SVGs for Elixir/Phoenix.","archived":false,"fork":false,"pushed_at":"2020-02-25T17:25:25.000Z","size":15,"stargazers_count":16,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-03-15T01:55:53.260Z","etag":null,"topics":["elixir","encoded-svgs","optimization","phoenix","svg"],"latest_commit_sha":null,"homepage":"","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/svileng.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-08-09T21:55:27.000Z","updated_at":"2023-09-01T10:44:20.000Z","dependencies_parsed_at":"2022-11-01T20:18:24.798Z","dependency_job_id":null,"html_url":"https://github.com/svileng/svg","commit_stats":null,"previous_names":["heresydev/svg"],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svileng%2Fsvg","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svileng%2Fsvg/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svileng%2Fsvg/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svileng%2Fsvg/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/svileng","download_url":"https://codeload.github.com/svileng/svg/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225994876,"owners_count":17556830,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["elixir","encoded-svgs","optimization","phoenix","svg"],"created_at":"2024-11-23T02:41:46.176Z","updated_at":"2025-12-11T23:46:43.067Z","avatar_url":"https://github.com/svileng.png","language":"Elixir","funding_links":[],"categories":[],"sub_categories":[],"readme":"# SVG  [![hex.pm](https://img.shields.io/hexpm/v/svg.svg?style=flat-square)](https://hex.pm/packages/svg) [![hexdocs.pm](https://img.shields.io/badge/docs-latest-green.svg?style=flat-square)](https://hexdocs.pm/svg)\n\n\nTools for caching and serving encoded SVGs for Phoenix.\n\n## Installation\n\nAdd to your `mix.exs` as usual:\n```elixir\ndef deps do\n  [{:svg, \"~\u003e 1.0\"}]\nend\n```\nIf you're not using [application inference](https://elixir-lang.org/blog/2017/01/05/elixir-v1-4-0-released/#application-inference), then add `:svg` to your `applications` list.\n\n## Replacing urls to SVGs in your CSS\n\nUsing the `mix svg.encode` task, all references to svg files in your `priv/static/css` will be replaced with the base64 encoded svg.\n\nFor example, if you have an `app.css` file with the following contents:\n\n```css\n.foo {\n  background-url: url(/icons/add.svg)\n}\n```\n\nit will be transformed to this:\n\n```css\n.foo {\n  background-url: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0ia...)\n}\n```\n\nBy default, task will look for SVGs in the `/priv/static/images` folder.\n\n## Using encoded SVGs at runtime\n\nYou need to configure `:svg` in your `config.exs` first:\n\n```elixir\nconfig :svg, otp_app: :my_app # Replace :my_app\n```\n\nAnd then run the background server:\n\n```elixir\ndefmodule MyApp do\n  use Application\n\n  def start(_type, _args) do\n    import Supervisor.Spec\n\n    children = [\n      # .. Ecto, Repo, etc.\n\n      worker(SVG.Server, [])\n    ]\n\n    # ...\n  end\nend\n```\n\nThe server will build up cache when the main application starts. It will concurrently read all svgs in your `priv/static/images` folder and cache them in memory. You can then use the base64 encoded svgs like so:\n\n```elixir\n\u003cimg src=\"\u003c%=raw SVG.Server.get(\"icons/add\") %\u003e\"\u003e\n```\n\nWhere `icons/add` corresponds to `priv/static/images/icons/add.svg` on the filesystem. You may want to alias the server when using in templates:\n\n```elixir\nalias SVG.Server, as: SVG\n```\nand then you can use `SVG.get/1` directly.\n\n## Utility functions\n\nSee [docs](https://hexdocs.pm/svg/SVG.html) for functions available on the main SVG module.\n\n## Roadmap\n\n- ~~Mix task for replacing svg refs in CSS~~\n- Option for URI-encoding instead of Base64\n- Option for raw svg output (no encoding, just inline)\n- Use SVGO if installed locally\n\n## License\n\n- svg: See LICENSE file.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvileng%2Fsvg","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsvileng%2Fsvg","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvileng%2Fsvg/lists"}