Wikipedia:SVG help/Archive 10

SVG text rendering, again – image displays differently in two en.WP articles!

 * 1) Red arrows show simultaneous inconsistent renderings between two articles of File:20220823 Public underestimation of public support for climate action - poll - false social reality.svg
 * 2) Separately: Blue notation arrows show consistently incorrect renderings between two articles of File:20220629 Public estimates of scientific consensus on climate change - horizontal bar chart.svg, even after removing font-weight="bold" specification once thought to have caused the rendering problem
 * 3) Anomaly may be related to anomaly found in earlier versions of File:200012 Suicide methods in order of lethality - variable-width bar chart.svg, which was discussed at Wikipedia:SVG help/Archive 9 at en.WP

At the present moment, sometimes the files display correctly for me on Commons but still not on en.WP. — RCraig09 (talk) 19:12, 29 May 2023 (UTC)

I've resolved to avoid use of italics and bold text, but... even that doesn't seem to avoid the problem(s).

Is there a central place to report such bugs? — RCraig09 (talk) 19:12, 29 May 2023 (UTC)


 * Did you try c:Help:Purge ?
 * Wikimedia Bugs can be repoted at maniphest/task/edit/form/43/
 * — Johannes  Kalliauer  - contrib. 04:12, 30 May 2023 (UTC)
 * Many times I've tried Shift-Reload (Chrome for Mac), and I just tried  as you suggested. The problem remains—same on my iPhone's Safari browser.
 * Are you (or any other readers) seeing the anomalies also? (below and on the en.Wikipedia pages:)
 * Climate change in the United States
 * Public opinion on climate change
 * It's not just my one device. Thanks for any feedback. — RCraig09 (talk) 04:58, 30 May 2023 (UTC)
 * In File:20220629 Public estimates of scientific consensus on climate change - horizontal bar chart.svg I think I've found a work-around: avoid  specifications. Part of the code change is shown below:
 * The changes to Version 7 appear to avoid the problem—in the first file. — RCraig09 (talk) 17:13, 30 May 2023 (UTC)
 * However, there is no  specification in the second file, File:20220823 Public underestimation of public support for climate action - poll - false social reality.svg.
 * So I still don't know a solution. — RCraig09 (talk) 17:26, 30 May 2023 (UTC)
 * Update: For Version 3, I made  explicit in each   specification (not just inherited from group  ), and that seems to have avoided the problem in the only article that was having a problem before (Climate change in the United States).
 * Problem avoided; bug not solved. — RCraig09 (talk) 17:58, 30 May 2023 (UTC)
 * Bug report filed at T340379 — RCraig09 (talk) 05:55, 25 June 2023 (UTC)
 * However, there is no  specification in the second file, File:20220823 Public underestimation of public support for climate action - poll - false social reality.svg.
 * So I still don't know a solution. — RCraig09 (talk) 17:26, 30 May 2023 (UTC)
 * Update: For Version 3, I made  explicit in each   specification (not just inherited from group  ), and that seems to have avoided the problem in the only article that was having a problem before (Climate change in the United States).
 * Problem avoided; bug not solved. — RCraig09 (talk) 17:58, 30 May 2023 (UTC)
 * Bug report filed at T340379 — RCraig09 (talk) 05:55, 25 June 2023 (UTC)
 * Problem avoided; bug not solved. — RCraig09 (talk) 17:58, 30 May 2023 (UTC)
 * Bug report filed at T340379 — RCraig09 (talk) 05:55, 25 June 2023 (UTC)

Supplemental (8 July 2023):
 * Example of avoiding the problem: eliminate use of  as follows:
 * Old (BAD RENDERING):
 * New (CORRECT RENDERING):
 * New (CORRECT RENDERING):

According to User:JoKalliauer at Commons, a new version of librsvg renders incorrectly, though an old librsvg-version did not contain this bug. — RCraig09 (talk) 19:23, 11 July 2023 (UTC)

Update: Additional discussion is at Talk:Librsvg_bugs#SVG_text_rendering:_probable_bug, in which Glrx says "One failure mechanism is librsvg 2.44.10 does not calculate the width of an SVG "text chunk" correctly. Instead of the whole width, it is using the width of the last constituent." This would explain how some text is not positioned properly. — RCraig09 (talk) 17:37, 16 July 2023 (UTC)

PS, FYI: I just changed Version 2 of File:2021 C02 emissions by income decile - International Energy Agency IEA.svg by removing a  specification within the last of three   specifications. Version 3 renders closer to being correct. — RCraig09 (talk) 19:13, 20 July 2023 (UTC)
 * If the issue is "Income: highest 10%", how about just setting text-anchor="start" and aligning it manually? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 09:48, 21 July 2023 (UTC)
 * The three grouped lines of text should be centered about the same vertical centerline. Using  would not bring exact results in English (differences between different rendering software), and would likely be way off if translated into some foreign languages. We can only hope to adapt our code to existing bug(s), until the SVG text rendering problems are resolved. — RCraig09 (talk) 12:34, 21 July 2023 (UTC)

PPS: In Version 11 of File:20211109 Frequency of extreme weather for different degrees of global warming - bar chart IPCC AR6 WG1 SPM.svg, the following code caused the title to be rendered to the right of center. I solved the problem by removing the  for Version 12.

Interestingly, my adding hard returns to form Version 11 may have caused the problem, since Version 10 rendered correctly. Or maybe I shouldn't have removed the that was between the two text declarations. The SVG Translate Tool introduces  elements that can (apparently) cause problems if you subsequently change things (add hard returns) in their vicinity. — RCraig09 (talk) 02:34, 30 July 2023 (UTC)

Update: see — RCraig09 (talk) 22:02, 16 July 2023 (UTC)
 * https://phabricator.wikimedia.org/T97233 (April 2015)
 * https://phabricator.wikimedia.org/T340379 (June 2023)

Is it possible to put something in the SVG code to block font substitutions?
and others. Is it possible to put something in the SVG code to block font substitutions? I think it would solve a lot of problems. Some SVG image designers want to use the latest fonts for various reasons. They may not want the boring generic free fonts used except on Wikipedia and other wikis. So they are leery of putting the free fonts first in the font family list.

So the Wikipedia user agent would go down the font family list until it hits the free fonts at the end (such as Liberation Sans). Since there would be no font substitutions allowed. Is this possible?

There would always be an available font wherever the SVG image is posted as long as the last thing listed in the font-family list is sans-serif. --Timeshifter (talk) 20:19, 18 July 2023 (UTC)


 * I think it's not possible, except by converting the text to paths (which no longer allows it to be edited). What would you expect to happen if the font is unavailable on the reader's computer if the font substitution is disallowed? No text at all or little rectangles?
 * If only one font is listed in font-family and is unavailable, it defaults to Liberation Serif in the thumbnail, and the browser's default font when viewed directly. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 04:33, 19 July 2023 (UTC)
 * . sans-serif would always be available if all the other fonts were unavailable. I guess if this idea is not possible now, maybe Wikimedia developers could create something that could be added to SVG code to block font substitution (except for sans-serif). --Timeshifter (talk) 06:26, 19 July 2023 (UTC)
 * Then why not just list the font you want then sans-serif, so it uses sans-serif if your font is unavailable? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 08:57, 19 July 2023 (UTC)
 * That is basically what OWID is doing. A font for each operating system: Mac (e.g. Helvetica), Windows (e.g. Arial), Linux and Wikimedia (e.g. Liberation Sans), and sans-serif. I don't know what Lato is for.
 * Problem is that it all depends on the font substitutions. It must have changed. --Timeshifter (talk) 09:34, 19 July 2023 (UTC)
 * I added Liberation Sans to my font-family list in c:file:most_perfect_magic_square_construction.svg and still get
 * Warning* You appear to have specified a font that does not exist on Wikimedia wikis.
 * on http://svgcheck.toolforge.org/index.php due to the presence of Helvetica and Arial; removing them makes the warning disappear. As Helvetica and Arial are needed for Mac and Windows, I think we need to live with the warning. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 00:33, 24 July 2023 (UTC)

