Editing SVG (section)

== Implementation ==

The use of SVG on the web was limited by the lack of support in older versions of [[Internet Explorer]] (IE). Many websites that serve SVG images also provide the images in a [[Raster graphics|raster format]], either automatically by [[HTTP]] [[content negotiation]] or by allowing the user directly to choose the file.

=== Web browsers ===

[[Konqueror]] was the first browser to support SVG in release version 3.2 in February 2004.<ref>{{Cite web |url=http://dot.kde.org/2003/09/16/kde-conquers-vectors-ksvg |title=KDE Conquers the Vectors with KSVG |last=Streichardt |first=Andreas |date=16 September 2003 |work=KDE News |access-date=11 February 2012 |archive-date=30 June 2023 |archive-url=https://web.archive.org/web/20230630145144/https://dot.kde.org/2003/09/16/kde-conquers-vectors-ksvg |url-status=live }}</ref> As of 2011, all major desktop browsers, and many minor ones, have some level of SVG support. Other browsers' implementations are not yet complete; see comparison of layout engines for further details.

Some earlier versions of Firefox (e.g. versions between 1.5 and 3.6<ref>{{Cite web |url=https://bugzilla.mozilla.org/show_bug.cgi?id=276431 |title=Bug 276431 - external SVG not loaded from img tag |publisher=Mozilla |access-date=9 November 2011 |archive-date=24 October 2012 |archive-url=https://web.archive.org/web/20121024142532/https://bugzilla.mozilla.org/show_bug.cgi?id=276431 |url-status=live }}{{inconsistent cite|date=February 2023}}</ref>), as well as a few other, now outdated, web browsers capable of displaying SVG graphics, needed them embedded in <code>&lt;object&gt;</code> or <code>&lt;iframe&gt;</code> [[HTML element|elements]] to display them integrated as parts of an HTML webpage instead of using the standard way of integrating images with <code>&lt;img&gt;</code>.<ref>{{cite web |url=http://groups.google.com/group/mozilla.dev.tech.svg/browse_thread/thread/75f14ac7244b0fa5/a6ccf7261c5110b7?lnk=raot |title=SVG image not shown by Firefox |work=mozilla.dev.tech.svg |publisher=[[Google Groups]] |date=25 February 2009 |access-date=25 February 2010 |author=Lusotec |archive-date=14 May 2011 |archive-url=https://web.archive.org/web/20110514102136/http://groups.google.com/group/mozilla.dev.tech.svg/browse_thread/thread/75f14ac7244b0fa5/a6ccf7261c5110b7?lnk=raot |url-status=live }}</ref> However, SVG images may be included in XHTML pages using [[XML namespace]]s.<ref>{{cite web |url=https://developer.mozilla.org/en/SVG_In_HTML_Introduction |title=SVG In HTML Introduction |publisher=[[Mozilla]] |date=25 August 2008 |work=Mozilla Developer Center |author=((Brettz9)) |access-date=25 February 2010 |archive-date=5 December 2008 |archive-url=https://web.archive.org/web/20081205022530/https://developer.mozilla.org/en/SVG_In_HTML_Introduction |url-status=dead}}</ref>

[[Tim Berners-Lee]], the inventor of the [[World Wide Web]], was critical of early versions of Internet Explorer for its failure to support SVG.<ref>{{cite news |url=https://www.nbcnews.com/id/wbna26646919 |title=Creator of Web spots a flaw in Internet Explorer |agency=Associated Press |date=10 September 2008 |first=Peter |last=Svensson |access-date=25 February 2010 |publisher=[[NBC News]] |archive-date=9 November 2013 |archive-url=https://web.archive.org/web/20131109083320/http://www.nbcnews.com/id/26646919/ |url-status=live }}</ref>
* [[Opera (web browser)|Opera]] (since 8.0) has support for the SVG 1.1 Tiny specification, while Opera 9 includes SVG 1.1 Basic support and some of SVG 1.1 Full. Opera 9.5 has partial SVG Tiny 1.2 support. It also supports SVGZ (compressed SVG).
* Browsers based on the [[Gecko (software)|Gecko]] [[Browser engine|layout engine]] (such as [[Firefox]], [[Flock (web browser)|Flock]], [[Camino (web browser)|Camino]], and [[SeaMonkey]]) all have had incomplete support for the SVG 1.1 Full specification since 2005. The Mozilla site has an overview of the modules which are supported in Firefox<ref>{{cite web |url=https://developer.mozilla.org/en/docs/SVG_in_Firefox |title=SVG in Firefox |work=Mozilla Developer Center |publisher=[[Mozilla]] |date=23 October 2009 |access-date=25 February 2010 |archive-date=23 June 2008 |archive-url=https://web.archive.org/web/20080623225744/http://developer.mozilla.org/en/docs/SVG_in_Firefox |url-status=dead }}</ref> and of the modules which are <!-- This phrase is confusing. Does it mean what modules are in development or or which are not implemented at all? -->in development.<ref>{{cite web |url=https://www.mozilla.org/projects/svg/status.html |title=Mozilla SVG Status |publisher=[[Mozilla]] |access-date=25 February 2010 |archive-date=5 March 2010 |archive-url=https://web.archive.org/web/20100305220410/http://www.mozilla.org/projects/svg/status.html |url-status=live }}</ref> Gecko 1.9, included in [[Mozilla Firefox 3|Firefox 3.0]], adds support for more of the SVG specification (including filters).<ref>{{cite web |url=https://developer.mozilla.org/en/docs/SVG_improvements_in_Firefox_3 |title=SVG improvements in Firefox 3 |publisher=[[Mozilla]] |work=Mozilla Developer Center |date=15 January 2008 |author=Mgjbot |access-date=25 February 2010 |archive-date=9 February 2014 |archive-url=https://web.archive.org/web/20140209072611/https://developer.mozilla.org/en/docs/SVG_improvements_in_Firefox_3 |url-status=live }}</ref>
* [[Pale Moon (web browser)|Pale Moon]], which uses the [[Goanna (software)|Goanna]] layout engine (a fork of the [[Gecko (software)|Gecko]] engine), supports SVG.
* Browsers based on [[WebKit]] (such as [[Apple Inc.|Apple]]'s [[Safari (web browser)|Safari]], [[Google Chrome]], and [[The Omni Group]]'s [[OmniWeb]]) have had incomplete support for the SVG 1.1 Full specification since 2006.<ref>{{cite web |url=http://webkit.org/projects/svg/status.xml |title=WebKit SVG Status |publisher=[[WebKit]] |date=5 January 2010 |access-date=25 February 2010 |archive-date=10 February 2010 |archive-url=https://web.archive.org/web/20100210024246/http://webkit.org/projects/svg/status.xml |url-status=live }}</ref>
* [[Amaya (web browser)|Amaya]] has partial SVG support.
* [[Internet Explorer 8]] and older versions do not support SVG.<ref>{{cite web |url=http://www.microsoft.com/windowsxp/expertzone/chats/transcripts/08_0619_ez_ie8.mspx |title=Windows Internet Explorer 8 Expert Zone Chat (19 June 2008) |publisher=Microsoft |date=19 June 2008 |access-date=24 October 2010 |archive-date=17 March 2010 |archive-url=https://web.archive.org/web/20100317095519/http://www.microsoft.com/windowsxp/expertzone/chats/transcripts/08_0619_ez_ie8.mspx |url-status=live }}</ref><ref>{{cite web |url=http://www.codedread.com/svg-support.php |title=SVG Support |last=Schiller |first=Jeff |date=13 February 2010 |access-date=25 February 2010 |archive-date=16 February 2009 |archive-url=https://web.archive.org/web/20090216041528/http://www.codedread.com/svg-support.php |url-status=live }}</ref> IE9 (released 14 March 2011) supports the basic SVG feature set.<ref name="IE9">{{cite web |url=http://msdn.microsoft.com/en-us/library/ff974378(VS.85).aspx |title=What's New in Internet Explorer 9 |date=22 March 2011 |work=[[Microsoft Developer Network]] |publisher=[[Microsoft]] |access-date=22 March 2011 |archive-date=5 April 2011 |archive-url=https://web.archive.org/web/20110405103423/http://msdn.microsoft.com/en-us/library/ff974378(VS.85).aspx |url-status=live }}</ref> IE10 extended SVG support by adding SVG 1.1 filters.<ref>{{cite web |title=SVG (Windows) |url=https://msdn.microsoft.com/en-us/library/ie/hh673562(v=vs.85).aspx |website=Internet Explorer Dev Center |publisher=[[Microsoft]] |access-date=27 August 2014 |archive-date=20 March 2014 |archive-url=https://web.archive.org/web/20140320183804/http://msdn.microsoft.com/en-us/library/ie/hh673562(v=vs.85).aspx |url-status=live }}</ref>
* [[Microsoft Edge Legacy]] supports <!-- How much does it support? Basic, tiny, or full? 1.1? --> SVG 1.1.<ref>{{cite web |url=https://developer.microsoft.com/en-us/microsoft-edge/platform/status/ |title=Microsoft Edge web platform features status and roadmap - Microsoft Edge Development |website=developer.microsoft.com |access-date=19 April 2018 |archive-date=15 April 2018 |archive-url=https://web.archive.org/web/20180415170845/https://developer.microsoft.com/en-us/microsoft-edge/platform/status/ |url-status=live }}</ref>
* The [[Maxthon|Maxthon Cloud Browser]] also supports SVG.{{citation needed|reason=Not mentioned on the Maxthon page|date=March 2015}}

There are several advantages to native and full support: [[Plug-in (computing)|plugins]] are not needed, SVG can be freely mixed with other content in a single document, and rendering and scripting become considerably more reliable.<ref>{{cite web |url=https://msdn.microsoft.com/en-us/library/ie/hh968248.aspx |publisher=[[Microsoft Developer Network|MSDN]] |title=Get ready for plug-in free browsing |year=2014 |access-date=2014-03-05 |archive-date=31 December 2014 |archive-url=https://web.archive.org/web/20141231082113/http://msdn.microsoft.com/en-us/library/ie/hh968248.aspx |url-status=live }}</ref>

=== Mobile devices ===

Support for SVG may be limited to SVGT on older or more limited [[Smart Phone|smart phones]] or may be primarily limited by their respective operating system. [[Adobe Flash Lite]] has optionally supported SVG Tiny since version 1.1. At the SVG Open 2005 conference, [[Sun Microsystems|Sun]] demonstrated a mobile implementation of SVG Tiny 1.1 for the [[Connected Limited Device Configuration]] (CLDC) platform.<ref>{{cite web |title=SVG Open 2005 Conference and Exhibition - Proceedings - Cartoon Oriented User Interfaces |url=http://www.svgopen.org/2005/proceedings.html#paper108 |publisher=svgopen.org |access-date=29 August 2010 |archive-date=3 December 2010 |archive-url=https://web.archive.org/web/20101203234229/http://www.svgopen.org/2005/proceedings.html#paper108 |url-status=live }}</ref>

Mobiles that use [[Opera Mobile]], as well as the [[iPhone]]'s built in browser, also include SVG support. However, even though it used the [[WebKit]] engine, the [[Android (operating system)|Android]] built-in browser did not support SVG prior to v3.0 (Honeycomb).<ref>{{cite web |title=Browser doesn't render SVG images |url=https://code.google.com/p/android/issues/detail?id=1376 |access-date=1 January 2011 |archive-date=20 May 2011 |archive-url=https://web.archive.org/web/20110520231037/http://code.google.com/p/android/issues/detail?id=1376 |url-status=live }}</ref> Prior to v3.0, Firefox Mobile 4.0b2 (beta) for Android was the first browser running under Android to support SVG by default.<ref>{{cite web |title=Firefox Mobile 4.0b2 (beta) for Android supports SVG images |url=https://code.google.com/p/android/issues/detail?id=1376#c30 |date=2010-12-16 |work=[[Android (operating system)|Android]] Issue 1376 |access-date=2014-01-29 |archive-date=21 August 2014 |archive-url=https://web.archive.org/web/20140821133935/https://code.google.com/p/android/issues/detail?id=1376#c30 |url-status=live }}</ref>

The level of SVG Tiny support available varies from mobile to mobile, depending on the SVG engine installed. Many newer mobile products support additional features beyond SVG Tiny 1.1, like gradient and opacity; this is sometimes referred to as "SVGT 1.1+", though there is no such standard.

[[Research In Motion|RIM]]'s [[BlackBerry]] has built-in support for SVG Tiny 1.1 since version 5.0.<ref>{{cite web |title=Support for SVG |url=http://docs.blackberry.com/en/developers/deliverables/11844/Native_SVG_support_887737_11.jsp |publisher=RIM |access-date=6 October 2011 |archive-date=10 October 2011 |archive-url=https://web.archive.org/web/20111010104311/http://docs.blackberry.com/en/developers/deliverables/11844/Native_SVG_support_887737_11.jsp |url-status=dead }}</ref> Support continues for WebKit-based BlackBerry Torch browser in OS 6 and 7.<ref>{{cite web |title=BlackBerry Torch The HTML5 Developer Scorecard |url=http://www.sencha.com/blog/blackberry-torch-the-html5-developer-scorecard |publisher=[[Sencha]] |access-date=6 October 2011 |archive-date=5 March 2014 |archive-url=https://web.archive.org/web/20140305165051/http://www.sencha.com/blog/blackberry-torch-the-html5-developer-scorecard |url-status=live }}</ref>

[[Nokia]]'s [[S60 platform]] has built-in support for SVG. For example, icons are generally rendered using the platform's SVG engine. Nokia has also led the JSR 226: Scalable 2D Vector Graphics [[Application programming interface|API]] expert group that defines [[Java Platform, Micro Edition|Java ME]] API for SVG presentation and manipulation. This API has been implemented in S60 Platform 3rd Edition Feature Pack 1 and onward.<ref>{{cite web |url=http://www.s60.com/business/productinfo/applicationsandtechnologies/java/supportedfeaturesin3rdedition |title=S60 Product info |archive-url=https://web.archive.org/web/20071013152026/http://www.s60.com/business/productinfo/applicationsandtechnologies/java/supportedfeaturesin3rdedition |archive-date=13 October 2007 |publisher=S60.com |access-date=19 October 2009}}</ref> Some [[Series 40 (software platform)|Series 40 phones]] also support SVG (such as [[Nokia 6280]]).{{fact|date=February 2023}}

Most [[Sony Ericsson]] phones beginning with [[Sony Ericsson K700|K700]] (by release date) support SVG Tiny 1.1. Phones beginning with [[K750]] also support such features as opacity and gradients. Phones with [[Sony Ericsson Java Platform|Sony Ericsson Java Platform-8]] have support for JSR 226.{{fact|date=February 2023}}

[[Windows Phone]] has supported SVG since version 7.5.

SVG is also supported on various mobile devices from [[Motorola]], [[Samsung]], [[LG]], and [[Siemens mobile]]/[[BenQ-Siemens]]. eSVG, an SVG rendering library mainly written for [[Embedded system|embedded]] devices, is available on some mobile platforms.<ref>{{Cite web |url=http://www.svgopen.org/2002/papers/jezic__esvg/ |access-date=5 April 2012 |title=SVG for Embedded Systems |first=Damir |last=Jezic |date=15–17 July 2002 |publisher=svgopen.org |work=Zurich 2002 |archive-date=16 March 2012 |archive-url=https://web.archive.org/web/20120316022700/http://www.svgopen.org/2002/papers/jezic__esvg/ |url-status=live }}</ref><ref>{{cite web |url=http://www.intesis.hr/products/esvg |title=eSVG |work=Intesis Intelligent Embedded Software |year=2010 |access-date=2014-01-29 |archive-date=3 March 2012 |archive-url=https://web.archive.org/web/20120303142911/http://www.intesis.hr/products/esvg |url-status=live }}</ref>

=== Authoring ===
[[File:20241229 Using concatenate function in spreadsheet to create SVG code - demo.svg |thumb |upright=1.25 |In addition to manually entering code and using vector graphics editors, users can use spreadsheet programs' [[concatenate]] function to join numeric cell values and text strings in series, to generate full SVG declarations.]]
SVG images can be hand coded or produced by the use of a vector graphics editor, such as [[Inkscape]], [[Adobe Illustrator]], [[Adobe Animate]], or [[CorelDRAW]], and rendered to common [[Raster graphics|raster]] image formats such as [[PNG]] using the same software. Additionally, editors like [[Inkscape]] and [[Boxy SVG]] provide tools to trace raster images to [[Bézier curve]]s typically using [[image tracing]] back-ends like [[potrace]],<ref name="selinger">{{cite web |url=http://potrace.sourceforge.net/ |last=Selinger |first=Peter |year=2001–2013 |title=Potrace – Transforming bitmaps into vector graphics |work=[[SourceForge]] project [[Potrace]] |access-date=2014-01-29 |archive-date=9 September 2009 |archive-url=https://web.archive.org/web/20090909215555/http://potrace.sourceforge.net/ |url-status=live }}</ref> autotrace, and imagetracerjs.

Software can be programmed to render SVG images by using a [[library (computing)|library]] such as [[librsvg]] used by [[GNOME]] since 2000, [[Batik (software)|Batik]] and ThorVG (Thor Vector Graphics) since 2020 for lightweight systems. SVG images can also be rendered to any desired popular image format by using [[ImageMagick]], a free command-line utility (which also uses librsvg under the hood).

For web-based applications, the mode of usage termed Inline SVG allows SVG content to be embedded within an HTML document using an <code>&lt;svg&gt;</code> tag. Its graphical capabilities can then be employed to create sophisticated user interfaces as the SVG and HTML share context, event handling, and CSS.

Other uses for SVG include embedding for use in [[word processing]] (e.g. with [[LibreOffice]]) and [[desktop publishing]] (e.g. [[Scribus]]), [[Plot (graphics)|plotting graphs]] (e.g. [[gnuplot]]), and importing paths (e.g. for use in [[GIMP]] or [[Blender (software)|Blender]]). The application services [[Microsoft 365]] and [[Microsoft Office 2019]] offer support for exporting,<ref>{{Cite web |date=September 2019 |title=What's new in PowerPoint for Microsoft 365 |url=https://support.microsoft.com/en-us/office/what-s-new-in-powerpoint-for-microsoft-365-e8ef980c-5b12-4fff-ae3f-0819e6a21a1f |url-status=live |archive-url=https://web.archive.org/web/20210313183903/https://support.microsoft.com/en-us/office/what-s-new-in-powerpoint-for-microsoft-365-e8ef980c-5b12-4fff-ae3f-0819e6a21a1f |archive-date=2021-03-13 |access-date=2021-04-17 |website=support.microsoft.com |language=en-US}}</ref> importing and editing SVG images. The [[Uniform Type Identifier]] for SVG used by Apple is <code>public.svg-image</code> and conforms to <code>public.image</code> and <code>public.xml</code>.