The Coder’s Toolbox Online deployed a new tool name SVG Minify.
What is SVG?
Scalable Vector Graphics (SVG) is an Extensible Markup Language (XML)-based vector image format for two-dimensional graphics with support for interactivity and animation. The SVG specification is an open standard developed by the World Wide Web Consortium (W3C) since 1999.
SVG images and their behaviors are defined in XML text files. This means that they can be searched, indexed, scripted, and compressed. As XML files, SVG images can be created and edited with any text editor, as well as with drawing software.
source: Wikipedia
What is SVG Minify Tool?
SVG Minify is a tool provided by Coder’s Toolbox Online to minify and optimize your svg code. It’s remove unnecessary spaces, attributes and tags. By using the tool it will also provide you links that you can use in your image tag
How to use the tool?
Using the tool is just a simple just copy - paste - click/copy
- Goto to the SVG Minify Link or just click here
- Copy an SVG code Here’s an example code
<svg id="Layer_1" enable-background="new 0 0 511.998 511.998" height="512" viewBox="0 0 511.998 511.998" width="512"
xmlns="http://www.w3.org/2000/svg">
<g>
<g>
<path
d="m255.999 335.315-10.667 91.351 10.667 68.333c44.025 0 79.842-35.817 79.842-79.842s-35.816-79.842-79.842-79.842z"
fill="#f7f0eb"/>
<path d="m176.157 415.157c0 44.025 35.817 79.842 79.842 79.842v-159.684c-44.025 0-79.842 35.817-79.842 79.842z"
fill="#fffbf5"/>
</g>
<g>
<path
d="m255.999 16.999-10.667 217.667 10.667 181.296c16.875 26.249 46.338 43.669 79.795 43.669 43.121 0 80.828-29.127 91.72-70.844 1.543-5.721 32.116-119.764 32.116-168.156 0-112.283-91.348-203.632-203.631-203.632z"
fill="#efe2dd"/>
<path
d="m106.666 202.666h149.333v-185.667c-55.168 0-105.273 22.062-141.982 57.815-.03.343-7.351 127.852-7.351 127.852z"
fill="#f7f0eb"/>
</g>
<g>
<path
d="m255.999 127.825-10.667 74.857 10.667 91.225c16.73-39.037 28.333-72.875 28.333-100.575.001-20.627-4.991-48.418-28.333-65.507z"
fill="#ebb65b"/>
<path
d="m253.653 126.185c-23.764-15.843-47.939-8.968-69.268-2.903-25.142 7.149-40.157 10.399-56.446-5.89-16.182-16.182-13.952-42.236-13.922-42.579-38.004 37.014-61.65 88.702-61.65 145.817 0 48.371 30.548 162.337 32.114 168.149 10.89 41.721 48.599 70.851 91.722 70.851 33.457 0 62.92-17.42 79.795-43.669v-122.053-166.083c-.761-.558-1.543-1.105-2.345-1.64z"
fill="#ffc663"/>
</g>
<g>
<path d="m158.473 197.052h30v58.947h-30z" fill="#32393f"/>
<path d="m323.526 197.052h30v58.947h-30z" fill="#262b2f"/>
</g>
<g>
<path
d="m266.719 291.368h-10.72l-10.667 39.298 10.667 43.228 28.793-17.276c10.581-6.348 17.055-17.783 17.055-30.122 0-19.401-15.727-35.128-35.128-35.128z"
fill="#744727"/>
<path
d="m245.279 291.368c-19.401 0-35.128 15.727-35.128 35.128 0 12.339 6.474 23.774 17.055 30.122l28.793 17.276v-82.526z"
fill="#8d562f"/>
</g>
<g>
<path
d="m114.024 74.798c-10.358-5.904-33.94-7.682-50.079-3.235-17.59 4.847-33.502 16.228-46.008 32.902l-.144.191c-12.46 16.614-18.735 37.176-17.678 57.913l5.571 159.644.011.265c1.943 36.927 32.432 65.854 69.411 65.854h9.892l-4.21-18.354c-.161-.701-15.332-71.029 3.23-160.858 8.979-43.454 32.979-79.965 30.004-134.322z"
fill="#c97840"/>
<path
d="m397.974 74.798c10.358-5.904 33.941-7.682 50.079-3.235 17.59 4.847 33.502 16.228 46.008 32.902l.143.191c12.461 16.614 18.735 37.176 17.678 57.913l-5.571 159.644-.011.265c-1.943 36.927-32.432 65.854-69.411 65.854h-9.892l4.21-18.354c.161-.701 15.332-71.029-3.23-160.858-8.978-43.454-32.978-79.965-30.003-134.322z"
fill="#ae632c"/>
</g>
</g>
</svg>
Icons made by Freepik from www.flaticon.com
-
Paste the copied code to Paste SVG Markup
The result will be like this.
-
To copy the content just click the icon .
There are 4 output of the tool. Each of them has there own purposes.
- Minified svg code is the minified code of the svg. Only use this for inline svg.
<svg viewBox="0 0 511.998 511.998"><path fill="#f7f0eb" d="M255.999 335.315l-10.667 91.351 10.667 68.333c44.025 0 79.842-35.817 79.842-79.842s-35.816-79.842-79.842-79.842z"/><path fill="#fffbf5" d="M176.157 415.157c0 44.025 35.817 79.842 79.842 79.842V335.315c-44.025 0-79.842 35.817-79.842 79.842z"/><path fill="#efe2dd" d="M255.999 16.999l-10.667 217.667 10.667 181.296c16.875 26.249 46.338 43.669 79.795 43.669 43.121 0 80.828-29.127 91.72-70.844 1.543-5.721 32.116-119.764 32.116-168.156 0-112.283-91.348-203.632-203.631-203.632z"/><path fill="#f7f0eb" d="M106.666 202.666h149.333V16.999c-55.168 0-105.273 22.062-141.982 57.815-.03.343-7.351 127.852-7.351 127.852z"/><path fill="#ebb65b" d="M255.999 127.825l-10.667 74.857 10.667 91.225c16.73-39.037 28.333-72.875 28.333-100.575.001-20.627-4.991-48.418-28.333-65.507z"/><path fill="#ffc663" d="M253.653 126.185c-23.764-15.843-47.939-8.968-69.268-2.903-25.142 7.149-40.157 10.399-56.446-5.89-16.182-16.182-13.952-42.236-13.922-42.579-38.004 37.014-61.65 88.702-61.65 145.817 0 48.371 30.548 162.337 32.114 168.149 10.89 41.721 48.599 70.851 91.722 70.851 33.457 0 62.92-17.42 79.795-43.669V127.825a64.465 64.465 0 00-2.345-1.64z"/><g><path fill="#32393f" d="M158.473 197.052h30v58.947h-30z"/><path fill="#262b2f" d="M323.526 197.052h30v58.947h-30z"/></g><g><path fill="#744727" d="M266.719 291.368h-10.72l-10.667 39.298 10.667 43.228 28.793-17.276a35.127 35.127 0 0017.055-30.122c0-19.401-15.727-35.128-35.128-35.128z"/><path fill="#8d562f" d="M245.279 291.368c-19.401 0-35.128 15.727-35.128 35.128a35.127 35.127 0 0017.055 30.122l28.793 17.276v-82.526z"/></g><g><path fill="#c97840" d="M114.024 74.798c-10.358-5.904-33.94-7.682-50.079-3.235-17.59 4.847-33.502 16.228-46.008 32.902l-.144.191A89.131 89.131 0 00.115 162.569l5.571 159.644.011.265c1.943 36.927 32.432 65.854 69.411 65.854H85l-4.21-18.354c-.161-.701-15.332-71.029 3.23-160.858 8.979-43.454 32.979-79.965 30.004-134.322z"/><path fill="#ae632c" d="M397.974 74.798c10.358-5.904 33.941-7.682 50.079-3.235 17.59 4.847 33.502 16.228 46.008 32.902l.143.191a89.126 89.126 0 0117.678 57.913l-5.571 159.644-.011.265c-1.943 36.927-32.432 65.854-69.411 65.854h-9.892l4.21-18.354c.161-.701 15.332-71.029-3.23-160.858-8.978-43.454-32.978-79.965-30.003-134.322z"/></g></svg>
- Minified svg code with xmlns is the minified code of the svg. The menify code has xmlns, use this if you wan to use it as external svg code, e.g. putting it in to other file as image. Also this format can be use for inline svg.
<svg viewBox="0 0 511.998 511.998"><path fill="#f7f0eb" d="M255.999 335.315l-10.667 91.351 10.667 68.333c44.025 0 79.842-35.817 79.842-79.842s-35.816-79.842-79.842-79.842z"/><path fill="#fffbf5" d="M176.157 415.157c0 44.025 35.817 79.842 79.842 79.842V335.315c-44.025 0-79.842 35.817-79.842 79.842z"/><path fill="#efe2dd" d="M255.999 16.999l-10.667 217.667 10.667 181.296c16.875 26.249 46.338 43.669 79.795 43.669 43.121 0 80.828-29.127 91.72-70.844 1.543-5.721 32.116-119.764 32.116-168.156 0-112.283-91.348-203.632-203.631-203.632z"/><path fill="#f7f0eb" d="M106.666 202.666h149.333V16.999c-55.168 0-105.273 22.062-141.982 57.815-.03.343-7.351 127.852-7.351 127.852z"/><path fill="#ebb65b" d="M255.999 127.825l-10.667 74.857 10.667 91.225c16.73-39.037 28.333-72.875 28.333-100.575.001-20.627-4.991-48.418-28.333-65.507z"/><path fill="#ffc663" d="M253.653 126.185c-23.764-15.843-47.939-8.968-69.268-2.903-25.142 7.149-40.157 10.399-56.446-5.89-16.182-16.182-13.952-42.236-13.922-42.579-38.004 37.014-61.65 88.702-61.65 145.817 0 48.371 30.548 162.337 32.114 168.149 10.89 41.721 48.599 70.851 91.722 70.851 33.457 0 62.92-17.42 79.795-43.669V127.825a64.465 64.465 0 00-2.345-1.64z"/><g><path fill="#32393f" d="M158.473 197.052h30v58.947h-30z"/><path fill="#262b2f" d="M323.526 197.052h30v58.947h-30z"/></g><g><path fill="#744727" d="M266.719 291.368h-10.72l-10.667 39.298 10.667 43.228 28.793-17.276a35.127 35.127 0 0017.055-30.122c0-19.401-15.727-35.128-35.128-35.128z"/><path fill="#8d562f" d="M245.279 291.368c-19.401 0-35.128 15.727-35.128 35.128a35.127 35.127 0 0017.055 30.122l28.793 17.276v-82.526z"/></g><g><path fill="#c97840" d="M114.024 74.798c-10.358-5.904-33.94-7.682-50.079-3.235-17.59 4.847-33.502 16.228-46.008 32.902l-.144.191A89.131 89.131 0 00.115 162.569l5.571 159.644.011.265c1.943 36.927 32.432 65.854 69.411 65.854H85l-4.21-18.354c-.161-.701-15.332-71.029 3.23-160.858 8.979-43.454 32.979-79.965 30.004-134.322z"/><path fill="#ae632c" d="M397.974 74.798c10.358-5.904 33.941-7.682 50.079-3.235 17.59 4.847 33.502 16.228 46.008 32.902l.143.191a89.126 89.126 0 0117.678 57.913l-5.571 159.644-.011.265c-1.943 36.927-32.432 65.854-69.411 65.854h-9.892l4.21-18.354c.161-.701 15.332-71.029-3.23-160.858-8.978-43.454-32.978-79.965-30.003-134.322z"/></g></svg>
- Base64 data uri is a base64 of the minified code that can be use as src in img tag.
data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNTExLjk5OCA1MTEuOTk4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9IiNmN2YwZWIiIGQ9Ik0yNTUuOTk5IDMzNS4zMTVsLTEwLjY2NyA5MS4zNTEgMTAuNjY3IDY4LjMzM2M0NC4wMjUgMCA3OS44NDItMzUuODE3IDc5Ljg0Mi03OS44NDJzLTM1LjgxNi03OS44NDItNzkuODQyLTc5Ljg0MnoiLz48cGF0aCBmaWxsPSIjZmZmYmY1IiBkPSJNMTc2LjE1NyA0MTUuMTU3YzAgNDQuMDI1IDM1LjgxNyA3OS44NDIgNzkuODQyIDc5Ljg0MlYzMzUuMzE1Yy00NC4wMjUgMC03OS44NDIgMzUuODE3LTc5Ljg0MiA3OS44NDJ6Ii8+PHBhdGggZmlsbD0iI2VmZTJkZCIgZD0iTTI1NS45OTkgMTYuOTk5bC0xMC42NjcgMjE3LjY2NyAxMC42NjcgMTgxLjI5NmMxNi44NzUgMjYuMjQ5IDQ2LjMzOCA0My42NjkgNzkuNzk1IDQzLjY2OSA0My4xMjEgMCA4MC44MjgtMjkuMTI3IDkxLjcyLTcwLjg0NCAxLjU0My01LjcyMSAzMi4xMTYtMTE5Ljc2NCAzMi4xMTYtMTY4LjE1NiAwLTExMi4yODMtOTEuMzQ4LTIwMy42MzItMjAzLjYzMS0yMDMuNjMyeiIvPjxwYXRoIGZpbGw9IiNmN2YwZWIiIGQ9Ik0xMDYuNjY2IDIwMi42NjZoMTQ5LjMzM1YxNi45OTljLTU1LjE2OCAwLTEwNS4yNzMgMjIuMDYyLTE0MS45ODIgNTcuODE1LS4wMy4zNDMtNy4zNTEgMTI3Ljg1Mi03LjM1MSAxMjcuODUyeiIvPjxwYXRoIGZpbGw9IiNlYmI2NWIiIGQ9Ik0yNTUuOTk5IDEyNy44MjVsLTEwLjY2NyA3NC44NTcgMTAuNjY3IDkxLjIyNWMxNi43My0zOS4wMzcgMjguMzMzLTcyLjg3NSAyOC4zMzMtMTAwLjU3NS4wMDEtMjAuNjI3LTQuOTkxLTQ4LjQxOC0yOC4zMzMtNjUuNTA3eiIvPjxwYXRoIGZpbGw9IiNmZmM2NjMiIGQ9Ik0yNTMuNjUzIDEyNi4xODVjLTIzLjc2NC0xNS44NDMtNDcuOTM5LTguOTY4LTY5LjI2OC0yLjkwMy0yNS4xNDIgNy4xNDktNDAuMTU3IDEwLjM5OS01Ni40NDYtNS44OS0xNi4xODItMTYuMTgyLTEzLjk1Mi00Mi4yMzYtMTMuOTIyLTQyLjU3OS0zOC4wMDQgMzcuMDE0LTYxLjY1IDg4LjcwMi02MS42NSAxNDUuODE3IDAgNDguMzcxIDMwLjU0OCAxNjIuMzM3IDMyLjExNCAxNjguMTQ5IDEwLjg5IDQxLjcyMSA0OC41OTkgNzAuODUxIDkxLjcyMiA3MC44NTEgMzMuNDU3IDAgNjIuOTItMTcuNDIgNzkuNzk1LTQzLjY2OVYxMjcuODI1YTY0LjQ2NSA2NC40NjUgMCAwMC0yLjM0NS0xLjY0eiIvPjxwYXRoIGZpbGw9IiMzMjM5M2YiIGQ9Ik0xNTguNDczIDE5Ny4wNTJoMzB2NTguOTQ3aC0zMHoiLz48cGF0aCBmaWxsPSIjMjYyYjJmIiBkPSJNMzIzLjUyNiAxOTcuMDUyaDMwdjU4Ljk0N2gtMzB6Ii8+PHBhdGggZmlsbD0iIzc0NDcyNyIgZD0iTTI2Ni43MTkgMjkxLjM2OGgtMTAuNzJsLTEwLjY2NyAzOS4yOTggMTAuNjY3IDQzLjIyOCAyOC43OTMtMTcuMjc2YTM1LjEyNyAzNS4xMjcgMCAwMDE3LjA1NS0zMC4xMjJjMC0xOS40MDEtMTUuNzI3LTM1LjEyOC0zNS4xMjgtMzUuMTI4eiIvPjxwYXRoIGZpbGw9IiM4ZDU2MmYiIGQ9Ik0yNDUuMjc5IDI5MS4zNjhjLTE5LjQwMSAwLTM1LjEyOCAxNS43MjctMzUuMTI4IDM1LjEyOGEzNS4xMjcgMzUuMTI3IDAgMDAxNy4wNTUgMzAuMTIybDI4Ljc5MyAxNy4yNzZ2LTgyLjUyNnoiLz48Zz48cGF0aCBmaWxsPSIjYzk3ODQwIiBkPSJNMTE0LjAyNCA3NC43OThjLTEwLjM1OC01LjkwNC0zMy45NC03LjY4Mi01MC4wNzktMy4yMzUtMTcuNTkgNC44NDctMzMuNTAyIDE2LjIyOC00Ni4wMDggMzIuOTAybC0uMTQ0LjE5MUE4OS4xMzEgODkuMTMxIDAgMDAuMTE1IDE2Mi41NjlsNS41NzEgMTU5LjY0NC4wMTEuMjY1YzEuOTQzIDM2LjkyNyAzMi40MzIgNjUuODU0IDY5LjQxMSA2NS44NTRIODVsLTQuMjEtMTguMzU0Yy0uMTYxLS43MDEtMTUuMzMyLTcxLjAyOSAzLjIzLTE2MC44NTggOC45NzktNDMuNDU0IDMyLjk3OS03OS45NjUgMzAuMDA0LTEzNC4zMjJ6Ii8+PHBhdGggZmlsbD0iI2FlNjMyYyIgZD0iTTM5Ny45NzQgNzQuNzk4YzEwLjM1OC01LjkwNCAzMy45NDEtNy42ODIgNTAuMDc5LTMuMjM1IDE3LjU5IDQuODQ3IDMzLjUwMiAxNi4yMjggNDYuMDA4IDMyLjkwMmwuMTQzLjE5MWE4OS4xMjYgODkuMTI2IDAgMDExNy42NzggNTcuOTEzbC01LjU3MSAxNTkuNjQ0LS4wMTEuMjY1Yy0xLjk0MyAzNi45MjctMzIuNDMyIDY1Ljg1NC02OS40MTEgNjUuODU0aC05Ljg5Mmw0LjIxLTE4LjM1NGMuMTYxLS43MDEgMTUuMzMyLTcxLjAyOS0zLjIzLTE2MC44NTgtOC45NzgtNDMuNDU0LTMyLjk3OC03OS45NjUtMzAuMDAzLTEzNC4zMjJ6Ii8+PC9nPjwvc3ZnPg==
- Data uri is the minified code that can be use as src in img tag. Using this is more less size in bytes compare to the base64 data uri.
data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%20511.998%20511.998%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22%23f7f0eb%22%20d%3D%22M255.999%20335.315l-10.667%2091.351%2010.667%2068.333c44.025%200%2079.842-35.817%2079.842-79.842s-35.816-79.842-79.842-79.842z%22%2F%3E%3Cpath%20fill%3D%22%23fffbf5%22%20d%3D%22M176.157%20415.157c0%2044.025%2035.817%2079.842%2079.842%2079.842V335.315c-44.025%200-79.842%2035.817-79.842%2079.842z%22%2F%3E%3Cpath%20fill%3D%22%23efe2dd%22%20d%3D%22M255.999%2016.999l-10.667%20217.667%2010.667%20181.296c16.875%2026.249%2046.338%2043.669%2079.795%2043.669%2043.121%200%2080.828-29.127%2091.72-70.844%201.543-5.721%2032.116-119.764%2032.116-168.156%200-112.283-91.348-203.632-203.631-203.632z%22%2F%3E%3Cpath%20fill%3D%22%23f7f0eb%22%20d%3D%22M106.666%20202.666h149.333V16.999c-55.168%200-105.273%2022.062-141.982%2057.815-.03.343-7.351%20127.852-7.351%20127.852z%22%2F%3E%3Cpath%20fill%3D%22%23ebb65b%22%20d%3D%22M255.999%20127.825l-10.667%2074.857%2010.667%2091.225c16.73-39.037%2028.333-72.875%2028.333-100.575.001-20.627-4.991-48.418-28.333-65.507z%22%2F%3E%3Cpath%20fill%3D%22%23ffc663%22%20d%3D%22M253.653%20126.185c-23.764-15.843-47.939-8.968-69.268-2.903-25.142%207.149-40.157%2010.399-56.446-5.89-16.182-16.182-13.952-42.236-13.922-42.579-38.004%2037.014-61.65%2088.702-61.65%20145.817%200%2048.371%2030.548%20162.337%2032.114%20168.149%2010.89%2041.721%2048.599%2070.851%2091.722%2070.851%2033.457%200%2062.92-17.42%2079.795-43.669V127.825a64.465%2064.465%200%2000-2.345-1.64z%22%2F%3E%3Cpath%20fill%3D%22%2332393f%22%20d%3D%22M158.473%20197.052h30v58.947h-30z%22%2F%3E%3Cpath%20fill%3D%22%23262b2f%22%20d%3D%22M323.526%20197.052h30v58.947h-30z%22%2F%3E%3Cpath%20fill%3D%22%23744727%22%20d%3D%22M266.719%20291.368h-10.72l-10.667%2039.298%2010.667%2043.228%2028.793-17.276a35.127%2035.127%200%200017.055-30.122c0-19.401-15.727-35.128-35.128-35.128z%22%2F%3E%3Cpath%20fill%3D%22%238d562f%22%20d%3D%22M245.279%20291.368c-19.401%200-35.128%2015.727-35.128%2035.128a35.127%2035.127%200%200017.055%2030.122l28.793%2017.276v-82.526z%22%2F%3E%3Cg%3E%3Cpath%20fill%3D%22%23c97840%22%20d%3D%22M114.024%2074.798c-10.358-5.904-33.94-7.682-50.079-3.235-17.59%204.847-33.502%2016.228-46.008%2032.902l-.144.191A89.131%2089.131%200%2000.115%20162.569l5.571%20159.644.011.265c1.943%2036.927%2032.432%2065.854%2069.411%2065.854H85l-4.21-18.354c-.161-.701-15.332-71.029%203.23-160.858%208.979-43.454%2032.979-79.965%2030.004-134.322z%22%2F%3E%3Cpath%20fill%3D%22%23ae632c%22%20d%3D%22M397.974%2074.798c10.358-5.904%2033.941-7.682%2050.079-3.235%2017.59%204.847%2033.502%2016.228%2046.008%2032.902l.143.191a89.126%2089.126%200%200117.678%2057.913l-5.571%20159.644-.011.265c-1.943%2036.927-32.432%2065.854-69.411%2065.854h-9.892l4.21-18.354c.161-.701%2015.332-71.029-3.23-160.858-8.978-43.454-32.978-79.965-30.003-134.322z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E
- Coder’s Toolbox link is a compress link that can be use as src in img tag. Using this is more less size in bytes compare to data uri.
http://localhost:3000/image/svg/eJx9lk1vIzcMhv%2BK4J6liF%2BSCGwWaE%2B99Jp7MonjBQxsgS3Sor%2B%2BL2dk17Pu9mKCgj7Ihy85%2FvTt4z19fHn785evfz0eaqrJiIr7uNjD50%2B%2FP%2F9xSscv5%2FPj4adjP9a3l0N6fTz8xmbY4UnEipCdM9XSWk9ORYzS9NooIrKolsqG%2B7uXoZxxZlC%2FeJv5tq22vFud5u%2FDw3ehHI8vR9tCod4KWU9KFnapab63e2ZvnmbcS77ENl%2Bah%2FJu993zb8c3fn3dk6AW5gqCqa92ujSosLcFu0a3xK2wetIGPiOpYI%2FHY93t4sEQE6CNWgaPzA5%2FBdyBBWuqiYqpZMMKJeFCwEeEW5peXZSArCE%2FIi48JEeFFNdVPCM8LV38e9I3RafaEFpLXDnsidSjvk9b6ksGCbwXb1Ur3CUxl9o4k0JOg5N1sLVc8JQg7r5JhbFqvPfuib%2B8NPtOe%2Bte%2Fld7XXH0Shx5MlsA75LF8SiKsuoxd96KsHlUa7FupdagUBr3rLifso6iBFLbtmbFav8PJS6tySUwMDRBYFDkgLhYohYZwhzIV3tx8TyKt5GbF4bh4lUyA1yoDb%2Beta5yRhrinq0V1YYaD0cxcS1fjRQHN0VZpa0er551zzKQDkTQSyXNjRBWGqP0ytMh3ZoDzYL0OuQDCDqgYka2fZMPBBbygVARzIAkaVUaThjwhwZRsVWQfPFEilpci3scMfaydRGEnTdhP82yPTctikimwfipoCFqGQHqyvl9j1pYXI5TiobiQGHkSNH4JPUDK679lKXeFYkbv%2FA8iVuKcfufkw%2Fvd0931c59VrlBUuSJo5PaOIX8Ol9VCKkxRuj0kDPzCKl1l8DBvT1jxkQrTxOZU8RiCAArvKCBvCjkSNHaPa8bx97c5TherV1yZI3%2Bu4a4zPvQmdvhtLt4C2T8MKy0hXXekkhbEh95cHD8EbHF%2B9A6i0UxZDUatHtEA2nbgKa9aoZiXNH9DZK2WmqoF4q2gGXQHFqnxyarHDMWNDPGZq0jNOoV4KFQLeT088CIFErTRAIQsa2atuZnNDCETubQFwLCN44bBgSelyQYYbzKXoUTen2YJvSoEk3v14FJo4VRFXSM6YJ3G2X01FonwSzthDTxTUT4aNJoiJEgLWSk0RbrUA4P%2FeBtxYomRedqEb4fec9vmMfLFC3E6v1K8BZgWgHSRjDdEkw3BNOOYNoTBEAJgM9BDq0xDQBSfMX6iMntJOe8Q5ivDPMtxLyDmHcQTxkfVOfzLccrxrTDmG8xxtDsY2LMK8YxMeYVo%2Bwwhh4f8O%2Fm8z%2FH%2FeZ3
For Base64 Data Uri, Data Uri and Coder’s Toolbox Link, You can use it to your img tag. And for Minified SVG and Minified SVG With Xmlns can be use directly to your html code
Hers’s an example
<html>
<head>
<style>
svg { height: 100px; }
img { height: 100px; }
body { text-align: center; }
</style>
</head>
<body>
<svg viewBox="0 0 511.998 511.998"><path fill="#f7f0eb" d="M255.999 335.315l-10.667 91.351 10.667 68.333c44.025 0 79.842-35.817 79.842-79.842s-35.816-79.842-79.842-79.842z"/><path fill="#fffbf5" d="M176.157 415.157c0 44.025 35.817 79.842 79.842 79.842V335.315c-44.025 0-79.842 35.817-79.842 79.842z"/><path fill="#efe2dd" d="M255.999 16.999l-10.667 217.667 10.667 181.296c16.875 26.249 46.338 43.669 79.795 43.669 43.121 0 80.828-29.127 91.72-70.844 1.543-5.721 32.116-119.764 32.116-168.156 0-112.283-91.348-203.632-203.631-203.632z"/><path fill="#f7f0eb" d="M106.666 202.666h149.333V16.999c-55.168 0-105.273 22.062-141.982 57.815-.03.343-7.351 127.852-7.351 127.852z"/><path fill="#ebb65b" d="M255.999 127.825l-10.667 74.857 10.667 91.225c16.73-39.037 28.333-72.875 28.333-100.575.001-20.627-4.991-48.418-28.333-65.507z"/><path fill="#ffc663" d="M253.653 126.185c-23.764-15.843-47.939-8.968-69.268-2.903-25.142 7.149-40.157 10.399-56.446-5.89-16.182-16.182-13.952-42.236-13.922-42.579-38.004 37.014-61.65 88.702-61.65 145.817 0 48.371 30.548 162.337 32.114 168.149 10.89 41.721 48.599 70.851 91.722 70.851 33.457 0 62.92-17.42 79.795-43.669V127.825a64.465 64.465 0 00-2.345-1.64z"/><g><path fill="#32393f" d="M158.473 197.052h30v58.947h-30z"/><path fill="#262b2f" d="M323.526 197.052h30v58.947h-30z"/></g><g><path fill="#744727" d="M266.719 291.368h-10.72l-10.667 39.298 10.667 43.228 28.793-17.276a35.127 35.127 0 0017.055-30.122c0-19.401-15.727-35.128-35.128-35.128z"/><path fill="#8d562f" d="M245.279 291.368c-19.401 0-35.128 15.727-35.128 35.128a35.127 35.127 0 0017.055 30.122l28.793 17.276v-82.526z"/></g><g><path fill="#c97840" d="M114.024 74.798c-10.358-5.904-33.94-7.682-50.079-3.235-17.59 4.847-33.502 16.228-46.008 32.902l-.144.191A89.131 89.131 0 00.115 162.569l5.571 159.644.011.265c1.943 36.927 32.432 65.854 69.411 65.854H85l-4.21-18.354c-.161-.701-15.332-71.029 3.23-160.858 8.979-43.454 32.979-79.965 30.004-134.322z"/><path fill="#ae632c" d="M397.974 74.798c10.358-5.904 33.941-7.682 50.079-3.235 17.59 4.847 33.502 16.228 46.008 32.902l.143.191a89.126 89.126 0 0117.678 57.913l-5.571 159.644-.011.265c-1.943 36.927-32.432 65.854-69.411 65.854h-9.892l4.21-18.354c.161-.701 15.332-71.029-3.23-160.858-8.978-43.454-32.978-79.965-30.003-134.322z"/></g></svg>
<img src="data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNTExLjk5OCA1MTEuOTk4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9IiNmN2YwZWIiIGQ9Ik0yNTUuOTk5IDMzNS4zMTVsLTEwLjY2NyA5MS4zNTEgMTAuNjY3IDY4LjMzM2M0NC4wMjUgMCA3OS44NDItMzUuODE3IDc5Ljg0Mi03OS44NDJzLTM1LjgxNi03OS44NDItNzkuODQyLTc5Ljg0MnoiLz48cGF0aCBmaWxsPSIjZmZmYmY1IiBkPSJNMTc2LjE1NyA0MTUuMTU3YzAgNDQuMDI1IDM1LjgxNyA3OS44NDIgNzkuODQyIDc5Ljg0MlYzMzUuMzE1Yy00NC4wMjUgMC03OS44NDIgMzUuODE3LTc5Ljg0MiA3OS44NDJ6Ii8+PHBhdGggZmlsbD0iI2VmZTJkZCIgZD0iTTI1NS45OTkgMTYuOTk5bC0xMC42NjcgMjE3LjY2NyAxMC42NjcgMTgxLjI5NmMxNi44NzUgMjYuMjQ5IDQ2LjMzOCA0My42NjkgNzkuNzk1IDQzLjY2OSA0My4xMjEgMCA4MC44MjgtMjkuMTI3IDkxLjcyLTcwLjg0NCAxLjU0My01LjcyMSAzMi4xMTYtMTE5Ljc2NCAzMi4xMTYtMTY4LjE1NiAwLTExMi4yODMtOTEuMzQ4LTIwMy42MzItMjAzLjYzMS0yMDMuNjMyeiIvPjxwYXRoIGZpbGw9IiNmN2YwZWIiIGQ9Ik0xMDYuNjY2IDIwMi42NjZoMTQ5LjMzM1YxNi45OTljLTU1LjE2OCAwLTEwNS4yNzMgMjIuMDYyLTE0MS45ODIgNTcuODE1LS4wMy4zNDMtNy4zNTEgMTI3Ljg1Mi03LjM1MSAxMjcuODUyeiIvPjxwYXRoIGZpbGw9IiNlYmI2NWIiIGQ9Ik0yNTUuOTk5IDEyNy44MjVsLTEwLjY2NyA3NC44NTcgMTAuNjY3IDkxLjIyNWMxNi43My0zOS4wMzcgMjguMzMzLTcyLjg3NSAyOC4zMzMtMTAwLjU3NS4wMDEtMjAuNjI3LTQuOTkxLTQ4LjQxOC0yOC4zMzMtNjUuNTA3eiIvPjxwYXRoIGZpbGw9IiNmZmM2NjMiIGQ9Ik0yNTMuNjUzIDEyNi4xODVjLTIzLjc2NC0xNS44NDMtNDcuOTM5LTguOTY4LTY5LjI2OC0yLjkwMy0yNS4xNDIgNy4xNDktNDAuMTU3IDEwLjM5OS01Ni40NDYtNS44OS0xNi4xODItMTYuMTgyLTEzLjk1Mi00Mi4yMzYtMTMuOTIyLTQyLjU3OS0zOC4wMDQgMzcuMDE0LTYxLjY1IDg4LjcwMi02MS42NSAxNDUuODE3IDAgNDguMzcxIDMwLjU0OCAxNjIuMzM3IDMyLjExNCAxNjguMTQ5IDEwLjg5IDQxLjcyMSA0OC41OTkgNzAuODUxIDkxLjcyMiA3MC44NTEgMzMuNDU3IDAgNjIuOTItMTcuNDIgNzkuNzk1LTQzLjY2OVYxMjcuODI1YTY0LjQ2NSA2NC40NjUgMCAwMC0yLjM0NS0xLjY0eiIvPjxwYXRoIGZpbGw9IiMzMjM5M2YiIGQ9Ik0xNTguNDczIDE5Ny4wNTJoMzB2NTguOTQ3aC0zMHoiLz48cGF0aCBmaWxsPSIjMjYyYjJmIiBkPSJNMzIzLjUyNiAxOTcuMDUyaDMwdjU4Ljk0N2gtMzB6Ii8+PHBhdGggZmlsbD0iIzc0NDcyNyIgZD0iTTI2Ni43MTkgMjkxLjM2OGgtMTAuNzJsLTEwLjY2NyAzOS4yOTggMTAuNjY3IDQzLjIyOCAyOC43OTMtMTcuMjc2YTM1LjEyNyAzNS4xMjcgMCAwMDE3LjA1NS0zMC4xMjJjMC0xOS40MDEtMTUuNzI3LTM1LjEyOC0zNS4xMjgtMzUuMTI4eiIvPjxwYXRoIGZpbGw9IiM4ZDU2MmYiIGQ9Ik0yNDUuMjc5IDI5MS4zNjhjLTE5LjQwMSAwLTM1LjEyOCAxNS43MjctMzUuMTI4IDM1LjEyOGEzNS4xMjcgMzUuMTI3IDAgMDAxNy4wNTUgMzAuMTIybDI4Ljc5MyAxNy4yNzZ2LTgyLjUyNnoiLz48Zz48cGF0aCBmaWxsPSIjYzk3ODQwIiBkPSJNMTE0LjAyNCA3NC43OThjLTEwLjM1OC01LjkwNC0zMy45NC03LjY4Mi01MC4wNzktMy4yMzUtMTcuNTkgNC44NDctMzMuNTAyIDE2LjIyOC00Ni4wMDggMzIuOTAybC0uMTQ0LjE5MUE4OS4xMzEgODkuMTMxIDAgMDAuMTE1IDE2Mi41NjlsNS41NzEgMTU5LjY0NC4wMTEuMjY1YzEuOTQzIDM2LjkyNyAzMi40MzIgNjUuODU0IDY5LjQxMSA2NS44NTRIODVsLTQuMjEtMTguMzU0Yy0uMTYxLS43MDEtMTUuMzMyLTcxLjAyOSAzLjIzLTE2MC44NTggOC45NzktNDMuNDU0IDMyLjk3OS03OS45NjUgMzAuMDA0LTEzNC4zMjJ6Ii8+PHBhdGggZmlsbD0iI2FlNjMyYyIgZD0iTTM5Ny45NzQgNzQuNzk4YzEwLjM1OC01LjkwNCAzMy45NDEtNy42ODIgNTAuMDc5LTMuMjM1IDE3LjU5IDQuODQ3IDMzLjUwMiAxNi4yMjggNDYuMDA4IDMyLjkwMmwuMTQzLjE5MWE4OS4xMjYgODkuMTI2IDAgMDExNy42NzggNTcuOTEzbC01LjU3MSAxNTkuNjQ0LS4wMTEuMjY1Yy0xLjk0MyAzNi45MjctMzIuNDMyIDY1Ljg1NC02OS40MTEgNjUuODU0aC05Ljg5Mmw0LjIxLTE4LjM1NGMuMTYxLS43MDEgMTUuMzMyLTcxLjAyOS0zLjIzLTE2MC44NTgtOC45NzgtNDMuNDU0LTMyLjk3OC03OS45NjUtMzAuMDAzLTEzNC4zMjJ6Ii8+PC9nPjwvc3ZnPg==" />
<img src="data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%20511.998%20511.998%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22%23f7f0eb%22%20d%3D%22M255.999%20335.315l-10.667%2091.351%2010.667%2068.333c44.025%200%2079.842-35.817%2079.842-79.842s-35.816-79.842-79.842-79.842z%22%2F%3E%3Cpath%20fill%3D%22%23fffbf5%22%20d%3D%22M176.157%20415.157c0%2044.025%2035.817%2079.842%2079.842%2079.842V335.315c-44.025%200-79.842%2035.817-79.842%2079.842z%22%2F%3E%3Cpath%20fill%3D%22%23efe2dd%22%20d%3D%22M255.999%2016.999l-10.667%20217.667%2010.667%20181.296c16.875%2026.249%2046.338%2043.669%2079.795%2043.669%2043.121%200%2080.828-29.127%2091.72-70.844%201.543-5.721%2032.116-119.764%2032.116-168.156%200-112.283-91.348-203.632-203.631-203.632z%22%2F%3E%3Cpath%20fill%3D%22%23f7f0eb%22%20d%3D%22M106.666%20202.666h149.333V16.999c-55.168%200-105.273%2022.062-141.982%2057.815-.03.343-7.351%20127.852-7.351%20127.852z%22%2F%3E%3Cpath%20fill%3D%22%23ebb65b%22%20d%3D%22M255.999%20127.825l-10.667%2074.857%2010.667%2091.225c16.73-39.037%2028.333-72.875%2028.333-100.575.001-20.627-4.991-48.418-28.333-65.507z%22%2F%3E%3Cpath%20fill%3D%22%23ffc663%22%20d%3D%22M253.653%20126.185c-23.764-15.843-47.939-8.968-69.268-2.903-25.142%207.149-40.157%2010.399-56.446-5.89-16.182-16.182-13.952-42.236-13.922-42.579-38.004%2037.014-61.65%2088.702-61.65%20145.817%200%2048.371%2030.548%20162.337%2032.114%20168.149%2010.89%2041.721%2048.599%2070.851%2091.722%2070.851%2033.457%200%2062.92-17.42%2079.795-43.669V127.825a64.465%2064.465%200%2000-2.345-1.64z%22%2F%3E%3Cpath%20fill%3D%22%2332393f%22%20d%3D%22M158.473%20197.052h30v58.947h-30z%22%2F%3E%3Cpath%20fill%3D%22%23262b2f%22%20d%3D%22M323.526%20197.052h30v58.947h-30z%22%2F%3E%3Cpath%20fill%3D%22%23744727%22%20d%3D%22M266.719%20291.368h-10.72l-10.667%2039.298%2010.667%2043.228%2028.793-17.276a35.127%2035.127%200%200017.055-30.122c0-19.401-15.727-35.128-35.128-35.128z%22%2F%3E%3Cpath%20fill%3D%22%238d562f%22%20d%3D%22M245.279%20291.368c-19.401%200-35.128%2015.727-35.128%2035.128a35.127%2035.127%200%200017.055%2030.122l28.793%2017.276v-82.526z%22%2F%3E%3Cg%3E%3Cpath%20fill%3D%22%23c97840%22%20d%3D%22M114.024%2074.798c-10.358-5.904-33.94-7.682-50.079-3.235-17.59%204.847-33.502%2016.228-46.008%2032.902l-.144.191A89.131%2089.131%200%2000.115%20162.569l5.571%20159.644.011.265c1.943%2036.927%2032.432%2065.854%2069.411%2065.854H85l-4.21-18.354c-.161-.701-15.332-71.029%203.23-160.858%208.979-43.454%2032.979-79.965%2030.004-134.322z%22%2F%3E%3Cpath%20fill%3D%22%23ae632c%22%20d%3D%22M397.974%2074.798c10.358-5.904%2033.941-7.682%2050.079-3.235%2017.59%204.847%2033.502%2016.228%2046.008%2032.902l.143.191a89.126%2089.126%200%200117.678%2057.913l-5.571%20159.644-.011.265c-1.943%2036.927-32.432%2065.854-69.411%2065.854h-9.892l4.21-18.354c.161-.701%2015.332-71.029-3.23-160.858-8.978-43.454-32.978-79.965-30.003-134.322z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E" />
<img src="https://coderstoolbox.online/image/svg/eJx9lk1vIzcMhv%2BK4J6liF%2BSCGwWaE%2B99Jp7MonjBQxsgS3Sor%2B%2BL2dk17Pu9mKCgj7Ihy85%2FvTt4z19fHn785evfz0eaqrJiIr7uNjD50%2B%2FP%2F9xSscv5%2FPj4adjP9a3l0N6fTz8xmbY4UnEipCdM9XSWk9ORYzS9NooIrKolsqG%2B7uXoZxxZlC%2FeJv5tq22vFud5u%2FDw3ehHI8vR9tCod4KWU9KFnapab63e2ZvnmbcS77ENl%2Bah%2FJu993zb8c3fn3dk6AW5gqCqa92ujSosLcFu0a3xK2wetIGPiOpYI%2FHY93t4sEQE6CNWgaPzA5%2FBdyBBWuqiYqpZMMKJeFCwEeEW5peXZSArCE%2FIi48JEeFFNdVPCM8LV38e9I3RafaEFpLXDnsidSjvk9b6ksGCbwXb1Ur3CUxl9o4k0JOg5N1sLVc8JQg7r5JhbFqvPfuib%2B8NPtOe%2Bte%2Fld7XXH0Shx5MlsA75LF8SiKsuoxd96KsHlUa7FupdagUBr3rLifso6iBFLbtmbFav8PJS6tySUwMDRBYFDkgLhYohYZwhzIV3tx8TyKt5GbF4bh4lUyA1yoDb%2Beta5yRhrinq0V1YYaD0cxcS1fjRQHN0VZpa0er551zzKQDkTQSyXNjRBWGqP0ytMh3ZoDzYL0OuQDCDqgYka2fZMPBBbygVARzIAkaVUaThjwhwZRsVWQfPFEilpci3scMfaydRGEnTdhP82yPTctikimwfipoCFqGQHqyvl9j1pYXI5TiobiQGHkSNH4JPUDK679lKXeFYkbv%2FA8iVuKcfufkw%2Fvd0931c59VrlBUuSJo5PaOIX8Ol9VCKkxRuj0kDPzCKl1l8DBvT1jxkQrTxOZU8RiCAArvKCBvCjkSNHaPa8bx97c5TherV1yZI3%2Bu4a4zPvQmdvhtLt4C2T8MKy0hXXekkhbEh95cHD8EbHF%2B9A6i0UxZDUatHtEA2nbgKa9aoZiXNH9DZK2WmqoF4q2gGXQHFqnxyarHDMWNDPGZq0jNOoV4KFQLeT088CIFErTRAIQsa2atuZnNDCETubQFwLCN44bBgSelyQYYbzKXoUTen2YJvSoEk3v14FJo4VRFXSM6YJ3G2X01FonwSzthDTxTUT4aNJoiJEgLWSk0RbrUA4P%2FeBtxYomRedqEb4fec9vmMfLFC3E6v1K8BZgWgHSRjDdEkw3BNOOYNoTBEAJgM9BDq0xDQBSfMX6iMntJOe8Q5ivDPMtxLyDmHcQTxkfVOfzLccrxrTDmG8xxtDsY2LMK8YxMeYVo%2Bwwhh4f8O%2Fm8z%2FH%2FeZ3" />
</body>
</html>
The result of above code will be
Conclusion
Using the SVG Minify tool, will minify and optimize your svg codes. By just copy, paste and click, you can already have minify version of your svg code. And also the tool will provide you a different links that you can use for your img tag.
Do you have comment, suggestion and question about the tools, just comment it below.