. I don't think I am getting any warnings here for that SVG image: c:Commons:Commons SVG Checker. But it is not rendering the image. Though, I don't think it ever renders the image of files I have tested there. Could you check the file there? I don't think it is able to read your font-family list for that file. It is in a different format from the font-family list in your US map template:  When I run your template SVG map through it I see a detailed breakdown of the fonts. Template:
 * Commons: File:Template map of U.S. states and District of Columbia.svg

SVG_help says it is good practice to list fonts for Windows, Mac, Linux, etc.. --Timeshifter (talk) 03:05, 24 July 2023 (UTC)


 * Commons SVG Checker has been broken for months and shows a cartoon insect, so I currently use https://svgcheck.toolforge.org/index.php though it ignores font settings. Is there a reason to specify Nimbus Sans L? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 18:45, 24 July 2023 (UTC)
 * . c:Commons:Commons SVG Checker seems to be working fine for me. Except for showing the image. See the previous section. It has info about Nimbus Sans L problem. Here is what I get when I run your SVG map template through Commons SVG Checker:
 * {| class=wikitable


 * + Results
 * File size is: 47878 bytes

Successfully parsed XML structure.

HINT in : Font type Arial is not available in Wikimedia software. It has been substituted with a metric equivalent. It will be rendered with minor differences by Wikimedia's SVG renderer. See https://commons.wikimedia.org/wiki/Help:SVG#fallback for details.

WARNING in : Font type Helvetica is not available in Wikimedia software. It will be rendered with minor differences by Wikimedia's SVG renderer. See https://meta.wikimedia.org/wiki/SVG_fonts for details.
 * }
 * --Timeshifter (talk) 21:57, 24 July 2023 (UTC)
 * This is expected. Note that they are hints or warnings and not errors. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 19:17, 27 July 2023 (UTC)

. How come I don't get those hints about the same fonts when I run this image through the same file checker?: That image has those same fonts listed in the font-family list. --Timeshifter (talk) 21:29, 27 July 2023 (UTC)
 * c:File:Most perfect magic square construction.svg
 * As far as I know, fonts can be specified in several ways:
 * font-family="Liberation Sans,Arial,Helvetica,sans-serif" attribute in an SVG tag
 * style="font-family:'Liberation Sans',Helvetica,Arial,sans-serif;" attribute in an SVG tag
 * <tt>.main { font-family:'Liberation Sans',Helvetica,Arial,sans-serif; }</tt> in a <tt>style</tt> tag
 * <tt>.main { font-family:'Liberation Sans',Helvetica,Arial,sans-serif; }</tt> in an external style sheet
 * (I tend to use the first and third methods). It seems the tool evaluates the first method's list but ignores the others'.
 * Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 21:46, 27 July 2023 (UTC)
 * Those four, plus another four which are the same except that  is replaced by   - this shorthand is part of both [//www.w3.org/TR/SVG11/text.html#FontProperty SVG 1.1] and [//www.w3.org/TR/CSS1/#font CSS 1.0]. -- Red rose64 &#x1f339; (talk) 21:19, 28 July 2023 (UTC)
 * Thanks, didn't realise one could do that. Is <tt>font-family</tt> or <tt>font</tt> recommended? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 01:47, 29 July 2023 (UTC)
 * Neither, and both. There are pros and cons to using shorthand properties. For instance, they allow one or more property values to be specified in the same declaration, thus saving space. So you can write e.g.  and that would be equivalent to  . However, there is a catch: if you use both together, e.g. , the font family specified by   will be overridden by the one specified by   - it's as if you had written  . More at [//www.w3.org/TR/SVG11/text.html#FontProperty SVG 1.1 spec] and [//www.w3.org/TR/CSS21/fonts.html#font-shorthand CSS 2.1 spec]. CSS provides several shorthand properties (such as  ,  ,  ,   and so on), whereas SVG provides just two - the other is  . -- Red rose64 &#x1f339; (talk) 23:19, 29 July 2023 (UTC)
 * Superb explanation. I've learnt something new today! Thanks, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 12:58, 31 July 2023 (UTC)

File size is too big and thumbnail in File:Test.svg shows my map with a black color
Hi everyone, I wanted to reach out to ask for help on an svg map I am trying to upload to Commons. It is a map I made using Inkscape about different proposed subdivisions of my country, Bolivia. The problem I am having is when I use the Commons:Commons SVG Checker, it says "Successfully parsed XML structure" but also "Omited rendering of SVG because the file size limit has been reached", so I can't preview how well the SVG file I want to upload will look. The file size is approximately 8,000,000 bytes, so I think I have to first make the file size smaller in order to upload it to Commons, but I really don't know how. I based my map on the map that is already uploaded to Commons and has a similar size to the one I am trying to upload, which confuses me a little. In summary, is the size of the file the problem? If so, how can I fix it?

It is my first time uploading an SVG file, so I'm sort of lost here. Thank you in advance for your time and help. Ruditaly  (Talk) 15:01, 18 July 2023 (UTC)


 * 8 MB shouldn't be a problem; we have much larger SVG files. Try uploading it to https://svgcheck.toolforge.org/index.php to see if it works or reports any errors. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:50, 18 July 2023 (UTC)
 * Yes, c:COM:MAXSIZE suggests that much larger files may be uploaded. However, earlier today there was a problem with some servers (see Village pump (technical)), and this certainly affected the display of some images, so it may also have affected uploads. -- Red rose64 &#x1f339; (talk) 15:52, 18 July 2023 (UTC)
 * @CmgleeThank you for your answer. For some reason when I click on "Check this SVG" after having selected my svg map, it starts loading as I think it normally would and then it finishes loading but goes back to the original site, meaning it doesn't show any information or report, but rather it removes the svg file that was selected when clicking on Browse. I'm thinking if maybe the text font in the map is the problem, since it does contain a couple of word written in the font "sans-serif". Do you think this may be the problem? Thanks again in advance for your kind help. Ruditaly Flag of Bolivia.svg (Talk) 10:02, 10 August 2023 (UTC)
 * I also return to the https://svgcheck.toolforge.org page after a few seconds without any error message when I upload your File:Test.svg. It could be too complex and the tool crashed.
 * In Inkscape 1.2.2, I saved it as Plain SVG and the file size did not decrease, so presume it's already plain. I then tried Optimized SVG. The file decreased to 8050 KB and now looks different in a browser. On SVG Check, I got an error "That file doesn't appear to be an SVG file." I'm afraid I don't know how to fix the problem and can only suggest reducing the complexity of the paths (I note that there are no embedded images). cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 13:21, 10 August 2023 (UTC)
 * P.S. In your original File:Test.svg, I replaced all d=".*?" with d="M0,0V99H99" and the file rendered. rsvg could simply have run out of memory. It seems 1079 paths' d attributes accounted for 9319754 bytes: over 8 KB per path. Could they be simplified? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 13:28, 10 August 2023 (UTC)
 * P.P.S. Inkscape's Path &gt; Simplify shrunk the file to 823 KB and SVG Check passes, but the shapes no longer abut. I'll leave it to someone to propose a better decimation tool. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 13:33, 10 August 2023 (UTC)
 * @CmgleeThanks again for your help. What is rsvg? You probably saw it on File:Test.svg that I removed the letters and words from the svg file. However, it did not help with rendering the colors and the map still appears all black on Wikicommons. It is really weird and can't understand why that might be. The size is already within the limits and there are no words or fonts that may cause problems. Ruditaly Flag of Bolivia.svg (Talk) 14:01, 10 August 2023 (UTC)
 * rsvg is the software that converts the SVG filter into the PNG thumbnails shown on articles etc.
 * I didn't investigate why it appears black and can suggest removing most of the paths to see if the colours return. If so, add them back to see when it stops working. rsvg might have run out of memory as it did with File:Apollonian gasket symmetrical 3.svg. Good luck! cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:07, 10 August 2023 (UTC)

Need to add state names or abbreviations to this US map
See: Commons:File talk:ACA Medicaid expansion.svg
 * Commons:File:ACA Medicaid expansion.svg

Can someone make that SVG map with state names or abbreviations? --Timeshifter (talk) 00:52, 19 August 2023 (UTC)


 * ✅ In the future, you may get more help by asking on Graphics_Lab/Map_workshop – this page is more for SVG rendering bugs. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 17:20, 19 August 2023 (UTC)
 * Thanks ! I replied at Commons:File talk:ACA Medicaid expansion.svg. --Timeshifter (talk) 19:49, 19 August 2023 (UTC)

Why are long OWID SVG map captions being overlapped by logo again?

 * Note: I posted here and never got a response in over a week: Commons:Graphics village pump. I deleted my post there. --Timeshifter (talk) 12:54, 17 July 2023 (UTC)

I thought this was solved. See Feb-Mar 2023 thread:
 * Graphics Lab/Illustration workshop/Archive/Feb 2023

Our World in Data (OWID) maps are using the same font-family CSS from when the problem was first solved:

What has changed? How can the problem be fixed? See also: I see this list of substitutions: It is here: Commons:Help:SVG. Are fallback fonts with wide character spacing being substituted for fonts with narrower character spacing? DejaVu Sans has wider characters and/or spacing than the other Sans substitutions. Is it being substituted?
 * SVG_help
 * Commons:File:SVG Text Font Test.svg

Also, is there any reason OWID can't use regular quotes like this around the multi-word font names?:

Are the single quotes necessary at all? Are the commas enough to separate the font names?

See older confusing thread from Dec 2021:
 * Village pump (technical)/Archive 194

See some of the maps in question:
 * File:Daily new confirmed COVID-19 deaths per million people.svg
 * File:World map of total confirmed COVID-19 deaths per million people by country.svg
 * File:World map of COVID-19 vaccination doses administered per 100 people by country or territory.svg
 * File:Cumulative confirmed COVID-19 cases per million people, OWID.svg

They are all using the same font family list. --Timeshifter (talk) 12:54, 17 July 2023 (UTC)


 * http://stackoverflow.com/a/13752149 states
 * You can always put a specific font family name in quotes &hellip; Only the CSS-defined generic font family names like sans-serif must be written without quotes. &hellip; a font name consisting of space-separated names such as Times New Roman need not be quoted. However, the spec recommends “to quote font family names that contain white space, digits, or punctuation characters other than hyphens”
 * Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:15, 17 July 2023 (UTC)
 * Thanks . So since OWID fonts only have A-Z text in their names, then this would work fine on Wikipedia and elsewhere?:
 * The spec link is this:
 * https://www.w3.org/TR/2018/REC-css-fonts-3-20180920/#propdef-font-family
 * Can OWID's logo overlap problem on Wikimedia be solved by putting Liberation Sans first in that font-family list? --Timeshifter (talk) 08:18, 18 July 2023 (UTC)
 * Re "this would work fine", I think so. Re "OWID's logo", no idea. Give it a try! cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:48, 18 July 2023 (UTC)
 * Re "this would work fine", I think so. Re "OWID's logo", no idea. Give it a try! cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:48, 18 July 2023 (UTC)

. *c:Commons:Commons SVG Checker. When I run one of the problematic OWID files through it I get this message:
 * "WARNING: XML declaration not found and is strongly recommended"

How is that fixed? Can someone look at the SVG code for this file?:
 * File:World map of total confirmed COVID-19 deaths per million people by country.svg

When I run the SVG template map through it I get this:
 * "Nimbus Sans L is not available in Wikimedia software."

So I will remove it from the font-family list.

Removing "Nimbus Sans L" from a map upload to the Shoutwiki wiki solved a major problem there. It got rid of the little squares that were substituted for characters. So now the map SVG is: <g font-family="Liberation Sans,Arial,Helvetica,sans-serif" font-size="18" letter-spacing="-1px" text-anchor="middle" stroke-width="0.2" stroke-linejoin="round"> --Timeshifter (talk) 04:09, 24 July 2023 (UTC)
 * The XML declaration is the line  and it goes before the   (if one is present) or the } (if not). Some SVG processors tolerate its absence, but not all, so it's best included. Mentioned often in the SVG 1.1 spec (see e.g. chapter 5 Document Structure), it's not described there but at section 2.8 Prolog and Document Type Declaration of the XML spec.  -- Red rose64 &#x1f339; (talk) 20:39, 24 July 2023 (UTC)

