1<!doctype html> 2<html dir="ltr" lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <meta 6 name="viewport" 7 content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" 8 /> 9 <meta 10 name="description" 11 content="Convert color or monochrome bitmap images (PNG, JPG, JPEG, WEBP, AVIF, GIF,â¦) to color or monochrome vector images (SVG)." 12 /> 13 <meta name="theme-color" content="#131313" /> 14 <meta name="color-scheme" content="dark light" /> 15 <meta 16 name="description" 17 content="SVGcode is a Progressive Web App that lets you convert raster images like JPG, PNG, GIF, WebP, AVIF, etc. to vector graphics in SVG format." 18 /> 19 20 <meta property="og:title" content="SVGcode" /> 21 <meta property="og:type" content="website" /> 22 <meta property="og:url" content="https://svgco.de/" /> 23 <meta 24 property="og:image" 25 content="https://svgco.de/screenshots/desktop-dark.png" 26 /> 27 <meta 28 property="og:description" 29 content="SVGcode is a Progressive Web App that lets you convert raster images like JPG, PNG, GIF, WebP, AVIF, etc. to vector graphics in SVG format." 30 /> 31 <meta name="monetization" content="$ilp.gatehub.net/348218105" /> 32 33 <!-- (Chrome) Web App Dark Mode --> 34 <meta 35 http-equiv="origin-trial" 36 content="AhLXeDFYJ0yF4e0It5evBIxgcWJDxcRzIK7mRSwEdWTv0CwetrQZHJHKe5j3WLcf1lZYkzKJZtW+88rSA4yzZAYAAABQeyJvcmlnaW4iOiJodHRwczovL3N2Z2NvLmRlOjQ0MyIsImZlYXR1cmUiOiJXZWJBcHBEYXJrTW9kZSIsImV4cGlyeSI6MTY3NTgxNDM5OX0=" 37 /> 38 39 <!-- (Chrome) Web App Dark Mode v2 --> 40 <meta 41 http-equiv="origin-trial" 42 content="AszAyNxfEENEzLjioa9hIxoDYUte+uiWWUhEZWXlvAZhSf4Tk7X5CjUinKSJ4xS56euPn8EChrxIB8A8orvt8g4AAABSeyJvcmlnaW4iOiJodHRwczovL3N2Z2NvLmRlOjQ0MyIsImZlYXR1cmUiOiJXZWJBcHBEYXJrTW9kZVYyIiwiZXhwaXJ5IjoxNjkxNTM5MTk5fQ==" 43 /> 44 45 <meta name="twitter:card" content="summary_large_image" /> 46 <meta name="twitter:site" content="@ChromiumDev" /> 47 <meta name="twitter:creator" content="@tomayac" /> 48 <meta name="twitter:title" content="SVGcode" /> 49 <meta 50 name="twitter:description" 51 content="SVGcode is a Progressive Web App that lets you convert raster images like JPG, PNG, GIF, WebP, AVIF, etc. to vector graphics in SVG format." 52 /> 53 <meta 54 name="twitter:image" 55 content="https://svgco.de/screenshots/desktop-dark.png" 56 /> 57 58 <title>SVGcodeâConvert raster images to SVG vector graphics</title> 59 <link 60 rel="stylesheet" 61 href="data:text/css;base64,LyoqCiAqIFNWR2NvZGXigJRDb252ZXJ0IHJhc3RlciBpbWFnZXMgdG8gU1ZHIHZlY3RvciBncmFwaGljcwogKiBDb3B5cmlnaHQgKEMpIDIwMjEgR29vZ2xlIExMQwogKgogKiBUaGlzIHByb2dyYW0gaXMgZnJlZSBzb2Z0d2FyZTsgeW91IGNhbiByZWRpc3RyaWJ1dGUgaXQgYW5kL29yCiAqIG1vZGlmeSBpdCB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlCiAqIGFzIHB1Ymxpc2hlZCBieSB0aGUgRnJlZSBTb2Z0d2FyZSBGb3VuZGF0aW9uOyBlaXRoZXIgdmVyc2lvbiAyCiAqIG9mIHRoZSBMaWNlbnNlLCBvciAoYXQgeW91ciBvcHRpb24pIGFueSBsYXRlciB2ZXJzaW9uLgogKgogKiBUaGlzIHByb2dyYW0gaXMgZGlzdHJpYnV0ZWQgaW4gdGhlIGhvcGUgdGhhdCBpdCB3aWxsIGJlIHVzZWZ1bCwKICogYnV0IFdJVEhPVVQgQU5ZIFdBUlJBTlRZOyB3aXRob3V0IGV2ZW4gdGhlIGltcGxpZWQgd2FycmFudHkgb2YKICogTUVSQ0hBTlRBQklMSVRZIG9yIEZJVE5FU1MgRk9SIEEgUEFSVElDVUxBUiBQVVJQT1NFLiAgU2VlIHRoZQogKiBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBmb3IgbW9yZSBkZXRhaWxzLgogKgogKiBZb3Ugc2hvdWxkIGhhdmUgcmVjZWl2ZWQgYSBjb3B5IG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZQogKiBhbG9uZyB3aXRoIHRoaXMgcHJvZ3JhbTsgaWYgbm90LCB3cml0ZSB0byB0aGUgRnJlZSBTb2Z0d2FyZQogKiBGb3VuZGF0aW9uLCBJbmMuLCA1MSBGcmFua2xpbiBTdHJlZXQsIEZpZnRoIEZsb29yLCBCb3N0b24sIE1BICAwMjExMC0xMzAxLCBVU0EuCiAqLwoKOnJvb3QgewogIC0tbWFpbi1hY2NlbnQtY29sb3I6IGhvdHBpbms7CiAgLS1hbHRlcm5hdGl2ZS1hY2NlbnQtY29sb3I6ICMzMzdlZmY7CiAgLS1jYW52YXMtdGV4dDogI2ZmZjsKICAtLWNhbnZhczogIzEzMTMxMzsKCiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY2FudmFzKTsKICBjb2xvcjogdmFyKC0tY2FudmFzLXRleHQpOwp9CgouZHJvcGVudGVyOjpiZWZvcmUgewogIGJhY2tncm91bmQtY29sb3I6ICMxMzEzMTNkZDsKfQoKLm1vbm9jaHJvbWUgc3ZnIHsKICBmaWx0ZXI6IGludmVydCgxMDAlKTsKfQoKYnV0dG9uIHsKICBjb2xvcjogdmFyKC0tY2FudmFzLXRleHQpOwp9CgpidXR0b24ud2l0aC1iZyB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY2FudmFzKTsKfQoKLmNoZWNrZXJib2FyZCB7CiAgYmFja2dyb3VuZC1pbWFnZToKICAgIGxpbmVhci1ncmFkaWVudCgKICAgICAgNDVkZWcsCiAgICAgICMxMzEzMTMgMjUlLAogICAgICB0cmFuc3B
61hcmVudCAyNSUsCiAgICAgIHRyYW5zcGFyZW50IDc1JSwKICAgICAgIzEzMTMxMyA3NSUsCiAgICAgICMxMzEzMTMgMTAwJQogICAgKSwKICAgIGxpbmVhci1ncmFkaWVudCgKICAgICAgNDVkZWcsCiAgICAgICMxMzEzMTMgMjUlLAogICAgICAjMDAwIDI1JSwKICAgICAgIzAwMCA3NSUsCiAgICAgICMxMzEzMTMgNzUlLAogICAgICAjMTMxMzEzIDEwMCUKICAgICk7Cn0K" 62 media="(prefers-color-scheme: dark)" 63 /> 64 <link 65 rel="stylesheet" 66 href="data:text/css;base64,LyoqCiAqIFNWR2NvZGXigJRDb252ZXJ0IHJhc3RlciBpbWFnZXMgdG8gU1ZHIHZlY3RvciBncmFwaGljcwogKiBDb3B5cmlnaHQgKEMpIDIwMjEgR29vZ2xlIExMQwogKgogKiBUaGlzIHByb2dyYW0gaXMgZnJlZSBzb2Z0d2FyZTsgeW91IGNhbiByZWRpc3RyaWJ1dGUgaXQgYW5kL29yCiAqIG1vZGlmeSBpdCB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlCiAqIGFzIHB1Ymxpc2hlZCBieSB0aGUgRnJlZSBTb2Z0d2FyZSBGb3VuZGF0aW9uOyBlaXRoZXIgdmVyc2lvbiAyCiAqIG9mIHRoZSBMaWNlbnNlLCBvciAoYXQgeW91ciBvcHRpb24pIGFueSBsYXRlciB2ZXJzaW9uLgogKgogKiBUaGlzIHByb2dyYW0gaXMgZGlzdHJpYnV0ZWQgaW4gdGhlIGhvcGUgdGhhdCBpdCB3aWxsIGJlIHVzZWZ1bCwKICogYnV0IFdJVEhPVVQgQU5ZIFdBUlJBTlRZOyB3aXRob3V0IGV2ZW4gdGhlIGltcGxpZWQgd2FycmFudHkgb2YKICogTUVSQ0hBTlRBQklMSVRZIG9yIEZJVE5FU1MgRk9SIEEgUEFSVElDVUxBUiBQVVJQT1NFLiAgU2VlIHRoZQogKiBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBmb3IgbW9yZSBkZXRhaWxzLgogKgogKiBZb3Ugc2hvdWxkIGhhdmUgcmVjZWl2ZWQgYSBjb3B5IG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZQogKiBhbG9uZyB3aXRoIHRoaXMgcHJvZ3JhbTsgaWYgbm90LCB3cml0ZSB0byB0aGUgRnJlZSBTb2Z0d2FyZQogKiBGb3VuZGF0aW9uLCBJbmMuLCA1MSBGcmFua2xpbiBTdHJlZXQsIEZpZnRoIEZsb29yLCBCb3N0b24sIE1BICAwMjExMC0xMzAxLCBVU0EuCiAqLwoKOnJvb3QgewogIC0tbWFpbi1hY2NlbnQtY29sb3I6ICNlNjAwNzM7CiAgLS1hbHRlcm5hdGl2ZS1hY2NlbnQtY29sb3I6ICMzMzdlZmY7CiAgLS1jYW52YXMtdGV4dDogIzAwMDsKICAtLWNhbnZhczogI2ZmZjsKfQoKLmRyb3BlbnRlcjo6YmVmb3JlIHsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZTsKfQoKYnV0dG9uLndpdGgtYmcgewogIGJhY2tncm91bmQtY29sb3I6ICNmZmY7Cn0KCi5jaGVja2VyYm9hcmQgewogIGJhY2tncm91bmQtaW1hZ2U6CiAgICBsaW5lYXItZ3JhZGllbnQoCiAgICAgIDQ1ZGVnLAogICAgICAjZWVlIDI1JSwKICAgICAgdHJhbnNwYXJlbnQgMjUlLAogICAgICB0cmFuc3BhcmVudCA3NSUsCiAgICAgICNlZWUgNzUlLAogICAgICAjZWVlIDEwMCUKICAgICksCiAgICBsaW5lYXItZ3JhZGllbnQoNDVkZWcsICNlZWUgMjUlLCB3aGl0ZSAyNSUsIHdoaXRlIDc1JSwgI2VlZSA3NSUsICNlZWUgMTAwJSk7Cn0K" 67 media="(prefers-color-scheme: light)" 68 /> 69 <link rel="icon" type="image/svg" href="/favicon.svg" /> 70 <link rel="canonical" href="https://svgco.de/" /> 71 <link rel="apple-touch-icon" href="/favicon.png" /> 72 73
73<script type="application/ld+json"> 74 { 75 "@context": "https://schema.org", 76 "@type": "WebApplication", 77 "name": "SVGcode", 78 "applicationCategory": "DesignApplication, BrowserApplication, MultimediaApplication, UtilitiesApplication", 79 "screenshot": "https://svgco.de/screenshots/desktop-dark.png", 80 "author": { 81 "@type": "Person", 82 "name": "Thomas Steiner", 83 "email": "[email protected]", 84 "image": "https://blog.tomayac.com/static/icon.png" 85 }, 86 "offers": { 87 "@type": "Offer", 88 "price": "0" 89 }, 90 "publisher": { 91 "@type": "Organization", 92 "name": "Blogccasion", 93 "email": "[email protected]", 94 "logo": { 95 "@type": "ImageObject", 96 "url": "https://blog.tomayac.com/static/icon.png" 97 } 98 } 99 } 100 </script>
100 101 <base target="_blank" /> 102 103 <link rel="stylesheet" crossorigin href="/assets/style-BrDG3gII.css"> 104
104<script id="cos-loader">(function(){async function e(e){window.__cosManifest=e;let t=navigator.crossOriginStorage,n={},r=Promise.resolve(),i=e=>{let t=r.then(e,e);return r=t.catch(()=>{}),t};async function a(e,n){if(t)try{let n=await(await i(()=>t.requestFileHandle({algorithm:`SHA-256`,value:e}))).getFile();return URL.createObjectURL(new Blob([n],{type:`text/javascript`}))}catch(e){e?.name!==`NotFoundError`&&console.error(`[cos] lookup failed`,e)}let r=await fetch(n);if(!r.ok)throw Error(`[cos] failed to fetch chunk ${n}: ${r.status} ${r.statusText}`);let a=r.headers.get(`content-type`)??``;if(a&&!/javascript|ecmascript/i.test(a))throw Error(`[cos] chunk ${n} served as ${a}, expected JavaScript`);let o=new Blob([await r.blob()],{type:`text/javascript`});if(t)try{await i(async()=>{let n=await(await t.requestFileHandle({algorithm:`SHA-256`,value:e},{create:!0,origins:`*`})).createWritable();await n.write(o),await n.close()})}catch(e){console.error(`[cos] store failed`,e)}return URL.createObjectURL(o)}await Promise.all(Object.entries(e.chunks).map(async([t,{file:r,hash:i}])=>{n[t]=await a(i,e.base+r)})),n[e.entry.specifier]=new URL(e.base+e.entry.file,location.origin).href;let o=document.createElement(`script`);o.type=`importmap`,o.textContent=JSON.stringify({imports:n}),document.head.appendChild(o),await new Promise(e=>setTimeout(e,0)),await import(e.entry.specifier)}e({"base":"/assets/","entry":{"specifier":"cos1:entry","file":"index-CuzaZXoa.js"},"chunks":{"cos1:435a4ad43c0fec7751150583b42bb0174bed98ea2931c27026bece2266a0f82e":{"file":"435a4ad43c0fec7751150583b42bb0174bed98ea2931c27026bece2266a0f82e.js","hash":"435a4ad43c0fec7751150583b42bb0174bed98ea2931c27026bece2266a0f82e","name":"pointer-tracker"},"cos1:87f664940a4a09612daf1c459a1afbf9dfa79ed63efab4ab30a661087b4b2341":{"file":"87f664940a4a09612daf1c459a1afbf9dfa79ed63efab4ab30a661087b4b2341.js","hash":"87f664940a4a09612daf1c459a1afbf9dfa79ed63efab4ab30a661087b4b2341","name":"pinch-zoom-element"}}})})();</script>
104<link rel="manifest" href="/manifest.webmanifest"></head> 105 <body> 106 <main> 107 <details class="main"> 108 <summary></summary> 109 <button type="button" class="with-bg close-options-button"> 110 <span aria-hidden="true">✕</span> 111 </button> 112 <div class="sidebar"> 113 <form> 114 <div class="preprocess"> 115 <div class="other-input"> 116 <input 117 id="color" 118 type="radio" 119 class="color" 120 name="output-option" 121 checked 122 /> 123 <label for="color"></label> 124 </div> 125 <div class="other-input"> 126 <input 127 id="monochrome" 128 type="radio" 129 class="monochrome" 130 name="output-option" 131 /> 132 <label for="monochrome"></label> 133 </div> 134 <div class="other-input"> 135 <input id="consider-dpr" type="checkbox" class="consider-dpr" /> 136 <label for="consider-dpr"></label> 137 </div> 138 <div class="other-input advanced"> 139 <input 140 id="optimize-curves" 141 type="checkbox" 142 class="optimize-curves" 143 checked 144 /> 145 <label for="optimize-curves"></label> 146 </div> 147 <div class="other-input"> 148 <input 149 id="posterize" 150 type="checkbox" 151 class="posterize" 152 checked 153 /> 154 <label for="posterize"></label> 155 </div> 156 <div class="other-input"> 157 <input 158 id="show-advanced" 159 type="checkbox" 160 class="show-advanced" 161 /> 162 <label for="show-advanced"></label> 163 </div> 164 <div class="details"></div> 165 <div class="other-input"> 166 <button type="button" class="reset-all"></button> 167 </div> 168 </div> 169 </form> 170 <ul class="link-list"> 171 <li> 172 <a href="https://github.com/tomayac/SVGcode">GitHub</a> 173 </li> 174 <li> 175 <a c href="https://twitter.com/ChromiumDev">Twitter</a> 176 </li> 177 <li> 178 <a class="about" href="https://web.dev/svgcode/"></a> 179 </li> 180 <li> 181 <a 182 class="license" 183 href="https://github.com/tomayac/SVGcode/blob/main/LICENSE" 184 ></a> 185 </li> 186 <li> 187 <a 188 class="terms" 189 href="https://github.com/tomayac/SVGcode/blob/main/docs/terms_of_service.md" 190 >Terms of Service</a 191 > 192 </li> 193 <li> 194 <a 195 class="privacy" 196 href="https://github.com/tomayac/SVGcode/blob/main/docs/privacy_policy.md" 197 >Privacy Policy</a 198 > 199 </li> 200 <li> 201 <a 202 class="refund" 203 href="https://github.com/tomayac/SVGcode/blob/main/docs/refund_policy.md" 204 >Refund Policy</a 205 > 206 </li> 207 </ul> 208 <dark-mode-toggle 209 permanent 210 dark="Light Theme" 211 light="Dark Theme" 212 ></dark-mode-toggle> 213 <select class="language"></select> 214 </div> 215 </details> 216 <div class="main-area"> 217 <div class="menu"> 218 <button class="open menu" type="button"></button> 219 <button class="save menu" type="button"></button> 220 <button class="copy menu" type="button"></button> 221 <button class="paste menu" type="button"></button> 222 <button class="share menu" type="button"></button> 223 <button class="install menu" type="button"></button> 224 <progress hidden value="0" max="100"></progress> 225 <label hidden>
225<input class="debug" type="checkbox" /> Debug</label> 226 </div> 227 <img 228 class="input-image" 229 crossorigin="anonymous" 230 src="/favicon.png" 231 alt="" 232 draggable="false" 233 /> 234 <canvas></canvas> 235 <div dir="ltr" class="pinch-zoom-wrapper"> 236 <pinch-zoom class="checkerboard"> 237 <div></div> 238 </pinch-zoom> 239 <svg version="1.0" xmlns="http://www.w3.org/2000/svg"> 240 <g class="svg-output"></g> 241 </svg> 242 </div> 243 <div class="toast" hidden></div> 244 </div> 245 </main> 246 </body> 247</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.