{"id":32037000,"url":"https://github.com/dotmake-build/svg-sprite","last_synced_at":"2026-04-16T00:32:11.182Z","repository":{"id":318724206,"uuid":"1074048617","full_name":"dotmake-build/svg-sprite","owner":"dotmake-build","description":"A dotnet tool and a library for building or extracting of an SVG sprite, i.e. a .svg file with child \u003csymbol\u003e tags.","archived":false,"fork":false,"pushed_at":"2025-11-10T01:28:20.000Z","size":995,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-02-16T07:44:39.385Z","etag":null,"topics":["builder","cli-tool","dotnet","dotnet-tool","extractor","generator","spritesheet","svg","svg-icons","svg-sprites"],"latest_commit_sha":null,"homepage":"https://dotmake.build/svg-sprite/","language":"C#","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/dotmake-build.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,"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":"2025-10-11T03:57:55.000Z","updated_at":"2025-11-10T01:28:23.000Z","dependencies_parsed_at":"2025-10-12T17:53:57.808Z","dependency_job_id":"848ce9de-7766-4a42-abeb-2d25a55a5935","html_url":"https://github.com/dotmake-build/svg-sprite","commit_stats":null,"previous_names":["dotmake-build/svg-sprite"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/dotmake-build/svg-sprite","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotmake-build%2Fsvg-sprite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotmake-build%2Fsvg-sprite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotmake-build%2Fsvg-sprite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotmake-build%2Fsvg-sprite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dotmake-build","download_url":"https://codeload.github.com/dotmake-build/svg-sprite/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotmake-build%2Fsvg-sprite/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31866303,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-15T15:24:51.572Z","status":"ssl_error","status_checked_at":"2026-04-15T15:24:39.138Z","response_time":63,"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":["builder","cli-tool","dotnet","dotnet-tool","extractor","generator","spritesheet","svg","svg-icons","svg-sprites"],"created_at":"2025-10-17T09:00:46.624Z","updated_at":"2026-04-16T00:32:11.171Z","avatar_url":"https://github.com/dotmake-build.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"![DotMake Svg-Sprite Logo](https://raw.githubusercontent.com/dotmake-build/svg-sprite/master/images/logo-wide.svg \"DotMake Svg-Sprite Logo\")\n\n# DotMake Svg-Sprite\n\nA dotnet tool and a library for building or extracting of an SVG sprite, i.e. a `.svg` file with child `\u003csymbol\u003e` tags.\n\nThere was no proper tool for .NET (there are some for npm) for handling SVG sprites so this tool is created. \nIt could be useful in MSBuild targets or build scripts, especially for web applications.\n\n[![Nuget](https://img.shields.io/nuget/v/svg-sprite?style=for-the-badge\u0026logo=nuget)](https://www.nuget.org/packages/svg-sprite)\n[![Nuget](https://img.shields.io/nuget/v/DotMake.SvgSprite?style=for-the-badge\u0026logo=nuget)](https://www.nuget.org/packages/DotMake.SvgSprite)\n\n![DotMake Svg-Sprite CLI](https://raw.githubusercontent.com/dotmake-build/svg-sprite/master/images/svg-sprite-cli.png \"DotMake Svg-Sprite CLI\")\n\n![DotMake Svg-Sprite Preview](https://raw.githubusercontent.com/dotmake-build/svg-sprite/master/images/svg-sprite-preview.png \"DotMake Svg-Sprite Preview\")\n\n## Getting started\n\nInstall the dotnet tool or the library from [NuGet](https://www.nuget.org/).\n\n- For using the dotnet tool: install via dotnet cli:\n  ```console\n  dotnet tool install --global svg-sprite\n  ```\n\n- For using the library: in your project directory, add via dotnet cli:\n  ```console\n  dotnet add package DotMake.SvgSprite\n  ```\n\n### Prerequisites\n\n- For using the dotnet tool: .NET SDK 6.0 and later. The .NET CLI (`dotnet` command) is included with the [.NET SDK](https://learn.microsoft.com/en-us/dotnet/core/sdk).\n\n- For using the library: .NET Standard 2.0 and later project.  \n  Note that .NET Framework 4.7.2+ or .NET Core 2.0+ or .NET 5.0+ projects can reference our netstandard2.0 target (automatic in nuget).  \n\n## Usage\n\n### Dotnet tool usage\n\n#### Use `build` command to build an SVG sprite file from input SVG files:\n```console\nsvg-sprite build inputs\\*.svg -o sprite.svg\n\nsvg-sprite build inputs\\*.svg inputs2\\*.svg -o sprite2.svg\n```\n\nOverwrite existing output file:\n```console\nsvg-sprite build inputs\\*.svg -o sprite.svg -oe\n```\n\nCreate an HTML page next to the output SVG sprite file, for previewing/testing the symbols inside the SVG sprite:\n```console\nsvg-sprite build inputs\\*.svg -o sprite.svg -hp\n```\nNote that `\u003cuse\u003e` tag does not work cross-origin, including local HTML files (when not viewed from a web server),\nso we put/inline the SVG sprite into HTML for the preview page.\n\nMinify the output SVG sprite file, i.e. remove whitespace to reduce file size for web use:\n```console\nsvg-sprite build inputs\\*.svg -o sprite.svg -m\n```\n\nAll options for `build` command:\n```console\nDotMake Svg-Sprite Cli v1.0.0\nCopyright © 2025 DotMake\n\nbuild: Build an SVG sprite file from input SVG files.\n\nUsage:\n  svg-sprite build \u003cinput-files\u003e... [options]\n\nArguments:\n  \u003cinput-files\u003e  The input SVG files to build an SVG sprite file, i.e. to add as \u003csymbol\u003e tags to the\n                 output SVG sprite file. Duplicate files (same name and size and date modified) will be\n                 ignored.\n                 Patterns in paths are supported:\n                 - ? matches a single character\n                 - * matches zero or more characters\n                 - ** matches zero or more recursive directories, e.g. a\\**\\x matches a\\x, a\\b\\x,\n                 a\\b\\c\\x, etc.\n                 - [...] matches a set of characters, syntax is the same as character groups in Regex.\n                 - {group1,group2,...} matches any of the pattern groups. Groups can contain groups and\n                 patterns, e.g. {a\\b,{c,d}*}.\n                  [required]\n\nOptions:\n  -o, --output-file \u003coutput-file\u003e                    The output SVG sprite file which will contain\n                                                     added \u003csymbol\u003e tags. [required]\n  -oe, --overwrite-existing                          Overwrite existing files. [default: False]\n  -hp, --html-preview                                Create an HTML page next to the output SVG sprite\n                                                     file, for previewing the symbols inside the SVG\n                                                     sprite. [default: False]\n  -m, --minify                                       Minify the SVG output, i.e. disable formatting\n                                                     output, not write individual elements on new lines\n                                                     and indent. [default: False]\n  -atd, --attributes-to-discard                      The attributes to discard when converting \u003csvg\u003e\n  \u003cattributes-to-discard\u003e                            tag to \u003csymbol\u003e tag or vice versa.\n                                                     Wildcards can be used: * - Zero or more\n                                                     characters, ? - Exactly one character.\n                                                     Attributes that should be usually preserved on\n                                                     \u003csymbol\u003e tag:\n                                                     - viewBox — must be preserved on \u003csymbol\u003e to\n                                                     define coordinate system\n                                                     - id — required for referencing the symbol later\n                                                     - fill, stroke, opacity, transform — if used for\n                                                     styling\n                                                     - class, style — if CSS is applied\n                                                     - width and height — optional; usually omitted in\n                                                     sprites\n  -etd, --elements-to-discard \u003celements-to-discard\u003e  The elements to discard when converting \u003csvg\u003e tag\n                                                     to \u003csymbol\u003e tag or vice versa.\n                                                     Wildcards can be used: * - Zero or more\n                                                     characters, ? - Exactly one character.\n                                                     Elements that should be usually preserved inside\n                                                     \u003csymbol\u003e tag:\n                                                     - \u003cpath\u003e — most common for icons\n                                                     - \u003ccircle\u003e, \u003crect\u003e, \u003cline\u003e, \u003cpolygon\u003e, \u003cpolyline\u003e\n                                                     — basic shapes\n                                                     - \u003cg\u003e — groups of elements (preserve if used for\n                                                     structure or styling)\n                                                     - \u003ctext\u003e — if your icon includes text\n                                                     - \u003cuse\u003e — if referencing other symbols\n                                                     - \u003cdefs\u003e — only if it contains reusable elements\n                                                     like gradients or filters used inside the symbol\n  -ip, --id-prefix \u003cid-prefix\u003e                       The prefix to add to the id attribute when\n                                                     converting \u003csvg\u003e tag to \u003csymbol\u003e tag or vice\n                                                     versa.\n  -ifm, --id-for-missing \u003cid-for-missing\u003e            The value to use when id attribute is missing or\n                                                     is not specified when converting \u003csvg\u003e tag to\n                                                     \u003csymbol\u003e tag or vice versa.\n                                                     When there are duplicates, this value will be\n                                                     incremented like symbol-2, symbol-3 etc. [default:\n                                                     symbol]\n  -irc, --id-replacement-char \u003cid-replacement-char\u003e  The replacement character when sanitizing the id\n                                                     attribute when converting \u003csvg\u003e tag to \u003csymbol\u003e\n                                                     tag or vice versa.\n                                                     Allowed values are '-', '_', '.'. Setting any\n                                                     other value will disable sanitizing [default: -]\n  -ilc, --id-lower-cased                             The value indicating whether to convert the id\n                                                     attribute to lowercase when converting \u003csvg\u003e tag\n                                                     to \u003csymbol\u003e tag or vice versa. [default: True]\n  -vbo, --view-box-override \u003cview-box-override\u003e      The override value to use for all viewBox\n                                                     attributes, e.g. \"0 0 24 24\" when converting \u003csvg\u003e\n                                                     tag to \u003csymbol\u003e tag or vice versa.\n  -cp, --comments-preserved                          The value indicating whether to preserve comments\n                                                     when converting \u003csvg\u003e tag to \u003csymbol\u003e tag or vice\n                                                     versa. [default: False]\n  -?, -h, --help                                     Show help and usage information\n```\n\n#### Use `extract` command to extract symbols from an SVG sprite file to individual SVG files:\n```console\nsvg-sprite extract sprite.svg -od outputs\\\n```\n\nOverwrite existing output SVG files:\n```console\nsvg-sprite extract sprite.svg -od outputs\\ -oe\n```\n\nMinify the output SVG files, i.e. remove whitespace to reduce file size for web use:\n```console\nsvg-sprite extract sprite.svg -od outputs\\ -m\n```\n\nAll options for `extract` command:\n```console\nDotMake Svg-Sprite Cli v1.0.0\nCopyright © 2025 DotMake\n\nextract: Extract symbols from an SVG sprite file to individual SVG files.\n\nUsage:\n  svg-sprite extract \u003cinput-file\u003e [options]\n\nArguments:\n  \u003cinput-file\u003e  The input SVG sprite file to extract symbols from, i.e. to extract \u003csymbol\u003e tags to\n                individual SVG files. [required]\n\nOptions:\n  -od, --output-directory \u003coutput-directory\u003e         The output directory to write extracted SVG files.\n                                                     [required]\n  -oe, --overwrite-existing                          Overwrite existing files. [default: False]\n  -m, --minify                                       Minify the SVG output, i.e. disable formatting\n                                                     output, not write individual elements on new lines\n                                                     and indent. [default: False]\n  -atd, --attributes-to-discard                      The attributes to discard when converting \u003csvg\u003e\n  \u003cattributes-to-discard\u003e                            tag to \u003csymbol\u003e tag or vice versa.\n                                                     Wildcards can be used: * - Zero or more\n                                                     characters, ? - Exactly one character.\n                                                     Attributes that should be usually preserved on\n                                                     \u003csymbol\u003e tag:\n                                                     - viewBox — must be preserved on \u003csymbol\u003e to\n                                                     define coordinate system\n                                                     - id — required for referencing the symbol later\n                                                     - fill, stroke, opacity, transform — if used for\n                                                     styling\n                                                     - class, style — if CSS is applied\n                                                     - width and height — optional; usually omitted in\n                                                     sprites\n  -etd, --elements-to-discard \u003celements-to-discard\u003e  The elements to discard when converting \u003csvg\u003e tag\n                                                     to \u003csymbol\u003e tag or vice versa.\n                                                     Wildcards can be used: * - Zero or more\n                                                     characters, ? - Exactly one character.\n                                                     Elements that should be usually preserved inside\n                                                     \u003csymbol\u003e tag:\n                                                     - \u003cpath\u003e — most common for icons\n                                                     - \u003ccircle\u003e, \u003crect\u003e, \u003cline\u003e, \u003cpolygon\u003e, \u003cpolyline\u003e\n                                                     — basic shapes\n                                                     - \u003cg\u003e — groups of elements (preserve if used for\n                                                     structure or styling)\n                                                     - \u003ctext\u003e — if your icon includes text\n                                                     - \u003cuse\u003e — if referencing other symbols\n                                                     - \u003cdefs\u003e — only if it contains reusable elements\n                                                     like gradients or filters used inside the symbol\n  -ip, --id-prefix \u003cid-prefix\u003e                       The prefix to add to the id attribute when\n                                                     converting \u003csvg\u003e tag to \u003csymbol\u003e tag or vice\n                                                     versa.\n  -ifm, --id-for-missing \u003cid-for-missing\u003e            The value to use when id attribute is missing or\n                                                     is not specified when converting \u003csvg\u003e tag to\n                                                     \u003csymbol\u003e tag or vice versa.\n                                                     When there are duplicates, this value will be\n                                                     incremented like symbol-2, symbol-3 etc. [default:\n                                                     symbol]\n  -irc, --id-replacement-char \u003cid-replacement-char\u003e  The replacement character when sanitizing the id\n                                                     attribute when converting \u003csvg\u003e tag to \u003csymbol\u003e\n                                                     tag or vice versa.\n                                                     Allowed values are '-', '_', '.'. Setting any\n                                                     other value will disable sanitizing [default: -]\n  -ilc, --id-lower-cased                             The value indicating whether to convert the id\n                                                     attribute to lowercase when converting \u003csvg\u003e tag\n                                                     to \u003csymbol\u003e tag or vice versa. [default: True]\n  -vbo, --view-box-override \u003cview-box-override\u003e      The override value to use for all viewBox\n                                                     attributes, e.g. \"0 0 24 24\" when converting \u003csvg\u003e\n                                                     tag to \u003csymbol\u003e tag or vice versa.\n  -cp, --comments-preserved                          The value indicating whether to preserve comments\n                                                     when converting \u003csvg\u003e tag to \u003csymbol\u003e tag or vice\n                                                     versa. [default: False]\n  -?, -h, --help                                     Show help and usage information\n```\n\n### Library usage\n\nRefer to [DotMake Svg-Sprite API docs](https://dotmake.build/svg-sprite/api/) for more details.\n\n#### Use `SvgSpriteBuilder.AddSymbol()` method to build an SVG sprite file from input SVG files:\n```c#\n//Build an SVG sprite file from input SVG files\n\nvar svgDocument = new SvgDocument();\nvar svgSpriteBuilder = new SvgSpriteBuilder(svgDocument);\n\nforeach (var file in Directory.EnumerateFiles(@\"inputs\\\", \"*.svg\"))\n{\n    var svgDocumentToAdd = new SvgDocument(file);\n    var symbolId = Path.GetFileNameWithoutExtension(file);\n\n    svgSpriteBuilder.AddSymbol(svgDocumentToAdd, symbolId);\n}\n\nsvgDocument.Save(@\"sprite.svg\");\n```\n\n```c#\n//Build an SVG sprite file from input SVG files with custom options\n\nvar svgDocument = new SvgDocument();\nvar svgSpriteBuilder = new SvgSpriteBuilder(svgDocument);\nvar svgSymbolOptions = new SvgSymbolOptions\n{\n    //These are default values for options\n    AttributesToPreserve = new[] { \"id\", \"viewBox\", \"class\", \"style\", \"fill\", \"stroke\", \"opacity\", \"transform\" },\n    ElementsToPreserve = new[] { \"*\" },\n    IdForMissing = \"symbol\",\n    IdReplacementChar = '-',\n    IdLowerCased = true\n};\n\nforeach (var file in Directory.EnumerateFiles(@\"inputs\\\", \"*.svg\"))\n{\n    var svgDocumentToAdd = new SvgDocument(file);\n    var symbolId = Path.GetFileNameWithoutExtension(file);\n\n    svgSpriteBuilder.AddSymbol(svgDocumentToAdd, symbolId, svgSymbolOptions);\n}\n\nsvgDocument.Save(@\"sprite.svg\");\n```\n\n#### Use `SvgSpriteBuilder.ExtractSymbol()` method to extract symbols from an SVG sprite file to individual SVG files:\n```c#\n//Extract symbols from an SVG sprite file to individual SVG files\n\nvar svgDocument = new SvgDocument(@\"sprite.svg\");\nvar svgSpriteBuilder = new SvgSpriteBuilder(svgDocument);\nvar outputDirectory = @\"outputs\\\";\n\nforeach (var symbolId in svgSpriteBuilder.GetSymbolIds())\n{\n    var svgDocumentToExtract = svgSpriteBuilder.ExtractSymbol(symbolId);\n    var svgFile = Path.Combine(outputDirectory, Path.ChangeExtension(symbolId, \".svg\"));\n\n    Directory.CreateDirectory(outputDirectory);\n    svgDocumentToExtract.Save(svgFile);\n}\n```\n\n```c#\n//Extract symbols from an SVG sprite file to individual SVG files with custom options\n\nvar svgDocument = new SvgDocument(@\"sprite.svg\");\nvar svgSpriteBuilder = new SvgSpriteBuilder(svgDocument);\nvar svgSymbolOptions = new SvgSymbolOptions\n{\n    //These are default values for options\n    AttributesToPreserve = new[] { \"id\", \"viewBox\", \"class\", \"style\", \"fill\", \"stroke\", \"opacity\", \"transform\" },\n    ElementsToPreserve = new[] { \"*\" },\n    IdForMissing = \"symbol\",\n    IdReplacementChar = '-',\n    IdLowerCased = true\n};\nvar outputDirectory = @\"outputs\\\";\n\nforeach (var symbolId in svgSpriteBuilder.GetSymbolIds())\n{\n    var svgDocumentToExtract = svgSpriteBuilder.ExtractSymbol(symbolId, svgSymbolOptions);\n    var svgFile = Path.Combine(outputDirectory, Path.ChangeExtension(symbolId, \".svg\"));\n\n    Directory.CreateDirectory(outputDirectory);\n    svgDocumentToExtract.Save(svgFile);\n}\n```\n\n#### Use `SvgSpriteBuilder.CreatePreviewPage()` method to create an HTML page for previewing the symbols inside the SVG sprite:\n```c#\n//Create an HTML page for previewing the symbols inside the SVG sprite\n\nvar svgDocument = new SvgDocument(@\"sprite.svg\");\nvar svgSpriteBuilder = new SvgSpriteBuilder(svgDocument);\n\nvar html = svgSpriteBuilder.CreatePreviewPage();\nFile.WriteAllText(@\"preview.html\", html);\n```\nNote that `\u003cuse\u003e` tag does not work cross-origin, including local HTML files (when not viewed from a web server),\nso we put/inline the SVG sprite into HTML for the preview page.\n\n## Building\nWe provide some `.cmd` batch scripts in `build` folder for easier building:\n```console\n1. Build Cli.cmd\n2. Build Nuget Packages.cmd\n3. Build Api Docs WebSite.cmd         \n```\n\nOutput results can be found in `publish` folder, for example:\n```console\nDotMake.SvgSprite.Cli-net6.0\n\nsvg-sprite.1.0.0.nupkg\nDotMake.SvgSprite.1.0.0.nupkg\n```\n\n## Using SVG sprites\nOnce you have an SVG sprite, for example `sprite.svg` like this:\n```xml\n\u003csvg xmlns=\"http://www.w3.org/2000/svg\"\u003e\n  \n  \u003csymbol viewBox=\"0 0 640 640\" id=\"address-book\"\u003e\n    \u003cpath fill=\"currentColor\" d=\"M448 112C456.8 112 464 119.2 464 128L464 512C464 520.8 456.8 528 448 528L160 528C151.2 528 144 520.8 144 512L144 128C144 119.2 151.2 112 160 112L448 112zM160 64C124.7 64 96 92.7 96 128L96 512C96 547.3 124.7 576 160 576L448 576C483.3 576 512 547.3 512 512L512 128C512 92.7 483.3 64 448 64L160 64zM304 312C334.9 312 360 286.9 360 256C360 225.1 334.9 200 304 200C273.1 200 248 225.1 248 256C248 286.9 273.1 312 304 312zM272 352C227.8 352 192 387.8 192 432C192 440.8 199.2 448 208 448L400 448C408.8 448 416 440.8 416 432C416 387.8 380.2 352 336 352L272 352zM576 144C576 135.2 568.8 128 560 128C551.2 128 544 135.2 544 144L544 208C544 216.8 551.2 224 560 224C568.8 224 576 216.8 576 208L576 144zM560 256C551.2 256 544 263.2 544 272L544 336C544 344.8 551.2 352 560 352C568.8 352 576 344.8 576 336L576 272C576 263.2 568.8 256 560 256zM576 400C576 391.2 568.8 384 560 384C551.2 384 544 391.2 544 400L544 464C544 472.8 551.2 480 560 480C568.8 480 576 472.8 576 464L576 400z\" /\u003e\n  \u003c/symbol\u003e\n\n  \u003csymbol viewBox=\"0 0 640 640\" id=\"alarm-clock\"\u003e\n    \u003cpath fill=\"currentColor\" d=\"M466.6 114.2C461.2 115.9 455.3 116 450.4 113.3C444.6 110.1 438.6 107.1 432.6 104.4C422.2 99.7 418.9 86.1 428.5 79.8C443.5 69.9 461.5 64.1 480.8 64.1C533.4 64.1 576 106.7 576 159.3C576 172.5 573.3 185.1 568.4 196.6C563.9 207.1 550 206.4 543.5 197C539.7 191.5 535.7 186.2 531.5 181C528 176.6 527 170.8 527.7 165.2C527.9 163.3 528.1 161.3 528.1 159.3C528.1 133.2 506.9 112.1 480.9 112.1C476 112.1 471.2 112.9 466.7 114.3zM96.5 196.9C90 206.3 76 207 71.6 196.5C66.7 185 64 172.4 64 159.2C64 106.6 106.6 64 159.2 64C178.5 64 196.5 69.8 211.5 79.7C221.1 86 217.8 99.6 207.4 104.3C201.3 107.1 195.4 110 189.6 113.2C184.7 115.9 178.7 115.8 173.4 114.1C168.9 112.7 164.2 111.9 159.2 111.9C133.1 111.9 112 133.1 112 159.1C112 161.1 112.1 163.1 112.4 165C113.1 170.6 112.1 176.4 108.6 180.8C104.4 186 100.4 191.3 96.6 196.8zM496 352C496 254.8 417.2 176 320 176C222.8 176 144 254.8 144 352C144 449.2 222.8 528 320 528C417.2 528 496 449.2 496 352zM460.5 526.5C422.1 557.4 373.2 576 320 576C266.8 576 217.9 557.4 179.5 526.5L137 569C127.6 578.4 112.4 578.4 103.1 569C93.8 559.6 93.7 544.4 103.1 535.1L145.6 492.6C114.6 454.1 96 405.2 96 352C96 228.3 196.3 128 320 128C443.7 128 544 228.3 544 352C544 405.2 525.4 454.1 494.5 492.5L537 535C546.4 544.4 546.4 559.6 537 568.9C527.6 578.2 512.4 578.3 503.1 568.9L460.6 526.4zM344 248L344 342.1L385 383.1C394.4 392.5 394.4 407.7 385 417C375.6 426.3 360.4 426.4 351.1 417L303.1 369C298.6 364.5 296.1 358.4 296.1 352L296.1 248C296.1 234.7 306.8 224 320.1 224C333.4 224 344.1 234.7 344.1 248z\" /\u003e\n  \u003c/symbol\u003e\n\n\u003c/svg\u003e\n```\n\nYou can use symbols from this sprite in your HTML pages like this:\n```xml\n\u003csvg\u003e\n  \u003cuse href=\"sprite.svg#address-book\" /\u003e\n\u003c/svg\u003e\n\n\u003csvg style=\"width: 48px; height: 48px;\"\u003e\n  \u003cuse href=\"sprite.svg#alarm-clock\" /\u003e\n\u003c/svg\u003e\n```\n\nNote that `\u003cuse\u003e` tag does not work cross-origin, including local HTML files (when not viewed from a web server),\nso in that case you should put/inline the SVG sprite into your HTML page and \nthen you should only include the URL fragment in `href` attribute:\n```xml\n\u003csvg\u003e\n  \u003cuse href=\"#address-book\" /\u003e\n\u003c/svg\u003e\n\n\u003csvg style=\"width: 48px; height: 48px;\"\u003e\n  \u003cuse href=\"#alarm-clock\" /\u003e\n\u003c/svg\u003e\n```\n\nNote that for `\u003cuse\u003e` tag, the old attribute `xlink:href` is deprecated and the attribute `href` is used since browser\nversions released from 2016-2019.\n\n## Additional documentation\n- [DotMake Svg-Sprite API docs](https://dotmake.build/svg-sprite/api/)\n- [SVG symbol a Good Choice for Icons](https://css-tricks.com/svg-symbol-good-choice-icons/)\n- [Complete guide to SVG sprites](https://medium.com/@hayavuk/complete-guide-to-svg-sprites-7e202e215d34)\n- [The `\u003cuse\u003e` element](https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Element/use)\n- [The `\u003csymbol\u003e` element](https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Element/symbol)\n- [The `\u003csvg\u003e` element ](https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Element/svg)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdotmake-build%2Fsvg-sprite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdotmake-build%2Fsvg-sprite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdotmake-build%2Fsvg-sprite/lists"}