and others. I ran this map through this validator: There was a long list of results. Here is a direct link.
 * File:World map of total confirmed COVID-19 deaths per million people by country.svg
 * https://validator.w3.org/#validate_by_uri

Does any of it make sense to you? What is important? I intend to contact the webmaster at OWID with what we have figured out so far. --Timeshifter (talk) 10:35, 27 July 2023 (UTC)


 * Aklapper at noted something major that we all missed. The title of the task is his after he changed it from my original title, "Change in SVG font substitution is messing up images", to the more specific "Font substitution for SVG file to PNG thumbnail replaces serif with sans-serif font".
 * The title (the very top line in the image) is supposed to be a serif font. It is that when rendered outside MediaWiki. But MediaWiki makes it into a sans-serif font.
 * I think MediaWiki is ignoring the SVG file's font-family lists for both serif and sans-serif fonts. And then substituting a wider sans-serif font such as DejaVu Sans. --Timeshifter (talk) 03:57, 20 August 2023 (UTC)
 * Regarding the "long list of results", the problem here is that you are attempting to validate the file description page, not the image that it relates to. Try this link instead, which returns one info entry and two errors.
 * As for the comment at T344564 about "ERROR in &lt;style&gt;: It will not be rendered properly by Wikimedia's SVG renderer. As workaround add attribute type="text/css" to &lt;style&gt;. See https://phabricator.wikimedia.org/T68672 for details.", this means that you should use everywhere that you have used a plain  tag. It's documented at c:Help:SVG as a known quirk of librsvg. -- Red rose64 &#x1f339; (talk) 11:01, 20 August 2023 (UTC)
 * Thanks again, . I put that info in T344564. I also added the results from https://validator.w3.org/#validate_by_upload for the latest map file (the one that can't be uploaded to the Commons).
 * ,, and others. It would be nice if someone who knew what they were doing could fix all the errors in that file and try uploading it again. I don't understand a lot of this stuff since I am not an SVG image creator. I have edited the user-editable parts of some SVG files created by cmglee. That's about it.
 * I am wondering if fixing all these errors fixes the main problem at T344564 of incorrect font substitution. If it does, we can contact the OWID webmaster and point out the problems and solutions. So that his SVG files work correctly on Wikipedia. --Timeshifter (talk) 20:00, 20 August 2023 (UTC)
 * Before anyone tries to "fix all the errors in that file", we should consider how the file was generated. If automatically by OWID software, someone should fix that instead. Otherwise, the next time another file or update is generated, one will have to go through the whole process again. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 22:15, 20 August 2023 (UTC)
 * The original Wikipedia fix described in the OWID Github thread happened after I contacted them. So if we figure out the problem we can point them to the solution, and let them fix the software. Contact:
 * https://ourworldindata.org/about#contact
 * OWID also makes available their free open-source software for others to use:
 * https://ourworldindata.org/owid-grapher
 * So we want that to be Wikimedia compatible too.
 * ,, and others. I sent an email to info@ourworldindata.org and pointed them to T344564. --Timeshifter (talk) 05:49, 23 August 2023 (UTC)

Missing circular arcs
The circular arcs in this SVG's thumbnail are not rendered. They were visible when I uploaded the file in 2020. Shift-refresh and action=purge didn't fix the issue. Can someone please check? Thanks, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 18:50, 21 August 2023 (UTC)


 * ✅ Seems to be working now. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 12:27, 23 August 2023 (UTC)

