{"id":37605,"date":"2017-08-07T21:01:23","date_gmt":"2017-08-07T13:01:23","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=37605"},"modified":"2017-12-08T19:03:09","modified_gmt":"2017-12-08T11:03:09","slug":"resize-export-svg-png-myscale","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/","title":{"rendered":"Resize &#038; Convert SVG to PNG (Online) with myScale"},"content":{"rendered":"<p>SVGs are incredibly useful to designers who need <strong>scalable graphics<\/strong>. You\u2019ll find dozens of <a href=\"https:\/\/www.hongkiat.com\/blog\/svg-tools\/\">SVG tools<\/a> and programs that let you <strong>resize and export SVGs<\/strong> from your Mac or Windows machine.<\/p>\n<p>But, what about <strong>editing SVGs in the browser<\/strong>? Wouldn\u2019t it be great to <strong>resize & export SVGs<\/strong> with just a few clicks, no software needed?<\/p>\n<p>That\u2019s exactly the purpose of <strong><a target=\"_blank\" href=\"https:\/\/webkul.github.io\/myscale\/\">myScale<\/a><\/strong> and it handles the task well. This free web app lets you <strong>upload any SVG file<\/strong>, <strong>input the exact dimensions<\/strong> you want, then <strong>export that as a PNG<\/strong>.<\/p>\n<p class=\"note\"><strong>Read Also:<\/strong> <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/scalable-vector-graphic\/\">A Look into: Scalable Vector Graphics (SVG)<\/a><\/p>\n<p>It seems like a really simple tool but it handles a lot of processing on the backend. Converting SVGs to PNGs isn\u2019t the easiest task in the world.<\/p>\n<p>All code for this app is <strong>open-sourced<\/strong> and  available <strong><a target=\"_blank\" href=\"https:\/\/github.com\/webkul\/myscale\">on GitHub<\/a><\/strong>, so you can check it out if you\u2019re curious. This also means you can <strong>download the files<\/strong> and <strong>host them locally<\/strong> on your own web server (100% JavaScript).<\/p>\n<p>If you\u2019re a heavy Illustrator-user then you might not find much use for this web app, though.<\/p>\n<p>But, sometimes you won\u2019t have access to Illustrator and other times you won\u2019t want to bother digging around the interface. myScale offers a <strong>simplified method for SVG conversion<\/strong>:<\/p>\n<ol>\n<li>Upload your <code>.svg<\/code> file.<\/li>\n<li>Input the width in pixels (maintains the aspect ratio automatically).<\/li>\n<li>Click \u201cGenerate\u201d to preview the output, then click \u201cDownload\u201d to get your PNG.<\/li>\n<\/ol>\n<p>This can all be done with <strong>just a browser and Internet access<\/strong>. You can use this on <a href=\"https:\/\/www.hongkiat.com\/blog\/free-icon-sets-to-bookmark\/\">freebie iconsets<\/a> you already have on your computer, or you can browse through <a href=\"https:\/\/www.hongkiat.com\/blog\/iconfinder-an-icon-search-engine\/\">icon search engines<\/a> to find SVGs to resize.<\/p>\n<p>Since you\u2019re uploading a pure vector graphic, you get <strong>no data loss<\/strong> whatsoever. You can export a 100px icon or a 1000px icon, the quality should be exactly the same.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/webkul.github.io\/myscale\/\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg\" alt=\"Upload SVG myScale\" width=\"1000\" height=\"605\"><\/a><\/figure>\n<p>Take a peek at the homepage and give it a try. You may find this web app a little easier to use than Illustrator, Sketch, or any similar graphics editing program.<\/p>\n<p class=\"note\"><strong>Read Also:<\/strong> <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/javascript-libraries-animate-svg\/\">8 JavaScript Libraries to Animate SVG<\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>SVGs are incredibly useful to designers who need scalable graphics. You\u2019ll find dozens of SVG tools and programs that let you resize and export SVGs from your Mac or Windows machine. But, what about editing SVGs in the browser? Wouldn\u2019t it be great to resize &#038; export SVGs with just a few clicks, no software&hellip;<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3393],"tags":[2175],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Resize &amp; Convert SVG to PNG (Online) with myScale - Hongkiat<\/title>\n<meta name=\"description\" content=\"SVGs are incredibly useful to designers who need scalable graphics. You&#039;ll find dozens of SVG tools and programs that let you resize and export SVGs from\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Resize &amp; Convert SVG to PNG (Online) with myScale\" \/>\n<meta property=\"og:description\" content=\"SVGs are incredibly useful to designers who need scalable graphics. You&#039;ll find dozens of SVG tools and programs that let you resize and export SVGs from\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2017-08-07T13:01:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-12-08T11:03:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg\" \/>\n<meta name=\"author\" content=\"Jake Rocheleau\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jake Rocheleau\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/\"},\"author\":{\"name\":\"Jake Rocheleau\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\"},\"headline\":\"Resize &#038; Convert SVG to PNG (Online) with myScale\",\"datePublished\":\"2017-08-07T13:01:23+00:00\",\"dateModified\":\"2017-12-08T11:03:09+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/\"},\"wordCount\":350,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/resize-export-svg-png-myscale\\\/02-uploaded-computer-svg-icon.jpg\",\"keywords\":[\"Scalable Vector Graphics (SVG)\"],\"articleSection\":[\"Toolkit\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/\",\"name\":\"Resize & Convert SVG to PNG (Online) with myScale - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/resize-export-svg-png-myscale\\\/02-uploaded-computer-svg-icon.jpg\",\"datePublished\":\"2017-08-07T13:01:23+00:00\",\"dateModified\":\"2017-12-08T11:03:09+00:00\",\"description\":\"SVGs are incredibly useful to designers who need scalable graphics. You'll find dozens of SVG tools and programs that let you resize and export SVGs from\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/resize-export-svg-png-myscale\\\/02-uploaded-computer-svg-icon.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/resize-export-svg-png-myscale\\\/02-uploaded-computer-svg-icon.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/resize-export-svg-png-myscale\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Resize &#038; Convert SVG to PNG (Online) with myScale\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\",\"name\":\"Jake Rocheleau\",\"description\":\"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers\",\"sameAs\":[\"https:\\\/\\\/www.hongkiat.com\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/jake\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Resize & Convert SVG to PNG (Online) with myScale - Hongkiat","description":"SVGs are incredibly useful to designers who need scalable graphics. You'll find dozens of SVG tools and programs that let you resize and export SVGs from","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/","og_locale":"en_US","og_type":"article","og_title":"Resize & Convert SVG to PNG (Online) with myScale","og_description":"SVGs are incredibly useful to designers who need scalable graphics. You'll find dozens of SVG tools and programs that let you resize and export SVGs from","og_url":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2017-08-07T13:01:23+00:00","article_modified_time":"2017-12-08T11:03:09+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg","type":"","width":"","height":""}],"author":"Jake Rocheleau","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Jake Rocheleau","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/"},"author":{"name":"Jake Rocheleau","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a"},"headline":"Resize &#038; Convert SVG to PNG (Online) with myScale","datePublished":"2017-08-07T13:01:23+00:00","dateModified":"2017-12-08T11:03:09+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/"},"wordCount":350,"commentCount":0,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg","keywords":["Scalable Vector Graphics (SVG)"],"articleSection":["Toolkit"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/","url":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/","name":"Resize & Convert SVG to PNG (Online) with myScale - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg","datePublished":"2017-08-07T13:01:23+00:00","dateModified":"2017-12-08T11:03:09+00:00","description":"SVGs are incredibly useful to designers who need scalable graphics. You'll find dozens of SVG tools and programs that let you resize and export SVGs from","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/resize-export-svg-png-myscale\/02-uploaded-computer-svg-icon.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/resize-export-svg-png-myscale\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Resize &#038; Convert SVG to PNG (Online) with myScale"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a","name":"Jake Rocheleau","description":"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers","sameAs":["https:\/\/www.hongkiat.com"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/jake\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-9Mx","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/37605","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=37605"}],"version-history":[{"count":2,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/37605\/revisions"}],"predecessor-version":[{"id":42123,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/37605\/revisions\/42123"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=37605"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=37605"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=37605"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=37605"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}