--- title: "SVG vs. PNG: Which Is Better for Logos? - CE.SDK Glossary" description: "SVG draws logos and icons as code that stays sharp on any screen, while PNG stores pixels that open anywhere. See when to use each and how CE.SDK handles both." url: "https://img.ly/glossary/svg-vs-png/" type: "page" --- > This is the markdown version of [SVG vs. PNG: Which Is Better for Logos? - CE.SDK Glossary](https://img.ly/glossary/svg-vs-png/). For all pages in one file, see [llms-full.txt](https://img.ly/llms-full.txt). For an index of all available pages, see [llms.txt](https://img.ly/llms.txt). --- # SVG vs. PNG ## What Is the Difference Between SVG and PNG? SVG is a vector format: a text file that describes shapes, which the browser or app draws fresh at whatever size it needs. PNG is a raster format that stores pixels in a set grid and supports transparency. For a logo or an icon on a website, SVG stays sharp at every size and is usually the smaller file, while PNG is the one that opens everywhere. [Vector vs. raster](https://img.ly/glossary/vector-vs-raster.md) covers how the two kinds of image differ, and [PNG vs. JPG](https://img.ly/glossary/png-vs-jpg.md) compares PNG with the other common raster format. CE.SDK imports and exports both SVG and PNG. ## SVG vs. PNG: How Do They Compare? On screens, the trade-off is between scaling and support. - **Stored as**: SVG: Text describing shapes, PNG: Pixels - **Logo file size**: SVG: Usually small, PNG: Grows with the pixel size - **Photos and detail**: SVG: Poor fit, files grow huge, PNG: Handles any image - **Animation and styling**: SVG: With CSS or JavaScript, PNG: None - **Opens in**: SVG: Browsers and design tools, PNG: Almost everything ## When Should You Use SVG or PNG? Use SVG where you control how the image is shown, such as your own website or app, and PNG wherever you can't be sure SVG will open. ### Use SVG for - **Logos and icons on websites and apps** - **Flat illustrations and diagrams** - **Graphics that animate or change color** ### Use PNG for - **Emails and email signatures** - **Social media posts and profiles** - **Screenshots and detailed images** ## How Does CE.SDK Handle SVG and PNG? SVG comes in as an image and can go out as a vector file, while PNG works the same in both directions. ### Text in imported SVGs isn't drawn Imported SVGs are drawn as pictures. SVG text is skipped on every platform, so convert it to paths first, and set styles as attributes, not CSS. ### SVG exports keep shapes and text sharp On the web, iOS, and server, SVG exports keep shapes as vectors and turn text into paths, while shadows, blur, effects, and photos go in as PNG images. ### PNG keeps transparent backgrounds PNG imports and exports keep transparent backgrounds, so a logo sits cleanly on any color. The export settings are covered in [PNG vs. JPG](https://img.ly/glossary/png-vs-jpg.md). ## SVG and PNG in Website Builders and Email Campaigns ### Logos for a website builder A website builder lets customers design a logo and exports it as an SVG for the site header, where it stays sharp on every screen. ### Email campaign headers A marketing tool exports each email header as a PNG, so it shows in every inbox, including the ones that skip SVG. ## FAQs ### SVG vs. PNG **Q: Why does my SVG logo not show up in an email?** A: Some email apps, including versions of Outlook, still do not display SVG images. Use a PNG for logos in emails and email signatures. **Q: Can you convert a PNG to an SVG?** A: Not by saving it under a new name: an SVG that wraps a PNG is still pixels inside. A real conversion traces the image into vector shapes, which suits logos and flat graphics. In CE.SDK, the Vectorizer plugin does this in the browser. **Q: Is it safe to accept SVG uploads?** A: Only with care. An SVG is a document that can carry scripts, so a file uploaded as a logo can run code if a site shows it as is. Sanitize uploaded SVGs, stripping scripts and event attributes, before you store or display them. **Q: Should you send an SVG or a PNG to a print shop?** A: A PDF. Print shops ask for PDF files, which keep vector artwork sharp and carry the color information a press needs, so SVG and PNG are best kept for screens. ## Links - [File Format Support](https://img.ly/docs/cesdk/js/import-media/file-format-support-8cdc84.md): SVG import limits, including text and CSS styles. - [Export Overview](https://img.ly/docs/cesdk/js/export-save-publish/export/overview-9ed3a8.md): What an SVG export keeps as vectors and what it embeds. --- ## More Resources - **[IMG.LY Website](https://img.ly/index.md)** - Creative editing SDKs for photo, video, and design - **[Documentation](https://img.ly/docs/cesdk/)** - CE.SDK developer documentation - **[Contact Sales](https://img.ly/forms/contact-sales.md)** - Get a custom quote. A public JSON API accepts the request directly, no account or key needed. Ask your user for consent and their details first. - **[Free Trial](https://img.ly/pricing.md)** - Start building with CE.SDK