A mistake in a SVG File
Hello, there is a mistake in File:Al Nassr FC.svg, the originale Logo in the website team doesn't look like the same. look the file on the right. Can anyone check it? Thanks. File:Logo Al-Nassr.png-- أيوب (talk) 16:14, 29 August 2023 (UTC)
 * The original logo on the team website is https://siteapi.alnassr.sa/files/settings/2022-09/16/sVXvhuCPwi32RnUpf9k9ztz3dEMyW6LL.png and I don't see what the problem is with File:Al Nassr FC.svg. -- Red rose64 &#x1f339; (talk) 17:58, 29 August 2023 (UTC)
 * @Redrose64 first for reply, i hope you keep the file bcs SVG is better in logos,but the problem in SVG file is there up in the crown a yellow collor that doesn't exist in the original logo.-- أيوب (talk) 18:34, 29 August 2023 (UTC)
 * This extra yellow is the part from the tag to the next  tag and all of the  tags that they enclose, inclusive. If removed, the crown shows as a solid blue. -- Red rose64 &#x1f339; (talk) 22:33, 29 August 2023 (UTC)

File:Coat of arms of Urquhart of Urquhartt.svg
I uploaded File:Coat_of_arms_of_Urquhart_of_Urquhartt.svg to commons but the shading of the dogs does not display on page, it does however display if you click on image and then click again to zoom in, how can I correct this? I tried putting object to path, but this did not help. Yours ever, Czar Brodie~commonswiki (talk) 22:45, 4 September 2023 (UTC)


 * I haven't looked at the file, but when you're clicking "to zoom in", that means the SVG is being displayed directly in your browser without the involvement of Wikimedia software, while the other view is the SVG being rendered to raster by Wikimedia. AnonMoos (talk) 00:54, 5 September 2023 (UTC)
 * If I understand correctly the problem is with wikimedia. Is there a way round this? To correct the file so Wikimedia understands it? Czar Brodie~commonswiki (talk) 19:54, 6 September 2023 (UTC)
 * Wikimedia has nothing to do with it. AnonMoos is probably thinking of MediaWiki, but that also is not the culprit. The MediaWiki software serves the pages and images, but the image that is served is a PNG conversion from the SVG original, and the conversion is performed by librsvg. -- Red rose64 &#x1f339; (talk) 21:35, 7 September 2023 (UTC)
 * A little passive aggressive are we? I meant "the software running on Wikimedia sites", an allowable synecdoche.  The important thing is to distinguish when the SVG is being rendered in the user's own browser, and when it's being rendered by the site's software.  By the way, I looked at the SVG in one browser (not the most up to date) and it looked much the same as in the Wikimedia-served PNG... AnonMoos (talk) 10:17, 8 September 2023 (UTC)
 * problem solved, I redrew the dogs and manually filled in the colour variations without any fancy group shading. Yours ever, Czar Brodie~commonswiki (talk) 20:33, 16 September 2023 (UTC)

SVG logo rendering issue
This file File:Ele.me logo.svg is not rendered correctly on the page. Can someone help me fix it? Thanks. Larryasou (talk) 08:35, 21 September 2023 (UTC) cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 23:57, 21 September 2023 (UTC)
 * The fourth and fifth parameters (large arc and sweep flags) for the arc (a or A) command in the path tag must be delimited, e.g. by spaces or commas, to render correctly in rsvg. For instance,  must be replaced by   – see https://phabricator.wikimedia.org/T217990 for its Phabricator ticket.
 * Cheers,

SVG cropped out on Media Viewer
At File:Cricket, 2022 Asian Games.svg, which I extracted from pdf using Inkscape, why when viewing through Media Viewer the ball on the right look cropped out. It looks fine when clicking "Original file" at that file page. Hddty (talk) 13:54, 18 September 2023 (UTC)


 * When you click on "Original file", that means the SVG is displayed directly in your browser, not through Wikimedia (see section above). AnonMoos (talk) 19:28, 18 September 2023 (UTC)
 * How to fix this? Hddty (talk) 00:49, 19 September 2023 (UTC)
 * ✅, I updated the SVG's width to equal its height, and its <tt>viewBox</tt> accordingly to centre the image, as in the thumbnail. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 23:02, 20 September 2023 (UTC)
 * @Cmglee Thanks. Why is the PNG rendering of SVG not exact? And so to fix this problem, width and height should be equal? Hddty (talk) 09:34, 22 September 2023 (UTC)
 * Partly due to the Wikimedia thumbnail generator not exactly conforming to SVG specifications, partly that bits of the specification are not precise enough and are so open for interpretation.
 * I had no strong reason for making them equal. I just needed to make the image wider to account for the differences above. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 12:26, 22 September 2023 (UTC)

Text issues
I've created and there's been so many issues with the text in the file, and I don't understand what's going wrong as it's only some of the text, and in the text that the issues are affecting, it's not consistent. Please compare the SVG to the png file and I would love some help with what's causing all the text issues.

Geordannik (talk) 08:21, 15 October 2023 (UTC)
 * What issues, specifically? -- Red rose64 &#x1f339; (talk) 09:45, 15 October 2023 (UTC)
 * It seems much of the text is misaligned. I'd hesitate to blame it on https://phabricator.wikimedia.org/T217990 as it looks off on Firefox too, though it seems ok on Chrome.
 * I suggest fixing it on whatever editor you used to work on Firefox first. We can then discuss rsvg issues. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 20:34, 15 October 2023 (UTC)
 * I'll be honest @Cmglee, I manually coded the SVG using Visual Studio Code, I didn't use an editor at all. But I can also see the issues in firefox.
 * @Redrose64 A lot of text is completely misaligned and misplaced.
 * Geordannik (talk) 21:11, 15 October 2023 (UTC)
 * Well done! Few people code SVG manually (like both of us). Can you try moving <tt>text-anchor</tt> from <tt>tspan</tt> into their <tt>text</tt> tags? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 21:37, 15 October 2023 (UTC)
 * I'm confused because the main title "2022 Australian Senate Election" and the subtitle "40 of 76 seats up|39 for majority" are both almost identical except for position, bold and italic, and the subtitle is completely misaligned.
 * Geordannik (talk) 21:20, 15 October 2023 (UTC)
 * I've never come across this difference between browsers: In your code  Firefox first downscales the text and then places it at x="160" whereas Chrome places it at 160 halved i.e. 80. One may instead do   or similar. Does that help? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 21:44, 15 October 2023 (UTC)
 * Another suggestion - which I have found makes a difference in the past - is to eliminate unnecessary whitespace between the  of an opening text or tspan tag and the   of the matching closing tag. So for the last example above, you would use   I think that this is because the user agent needs to be clearly informed which character the   applies to - the figure 4, or the spaces and newlines preceding it. -- Red rose64 &#x1f339; (talk) 10:48, 17 October 2023 (UTC)

File description page defaults to en-simple though en language is present
CC Following this exchange, I've uploaded a version of with en systemLanguage. However, File:Generation_timeline.svg still defaults to en-simple, even after purging the cache and shift-refreshing my browser.

Can an expert please look into this?

Thanks, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 21:11, 24 October 2023 (UTC)

Bad text rendering
Hello, I have a problem with the rendering of an image I created about the Argentine presidential elections, it looks pretty bad. Actually the problem is with all the ones I have created that include text, the solution I give is to convert it into a shape but I would like to understand why it looks so bad since I want to leave the text like this. Also the SVG file seems to have a problem with the position of the text appearing out of place, I don't know if it is the way I export my work. I appreciate anyone who can help me. Goldsztern (talk) 03:40, 26 October 2023 (UTC)


 * Please see . Good luck! cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 00:01, 31 October 2023 (UTC)

fill-opacity on pattern fill has no effect
[[File:out_of_this_world_card_trick.svg|thumb|Explanation of the Out of This World card trick with a prepared deck of 10 cards (solid cards are face-up; hatched cards are of the hatch colour, face-down)

1. The top and bottom cards are extracted as marker cards.

2. The audience member freely deals cards onto either marker until stopped by the illusionist.

3. The illusionist reveals and puts the next two cards onto opposing piles.

4. The audience member freely deals the remaining cards; the piles may be of unequal size.

5. The illusionist extracts the second marker until the penultimate card on the incorrect pile, and the top card until the second marker on the correct pile, and reveals that the face-down cards match their markers.]] In this SVG, I have a group with id="card" containing a shape with a pattern fill. I wish to turn the pattern fill on and off with a CSS selector. When this group is used, if its class="up", the fill-opacity is set to 0.

As it works on Firefox and Chrome but not on rsvg, can someone please propose a simple solution or workaround?

Thanks cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 22:58, 16 November 2023 (UTC)
 * Instead of  try   that is, replace spaces with commas. -- Red rose64 &#x1f339; (talk) 23:17, 16 November 2023 (UTC)
 * Thanks, the problem persists even without the filter. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 09:54, 17 November 2023 (UTC)
 * ✅: I've worked around the bug using color and fill="currentColor". cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 22:45, 17 November 2023 (UTC)

Move right side of text box
See: File:World Population Prospects.svg

The right-most word "interval" in the text box is missing the last letter due to it being cut off by the right side of the box. That right side needs to be moved over a bit.

It is the same at the source page: --Timeshifter (talk) 22:11, 24 November 2023 (UTC)
 * https://population.un.org/wpp/Graphs/Probabilistic/POP/TOT/900


 * [[File:World_Population_Prospects.svg|thumb|none|

✅]]

Misaligned text
My file File:Butafenacil_synthesis.svg on Commons has the misaligned text problem mentioned above. I'm not competent to fix it. As you can see from the thumbnail, two of the F symbols in the first compound are moved right compared to the original. Please can someone apply one of the work-arounds. Mike Turnbull (talk) 16:01, 4 December 2023 (UTC)


 * As before, please see . As it's just two Fs in this case, I'll fix it for you. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 20:16, 4 December 2023 (UTC)
 * ✅ cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 20:29, 4 December 2023 (UTC)

Non-breaking spaces at the start of are ignored
Note: this is *NOT* the infamous recent text-alignment bug.

In this thumbnail, it can be seen that the text labels are left aligned. Some should be indented as in a tree as I prefixed their labels with &amp;#160;. This non-breaking space has effect when used elsewhere but it seems not here.

Is this a known rsvg bug?

Thanks, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 16:14, 11 December 2023 (UTC)


 * P.S. Curiously, the output of http://svgcheck.toolforge.org/index.php does indent them. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 16:23, 11 December 2023 (UTC)


 * I never heard of this bug before, maybe report it on https://gitlab.gnome.org/GNOME/librsvg/-/issues/ .  — <span style="font-family:Trendy, Tempus Sans Itc;">Johannes  Kalliauer  - contrib. 13:45, 25 December 2023 (UTC)
 * Thanks and welcome back online, to report the bug, what version, platform etc should I specify on the ticket? Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:06, 25 December 2023 (UTC)


 * FYI, I've worked around the bug by changing the  parameter instead of prefixing   in the second upload. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954;


 * Several thinks in my live changed: I worked a year at MIT, a university in Massachusetts, and now I recently switched to Bridge-Constrution (private Industry), back in Europe. I only checked Wikipedia/Commons, since I had some time. However I’m available upon request.
 * Since May this year Wikimedia is using librsvg 2.44, as described at librsvg_bugs.
 * Two years ago I knew all ~96 tasks in tag/wikimedia-svg-rendering. Reporting there is imho information for Users like us, but not for development, and the librsvg-version is always the one Wikimedia uses.
 * On https://gitlab.gnome.org/GNOME/librsvg/-/issues/ are thousends of bugs, I hardly know any of them. librsvg 2.44 is outdated (and unmaintained) since 2019, and afaik much development since then happend, so many bugs will be repaired in the current librsvg 2.56 version.  — <span style="font-family:Trendy, Tempus Sans Itc;">Johannes  Kalliauer  - contrib. 08:57, 27 December 2023 (UTC)
 * Thanks and congratulations on your placements, without installing librsvg, is there a way to test whether the bug exists on v2.56? If it doesn't, there doesn't seem much point reporting it. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 16:05, 28 December 2023 (UTC)


 * P.S. It also happens with non-breaking spaces at the end of a string using  as in this SVG. In this case, it's not possible to indent using   or   as the width of a character in monospace font is unknown. The workaround using dots is unsatisfactory as the artifacts are distracting. At least if the   alignment bug was absent, one could use a   with   or   but alas!

RFC on Commons re technical needs survey
I've just learned about a Technical needs survey at Wikimedia Commons. I'm not expert enough to articulate the ongoing SVG text rendering problem on WMedia projects, but I thought someone here might be able to use that forum to press for progress in that direction. — RCraig09 (talk) 05:55, 20 December 2023 (UTC)


 * Thanks for bringing it to attention. I've added commons:Commons:Requests_for_comment/Technical_needs_survey. Everyone please feel free to amend or add to it. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 05:55, 21 December 2023 (UTC)


 * Thanks, cmglee. I'm hoping for more graphists to comment there, to gather more attention to fix the bug or migrate to a text renderer that works properly. — RCraig09 (talk) 20:06, 29 December 2023 (UTC)

Text size
I have tried to get the text to be the same size in the thumbnail, as in my editing program, but I can't figure out how to do it. The file is. Silk interest (talk) 03:11, 1 January 2024 (UTC)
 * There are at least two issues here. First, the tag requires the   attribute, see c:Help:SVG; second, whilst the rule   is valid CSS, neither of these fonts are installed on our servers. See c:Help:SVG (also mentioned above). -- Red rose64 &#x1F98C; (talk) 13:28, 1 January 2024 (UTC)
 * Thanks it worked! Silk interest (talk) 16:05, 1 January 2024 (UTC)

not working?
Hello! I recently tried vectorizing the logo of Sunflower, a really cool tool by a really cool called, and I used  , and it seemed to work in my SVG viewer, but to my shock it doesn't render properly on Commons/Wikipedia.

Any suggestions? Quick Quokka [⁠talk • contribs] 19:20, 5 December 2023 (UTC)


 * I also tried doing it in a  tag and in a   property,. but to no avail.  Quick Quokka  [⁠talk • contribs] 19:22, 5 December 2023 (UTC)
 * is not a valid attribute for [//www.w3.org/TR/SVG11/shapes.html#EllipseElement the  element] in SVG 1.1, and I don't think that it's valid in SVG 2.0 either - where did you hear about it? -- Red rose64 &#x1f339; (talk) 20:23, 6 December 2023 (UTC)
 * Looking back on it I just assumed it would work from my knowledge of CSS, and in my SVG viewer/editor (Inkscape), it looked like it worked, but only when I uploaded it to here did I notice that it in fact, doesn't..
 * Is there a solution? Should I just make the intersections into a separate path? Quick Quokka  [⁠talk • contribs] 20:36, 6 December 2023 (UTC)
 * It appears that [//www.w3.org/TR/compositing-1/#mix-blend-mode the  property] is only described in [//www.w3.org/TR/compositing-1/ Compositing and Blending Level 1], which is a W3C Candidate Recommendation; as such, it is not yet a formal part of CSS. Even so, librsvg is very picky about CSS: you may only use those properties and values which are explicitly described either in SVG 1.1 or [//www.w3.org/TR/2018/SPSD-CSS1-20180913/ CSS Level 1]. Although the latter is officially superseded in its entirety by CSS 2.0, not all CSS 2.0 features are recognised by librsvg.
 * As a syntactical note, in, mix-blend-mode is an attribute to the ellipse tag; in , mix-blend-mode is a property within the style attribute. You need to use the latter form if something is defined in CSS Level 1 but not in SVG 1.1. -- Red rose64 &#x1f339; (talk) 21:06, 6 December 2023 (UTC)
 * As I said, I tried to add it in a style property and style tag, but it still didn't work.
 * Look at the file history. Quick Quokka  [⁠talk • contribs] 22:04, 6 December 2023 (UTC)
 * Please get the terminology correct. There is no such property as 'style'. If you have a contruct like, [//www.w3.org/TR/SVG11/styling.html#StyleAttribute style is an attribute]. If you have a contruct like <style ></style>, is an opening tag;  is a closing tag; and the pair together with the content that they enclose comprise [//www.w3.org/TR/SVG11/styling.html#StyleElement a style element].
 * Anyway, the image seems to have been deleted. -- Red rose64 &#x1f339; (talk) 23:17, 7 December 2023 (UTC)

cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 07:24, 8 December 2023 (UTC)
 * This thread made me vet an update to File:CMYK_screen_angles.svg claiming to use "multiply" blend mode by
 * Neither its thumbnail nor the SVG file viewed directly in Firefox (Chrome and Edge are fine) blend the dots correctly.
 * I'd thus advise not using this feature until it is more widely supported.
 * Cheers,


 * Worked around the issue by overlaying the shapes at  with another copy at  . cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 14:12, 2 January 2024 (UTC)

FYI: T341761 is related to this issue. — <span style="font-family:Trendy, Tempus Sans Itc;">Johannes  Kalliauer  - contrib. 13:40, 25 December 2023 (UTC)

Coastline map
Hi! I tried to emulate the coastline that most SVG maps in Wikipedia use, like in with my own map Zones de Tarragona Part Alta.svg. How I should do it? Thank you, KajenCAT (talk) 14:23, 8 January 2024 (UTC)


 * Do you mean replacing the thick grey lines adjacent to the sea (cyan) with thin blue ones? Locator SVG maps on Wikipedia usually have the land as one shape with its stroke appropriately set, and the borders as other shapes. If you instead have the regions as separate shapes, you could instead use SVG filter effects. See File:Risk_game_board.svg and File:Taipan_map.svg for examples. Good luck, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 16:34, 9 January 2024 (UTC)

Marker rendering
Hi all, long-time contributor back from a several-year hiatus. I tried uploading a diagram today here:. You can see over on MediaWiki that it took quite a few attempts to get it right! One issue I had is that for some reason none of the markers rendered, so I had to convert them to paths. I'm a bit surprised by this since prior diagrams of mine (e.g. ) have rendered markers no problem. It also seems like the warning above about markers is out of date as the bug appears to have been fixed: https://phabricator.wikimedia.org/T97758.

Anyway, my question here is: what should I do to make sure my markers render properly and I don't have to keep converting them to paths?

Thanks – ♫CheChe♫ talk 21:02, 11 January 2024 (UTC)

Here is a further example where some arrowheads rendered (but incorrectly) and other arrowheads did not render at all:. I'm pretty sure these issues aren't shown in the preview thumbnails when uploading to MediaWiki because I never see them until after upload. – ♫CheChe♫ talk 12:47, 12 January 2024 (UTC)


 * As described on http://stackoverflow.com/a/16665510,  and   are in the SVG 2 draft specification and are not supported in SVG 1.1. The simplest solution is to open the file in a text editor and replace   with the intended colour (  etc). Good luck! cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 14:40, 12 January 2024 (UTC)
 * P.S. Also note that the marker tags'  is SVG 2-draft. http://stackoverflow.com/a/69306932 explains how to make an SVG 1.1-compliant file. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:24, 12 January 2024 (UTC)
 * Thanks very much, I've give that a go! – ♫CheChe♫ talk 16:31, 12 January 2024 (UTC)
 * Also please note that the preview thumbnail is using your browser to render the SVG, the file hasn't hit our servers yet, so won't have been through librsvg. Therefore, it displays whatever your browser recognises regardless of whether librsvg can handle it or not. I have pointed out previously (see archives) that you need to restrict your SVG file to those elements, attributes and properties that are explicitly shown as valid in [//www.w3.org/TR/SVG11/ the SVG 1.1 spec] or [//www.w3.org/TR/2018/SPSD-CSS1-20180913/ the CSS 1.0 spec]. -- Red rose64 &#x1f339; (talk) 21:23, 12 January 2024 (UTC)

2023 AFC Asian Cup logo
Hi, The logo needs to be reduced and the text color adjusted As here. Thanks. -- أحمد 04 (talk) 00:21, 22 January 2024 (UTC)


 * This page is for help with bugs in Wikimedia's thumbnail generator. For help with general illustration requests, the illustration workshop. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 12:57, 22 January 2024 (UTC)
 * Sorry, Thanks. -- أحمد 04 (talk) 12:59, 22 January 2024 (UTC)

SVG image text selectability messed up by Wikipedia's image "preview"?
This is possibly a stupid question, but I'm not any kind of SVG guru as it relates to Wikipedia's SVG rendering.

I have an SVG I created with Draw.io and Inkscape that depicts the register architecture of the HP Saturn microprocessor here.

The problem is that Wikipedia's "preview" of the SVG results, in, I think, a scaled image being rendered which has *no selectable text.* Is there any way to get around this? If I click on the image "preview" and access my original SVG image ( [[Media:HP_Saturn_registers.svg|here]] ) and then zoom in then the text *is* selectable, but I want it to be selectable without the reader having to go through this multi-step process which the average reader probably wouldn't engage in.

On another note, I ran the SVG file through three SVG validators and each spewed out a bunch of arcane errors and I have no clue as to what they mean -- I'm a casual SVG creator, mainly using Inkscape, and I don't directly edit SVG XML.

I have to note that even the Wikipedia SVG "previews" of the SVG images in the Wikipedia article on SVG images don't have selectable text. So, it may not be due to the errors reported in my SVG.

There is the option of using a wikitable but IMO it's ugly.

Jdbtwo (talk) 15:56, 22 January 2024 (UTC)
 * Text is only selectable when viewing a true SVG file. When a SVG hosted either on Wikipedia or at Commons is displayed on a Wikipedia page, what you are seeing is a PNG rendition of thae original SVG. PNG files do not contain text.
 * Which SVG validators did you use? -- Red rose64 &#x1f339; (talk) 18:03, 22 January 2024 (UTC)
 * I thought that Wikipedia might be generating a bitmap preview. This seems, to me at least, to be a design flaw in the Wikipedia code. SVGs are by their very nature scalable, so, if Wikipedia is generating the scaled PNG image just for UX reasons, why not just scale the original SVG?
 * The ones suggested at the top of this page. Jdbtwo (talk) 15:21, 23 January 2024 (UTC)
 * The second one throws several instances of
 * ERROR in &lt;flowRoot&gt; with id=flowRoot3015: Flow element not supported. It will not be rendered properly by Wikimedia's SVG renderer. See https://phabricator.wikimedia.org/T43424 for details.
 * This is covered at flowRoot does not appear above. Basically: the <flowRoot ></flowRoot> element is not part of SVG 1.1, and so is not recognised by the librsvg utility, therefore, must not be used. -- Red rose64 &#x1f339; (talk) 20:40, 23 January 2024 (UTC)
 * I don't know if the culprit is Draw.io's "File->Export as->SVG..." or Inkscape. I think I suspect the former since Inkscape was designed to use SVGs from a very early stage.
 * I haven't seen the SVG in question having been rendered incorrectly on the mobile web or desktop web Wikipedia interface, but relatively recently the SVG which had previously been rendered correctly is not rendered correctly anymore on the iOS Wikipedia app -- it's rendered with a dark background and no shadow.
 * What should I do to avoid these errors? Just not use Draw.io ( which I'd prefer not to do)? I'd hate to have to manually edit the XML, but I will if it's the only option. Jdbtwo (talk) 15:38, 26 January 2024 (UTC)
 * May I suggest exporting an SVG file from draw.io? Open it in a text editor like Notepad, and search for . If it is present, check if draw.io has a setting to export plain SVG or files without SVG 2 features. Good luck, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 22:59, 27 January 2024 (UTC)
 * Re design flaw, these are several justifications for the design, if I remember correctly:
 * SVGs vary tremendously in size: detailed maps may be tens of MB, wasting a lot of bandwidth to show a small thumbnail. PNG thumbnails tend to be more consistent: a few to tens of KB for typical sizes.
 * Older browsers did not support SVG (likely no longer relevant).
 * While rsvg has many bugs, once generated, one can be assured on how it will appear in most browsers. Support for advanced SVG features vary between browsers.
 * Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 09:56, 25 January 2024 (UTC)
 * Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 09:56, 25 January 2024 (UTC)

Requesting more Mario emblems
I'm asking for someone to create new emblems relating to significant Mario characters, specifically those of Princess Daisy, Bowser and Yoshi. Since there's already emblems on the respective articles for Mario, Luigi, Wario and Waluigi I hope this is justified. This link to a fan wiki should be a quick reference as to what the emblems should look like in particular. Carlinal (talk) 19:43, 4 February 2024 (UTC)


 * This page is for help with bugs in Wikimedia's thumbnail generator. For general illustration requests, please ask at Wikipedia's or Commons's illustration workshop. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 14:54, 5 February 2024 (UTC)
 * Thank you! :3 Carlinal (talk) 18:01, 5 February 2024 (UTC)

2026 FIFA World Cup qualification eliminations
I am trying to edit recent eliminations from World Cup qualifying for this month, but I fear that I may screw up the process. The countries eliminated are Chinese Taipei, Turkmenistan, Hong Kong, Nepal, Pakistan, Turks and Caicos Islands and U.S. Virgin Islands. The image is File:2026 world cup qualification map.svg. Thank you. David Matoushek (talk) 03:26, 27 March 2024 (UTC)

Need code help regarding font and validation
Hello, could someone help me with 2 code issues. The SVG file was created with Inkscape.

1) I used the free font "Liberation Sans" in Inkscape and later added the fallback fonts manually into the code. But the tool SVG Check shows the following error: "*Warning* You appear to have specified a font that does not exist on Wikimedia wikis."

Excerpt from the current code:

2) Regarding validation with the w3c validator I get the following error:

"Attribute data-name not allowed on SVG element svg at this point." which refers to line 12:

Excerpt from the beginning of the code:

Your help would be much appreciated. Thank you. Abvdj (talk) 20:29, 2 April 2024 (UTC)
 * First, which image are you working on? Second, if posting snippets of SVG markup, please place them inside <syntaxhighlight ></syntaxhighlight> tags (see for example several of the posts at SVG help/Archive 8). -- Red rose64 &#x1f339; (talk) 21:01, 2 April 2024 (UTC)
 * The SVG is designed to visualize the complex pathology of a very rare metabolic disease. It is a flow chart. Thanks for the hint, I will integrate code better in the future. The goal is also that the svg file can be translated into several languages and can be updated later as research progresses. Abvdj (talk) 10:02, 3 April 2024 (UTC)
 * @Redrose64 I've tried a few more things in the meantime. But unfortunately I can't solve it. Abvdj (talk) 20:29, 4 April 2024 (UTC)
 * If you don't tell me which file you are working on, I can't help you. -- Red rose64 &#x1f339; (talk) 21:08, 4 April 2024 (UTC)
 * @Redrose64 I haven't uploaded it yet. Thought it shouldn't be uploaded if it doesn't pass the svg checker and w3c validation. Abvdj (talk) 21:59, 4 April 2024 (UTC)
 * Hi
 * 1) It's a known issue that the checker warns about fonts that it doesn't recognise, even if they are fallback ones, in this case, Arial. What you did was correct, so you can ignore this warning.
 * 2) The error message states it clearly: the svg tag should not have an attribute called data-name. http://stackoverflow.com/a/15580322 explains that data-... attributes are not in SVG 1.1, the version Wikimedia currently uses.
 * Hope that helps, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 10:03, 7 April 2024 (UTC)
 * Hello@Cmglee
 * Thank you for your response. That's good to know. Much appreciated. Abvdj (talk) 21:18, 15 April 2024 (UTC)

Gradients incorrectly rendered
The bottoms of the clouds in the first thumbnail are not transparent, as in the browser rendering or the second thumbnail. Would anyone know of a remedy?

Secondly, in the first uploaded version, the radial gradient behind the lady ( grad_studio in the source) is not rendered at all, giving just a solid grey. I think it's because its cy over 100%. I replaced it with a linear gradient in the second upload. Is this a known issue?

Thanks, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 00:49, 15 April 2024 (UTC)


 * It may be a completely different issue, but in earlier versions of this image: 20210709 Bowling - strikes versus set scores - scatter plot.svg, the gradient didn't render. JoKalliauer solved the problem, apparently by using Inkscape to form that element. I don't understand why it works and my text editor attempt did not, or if it's relevant to your problem, but you could try Inkscape to form the element(s) in question. — RCraig09 (talk) 00:54, 15 April 2024 (UTC)
 * Thanks, I'd still like to find out exactly what causes gradients to not work so that text-editor editors can get it right the first time. Cheers, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 16:07, 17 April 2024 (UTC)

Need help with electoral map rendering
Hello, I'm having a few issues getting an electoral map to render correctly.

In the picture I have several areas of the map that are transparent. When I load this map into an editor (or if you view it directly here!) these transparent areas don't exist at all, bar the expected one in the top right, which is how I want the map to look. What's making this tricky for me to correct is that most of these areas don't correspond to any existing divide on the map - for example, the bottom right transparent area on the map doesn't line up with any ward at all, so I can't see anything to change. RandomEditsForWhenIRemember (talk) 20:10, 19 April 2024 (UTC)


 * Just to clarify, all the transparent regions in the thumbnail should be blue, except the top-right one which should remain transparent? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 02:50, 20 April 2024 (UTC)
 * I've worked out what we're seeing but not yet why. The true SVG version at [[Media:Cotswold UK ward map 2011.svg]] is mostly correct (the blank area at extreme upper right should be light brown, this may be a genuine error, compare c:File:Cotswold UK ward map 2015 (blank).svg where it's drawn in light brown). In the PNG version as rendered at c:File:Cotswold UK ward map 2011.svg, the cream light blue , light brown  and red  areas are also mostly correct (again, the transparent area at extreme upper right should be light brown ); however, the blue , grey  and orange  areas - and their outlines - are all displaced downwards by the same amount as each other, relative to the first four colours. Look at the blue area at bottom left - its upper outline is exactly the same shape as the upper outline of the transparent area above it. So where a blue, grey or orange area is correctly adjacent to a light brown area in the true SVG, the PNG shows either a gap (which shows as transparent) or the blue, grey or orange is drawn in front of the light brown, hiding the latter. Consider also the positions of the light blue areas relative to the others - for example, the cluster at lower centre is drawn in front of the orange and light brown on the true SVG, but in front of the orange and blue on the PNG. -- Red rose64 &#x1f339; (talk) 12:05, 20 April 2024 (UTC)
 * It's to do with the transforms. The shapes that are displaced downwards are all inside a  element whereas the correctly-positioned shapes are in other g elements with differently-constructed transforms, more specifically, none of them have a   property. This property is not part of [//www.w3.org/TR/SVG11/ the SVG 1.1 spec], and whilst it is [//www.w3.org/TR/css-transforms-1/#transform-origin-property part of CSS Transforms Module Level 1], librsvg doesn't recognise any CSS properties that are not explicitly part of [//www.w3.org/TR/2018/SPSD-CSS1-20180913/ CSS level 1]. That, I'm pretty sure, is the problem, but I don't know what to do about it. -- Red rose64 &#x1f339; (talk) 13:49, 20 April 2024 (UTC)

How can I resize SVG images (not just the objects within them)?
E.g. If I have a simple graphic image, and want to reduce it to 1/5 canvass size without any change in appearance. (It's helpful to have all images in a series set to the same size, line weight, etc., especially when merging them together or exchanging elements.)

For example, File:Cepheus symbol (bold).svg is currently on a 102x102 px canvas, and I'd like to reduce it to 16x16 px.

Currently, I can only do this by resizing the canvass, resizing the object, and then repositioning the object, which is okay for a few files but adds up when converting lots of them (about 200 in this case).

If I could do it in bulk, that would be even better.

BTW, I'm on Linux.

Thanks. — kwami (talk) 06:17, 22 April 2024 (UTC)


 * As I understand your request:
 * will achieve the size reduction of SVG ". . ." elements. Of course, you'll have to adjust the width and height specifications and any viewbox setting that you have, near the top of your SVG vile. — RCraig09 (talk) 16:50, 22 April 2024 (UTC)
 * Kwamikagami is not asking about individual elements, but the whole image.
 * Don't worry about transform - look at the second line of the file, where there is a tag - this has two attributes  . These can take a variety of values, you could alter them to  . You should not need to alter anything else. -- Red rose64 &#x1f339; (talk) 20:25, 22 April 2024 (UTC)
 * If I only change the width and height specifications in the  specification, it chops off most of the image. I think the   specification must also be used on all the elements in the image. — RCraig09 (talk) 20:50, 22 April 2024 (UTC)
 * That should not happen. Make sure that you leave the  attribute unchanged. -- Red rose64 &#x1f339; (talk) 21:40, 22 April 2024 (UTC)
 * That works perfectly. Thanks! — kwami (talk) 22:38, 22 April 2024 (UTC)
 * That works perfectly. Thanks! — kwami (talk) 22:38, 22 April 2024 (UTC)

Need help with fixing a logo
So, the LT 2024 logo has a few letters that look corrupted when shown on Wikipedia, but when I click on the original file, it shows the complete logo… VenezuelanSpongeBobFan2004 (talk) 07:49, 25 April 2024 (UTC)
 * You need to specify the image, as in File:LooneyTunes2024.svg. -- Red rose64 &#x1f339; (talk) 18:29, 25 April 2024 (UTC)
 * Anyway, my opinion is that this concerns the  attributes of the  elements. A lot of the values have been run together without any separators, making them ambiguous. -- Red rose64 &#x1f339; (talk) 19:17, 25 April 2024 (UTC)

Help resizing logo
This is my first time uploading an SVG file. I just uploaded File:Avatar Studios logo.svg and I am certain this file isn't entirely free. I want to resize it appropriately, similar to File:DreamWorks Animation SKG logo with fishing boy.svg. Any advice? Zingo156 (talk) 19:37, 23 May 2024 (UTC)
 * It's not an SVG, it's a PNG that is pretending to be an SVG. Resize the PNG so that it is 281 x 255 instead of 444 x 561, then upload it as a true .PNG, and you will find that it is small enough to satisfy WP:IMAGERES. -- Red rose64 &#x1f339; (talk) 20:06, 23 May 2024 (UTC)

How to make SVG print on multiple predefined pages from a browser
To illustrate the concept of print-and-play games, I mocked up an example in SVG. As rsvg does not render some of the emoji, I wish to view the SVG in a compatible browser and print to PDF as shown. I wish the pages to break at predefined points so that the printout can be cut into cards. How can I do so?

My workaround was to build in a switch to select which page to render, so that I can manually print one page at a time. Merging and optimising the soft-copies yielded the uploaded file.

Thanks, cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 23:16, 6 June 2024 (UTC)

Rendering issue
This logo is not rendered correctly but appears fine on browsers. Can someone help me fix it? Thanks. 0x0a (talk) 06:13, 7 June 2024 (UTC)
 * It's not really an SVG image; it's a PNG that some fancy clipping and masking has been applied to. PNGs are not infinitely scalable. Also, it appears to have some East Asian characters in use for id names, these might not work as expected. -- Red rose64 &#x1f339; (talk) 07:50, 7 June 2024 (UTC)
 * It seems PNG was used to make the complex gradient, similar to File:CIExy1931.svg. As SVG lacks non-radial or non-linear gradients, and the gradient is smooth enough to not show pixelation when zoomed in, that seems a valid use of embedded bitmaps.
 * I'll investigate why there's a large gap between the shapes, though there are still hairline cracks in the browser rendering due to commons:Librsvg_bugs. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 15:43, 7 June 2024 (UTC)
 * Further to the above, see c:Help:SVG. Your logo lacks the XML Prolog, i.e. the  line, and in the  tag, the   attribute is absent. -- Red rose64 &#x1f339; (talk) 17:26, 8 June 2024 (UTC)
 * It works. Thank you! 0x0a (talk) 04:37, 9 June 2024 (UTC)

Embedded text is not rendered correctly in svg file
Hello, can someone please fix the file. The text is no longer rendering correctly, probably due to switch element translations. Everything worked fine in the beginning, unfortunately I can't tell when it stopped working. Some letters/words are pushed into each other. Thank you. Abvdj (talk) 16:41, 8 June 2024 (UTC)


 * propionate_pathway.svg
 * I've remade the SVG as it was incredibly bloated, making it difficult to debug. Is it better? cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 12:55, 10 June 2024 (UTC)
 * @Cmglee: Thank you for your attempt and your effort. I just uploaded my different versions of the svg file to “Test.svg” to find out which language caused the error. Surprisingly, everything has now worked correctly again. So could you please put my last version back in, I've put so much work into the alignment, proportions, font and spacing. I know that a few boxes need to be lengthened, but I still wanted to wait and see if native speakers have a better and shorter translation. Abvdj (talk) 22:15, 10 June 2024 (UTC)
 * I've also put in a lot of time today to remake the diagram and copy all the languages over. The original at 173 KB is unnecessarily large: my version is just 15 KB (8.7% the size), which makes it much easier for future editors to update. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 23:51, 10 June 2024 (UTC)
 * @Cmglee: Why didn't you ask before you took on so much work? There was a misunderstanding. I rather thought that someone was adding a line of code or changing/adding a variable. Maybe something with backup fonts or something similar. A small job. The file size thing is certainly good, but at the same time it locked out the majority who aren't pros at creating/editing SVGs using a text editor. Adding more translations may still be easy for future editors, but adding more arrows, boxes etc. will be more difficult. Maybe I'm wrong, but now I can't just open it with Inkscape and make the needed adjustments. For example, the proportions are not right, which makes it unpleasant to look at the diagram. It looks distorted, as if a small image had been scaled up but not proportionally. The ellipse instead of a circle in the "citric acid cycle" and the small height compared to the length of the text boxes with larger font size intensify this effect even more. Currently the arrowheads are also not rendered correctly, in the original there was a distance of 3 px between arrows and text boxes. The arrow from "methylmalonic acid" to "L-methylmalonyl-CoA" should not be rounded in the corner, since all other arrows are straight, it makes it inharmonious. Also, texts “ATP”, “CoA” & “Acyl-CoA synthetase family member 3 (ACSF3)” are not center aligned to the previously mentioned arrow. I would help with that, now I don't know how. Abvdj (talk) 17:06, 12 June 2024 (UTC)
 * If there original works, just revert my change and link to the above justification. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 19:20, 12 June 2024 (UTC)

Path elements don't appear, except directly in Chrome and Safari (not in Firefox)
The file description page, and Wikipedia renderings, do not render 14 differently-colored trapezoidal paths that should be visible in front of the 14 yellow rectangles. Clicking through to the renderings in Chrome and Safari, the trapezoids show up as they should. However, the trapezoids do not show up using Firefox. ( ~ scratches head ~ )

Adding  did not help. Could the difference between relative and absolute coordinates possibly be the problem? * Yellow rectangles:

Trapezoids:
 * etc etc
 * etc etc
 * etc etc

Update 1: the problem is definitely in the trapezoids group itself, as they are not showing up at after I purposely removed the yellow-rectangles group.

Update 2: Notice how, at, some of the "File history" thumbnails show the colored trapezoids, but the main display shows an old version.

(Yes, I've cleared my browser cache, many times.)

Any help would be appreciated! — RCraig09 (talk) 17:45, 17 June 2024 (UTC)
 * This is the code:  In Firefox 127.0 they are there, but extremely narrow - they have the appearance of vertical lines of varying height, the thickness of the line corresponds with the very narrow stroke-width: one-tenth of a pixel, when your canvas is 1200px wide, is barely perceptible. At that sort of scale, the black is largely lost as the colour of the adjacent pixels swamps these lines. -- Red rose64 &#x1f339; (talk) 07:59, 18 June 2024 (UTC)
 * you have a spurious extra comma on every  attribute in that block. Change   to   and similarly for all of the others. -- Red rose64 &#x1f339; (talk) 08:03, 18 June 2024 (UTC)


 * D'oh! I have committed a rookie error. Many thanks, User:Redrose64. — RCraig09 (talk) 14:22, 18 June 2024 (UTC)
 * Interesting. Ordinarily, commas and spaces are equivalent in path d attributes but here it makes a difference. cm&#610;&#671;ee&#9094;&#964;a&#671;&#954; 11:18, 19 June 2024 (UTC)