How to view an SVG image on Mac OSX?

Question

I'm working with a bioinformatics visualization tool, which saves a biological pathway as an SVG image.

I now want to view the SVG image... but am having some trouble doing so. I tried opening it as a file in both Chrome and Firefox, but in both browsers it just opens a blank page. I clicked on "View page source" and I'm able to see the XML data of the SVG image, but still, I want to see the image itself as a graphic.

What's the easiest way to view the image as a graphic? I understand that I can embed it in an HTML page and view it that way... but that's not at all convenient, if I have to create an HTML page each time I save a pathway as an image.

By the way, I'm using a 64-bit Mac OSX version 10.8.4.

Browsers should be able to just show it. I wonder why that's not the case for you. Can you upload an example? — slhck, Oct 31 '14 at 19:40
Yes I thought that Firefox or at least Chrome should be able to view it. Is there a way to upload on Superuser? Or would I have to upload on a temporary hosting site? — ktm5124, Oct 31 '14 at 19:58
No, sorry, but any file hosting site or Dropbox or something would be possible, of course. — slhck, Oct 31 '14 at 20:00
I was able to open a smaller SVG file in Chrome. Could it possibly be the image size? The SVG file I'm unable to open is 20 MB. — ktm5124, Oct 31 '14 at 20:16
I just tried opening it in Inkscape. It opened... but it's very slow and unusable. It seems like Inkscape is on the verge of crashing :( After all it's a 20MB SVG file. — ktm5124, Oct 31 '14 at 20:38
Yeah, after opening it in Inkscape the software is completely frozen. I can't even use the menu tools (like the 'File' menu). — ktm5124, Oct 31 '14 at 20:39
I don't have OS X so I'm not familiar with the options available, but on Linux I would just create a small ramfs, or ramdisk. When I want to view a file I'd copy it to the ramfs, then open it, when done, remove it from the ramfs. Perhaps OS X has an option similar to `sudo mount -t ramfs -o size=40m ramfs /media/ramfs1` ? — Robin Hood, Nov 01 '14 at 20:34
20 MB is really large. If the file size turns out to be the cause of the problem, you might have luck using SVGO, a command line tool that can drastically and losless shrink the SVG file. — Ideogram, Sep 02 '18 at 14:05
Nowadays any browser is capable of rendering .svg, any browser you might be using anyway, at least on Windows, though probably this also applies to Mac OSX... — Ξένη Γήινος, Jan 14 '21 at 14:43

score 52 · Answer 1 · answered Jun 06 '15 at 15:13

52

I am pretty happy with Gapplin. It can convert (export) SVG images to other image formats (e.g. PNG) too.

answered Jun 06 '15 at 15:13

Miroslav Bajtoš

656
5
8

1

Not available in the UK apparently :( – JMK Nov 26 '18 at 08:21
1

@JMK Thats weird, its available in Ireland anyway. I was able to download it from the App Store. – Gary Barrett Mar 20 '19 at 23:16
Thanks! Is there any way to use this to convert via the context menu in the finder? – Keyslinger Oct 12 '22 at 19:46

score 42 · Answer 2 · edited Jul 21 '22 at 07:26

42

A simple way is to use Quick Look in Mac, simply press space key on the keyboard.

edited Jul 21 '22 at 07:26

Nolan Amy

105
5

answered Sep 23 '18 at 18:06

Billy Wang

521
4
2

3

But does Preview work with SVG files? – Glorfindel Sep 23 '18 at 18:15
3

Mac spotlight (Command+SpaceBar) does preview for svg files. Although not the best solution. – jerrymouse Oct 01 '18 at 13:54
@Glorfindel it does for me in Catalina (I'm on 10.15.6; haven't tried other versions). – Sam Jul 17 '20 at 15:11
My copy of Preview 11.0 (999.4) running on MacOS Catalina 10.15.2 does not open SVG files. I am pretty sure what's gong on here is that Billy Wang is talking about the (uncapitalized) image preview feature of *Spotlight*. (Spotlight is the thing accessed by pressing CMD-SPACE on Mac.) This is different from the (capitalized) *Preview* app, which is used for opening and manipulating image files. – Jess Riedel Oct 07 '20 at 11:55
2

More precisely, Billy probably mean the preview in Finder, when you hit Space while a file is selected. – Florian Oct 14 '20 at 12:13
1

And @Florian the name of that utility summoned using the space bar is **Quick Look** https://support.apple.com/guide/mac-help/view-and-edit-files-with-quick-look-mh14119/mac – Nolan Amy Jul 20 '22 at 21:17
its apps need to download first ? because i dont see the apps ( macbook pro m1 ) – Yogi Arif Widodo Mar 20 '23 at 00:42

score 10 · Answer 3 · edited Jun 01 '22 at 14:44

10

I needed a nearly-portable solution to view SVG files (vector export from Google Drawings, which doesn't print large images well) since my Mac is locked down to prevent typical software installation, App Store access and Chrome extensions. Fortunately, I can run Homebrew. That led me to install Inkscape from Homebrew using this command.

brew install --cask inkscape

edited Jun 01 '22 at 14:44

John Vandenberg

153
1
5

answered Jun 16 '17 at 16:18

Dalek Control

201
2
2

This fails at the moment https://github.com/caskformula/homebrew-caskformula/issues/97 – John Vandenberg Jun 01 '22 at 05:07

rogerdpack · Answer 4 · 2020-09-03T16:08:12.260

If you're part of the unlucky few where double clicking an .svg from Finder or opening it from the command line like open filename.svg just opens your svg file source in a text editor (and you wanted to see it visually), it appears possible to view them in a browser these days. What has happened is you installed a text editor and it "took over" as the default app to open for those file types.

Navigate in your web browser to its location, ex: file:///Users/my_username/... full URL should have look like file:///Users/username/folder/folder/my_file.svg you can start by just putting file:// in your browser URL then navigate to it.

This will "open it" visually in any major web browser. Alternatively right click on it in Finder and select "open with" and select a browser.

score 5 · Answer 5 · edited Sep 29 '17 at 16:53

5

There is a nice new free SVG editor with you can get from the Mac App Store or the Chrome Web Store. Give it a try, it's ~~free~~ now $9.99 on the App Store.

Boxy SVG - the scalable vector graphics editor

edited Sep 29 '17 at 16:53

bright-star

1,569
2
14
28

answered Apr 27 '17 at 19:46

Laszlo

150
1
4

2

[macSVG](https://github.com/dsward2/macSVG) is free + Open Source. – Bruno Apr 08 '20 at 06:15
1

@Bruno sound cool, may give it a try, however I still using Boxy SVG to this day, so I very much recommend it ! – Laszlo Apr 09 '20 at 19:07

score 3 · Answer 6 · answered Oct 31 '14 at 19:31

3

GraphicConverter has always been my standby 'any format' viewer & editor - it does SVG too
Caveat: Not free & there may be other apps that can do it.

answered Oct 31 '14 at 19:31

Tetsujin

47,296
8
108
135

I see. Yes we're looking for a free software (or browser function). – ktm5124 Oct 31 '14 at 19:57
Adobe used to make a viewer plugin... dumped summarily in 2009 http://www.adobe.com/devnet/svg/adobe-svg-viewer-download-area.html ... one reason Apple won't use Adobe formats natively, they drop support or change formats at any time. – Tetsujin Oct 31 '14 at 20:01
1

It might be time to be looking at a newer format, before you lose the ability to open/edit in future – Tetsujin Oct 31 '14 at 20:05
The software I use only lets you download the visualization in SVG format. – ktm5124 Oct 31 '14 at 20:39
1

I'd be inclined to poke upwards towards management, about a historic format - not going to be good for archiving – Tetsujin Oct 31 '14 at 20:47
@Tetsujin SVG isn't a "historic" format, or an Adobe one. It's an open standard that's in very wide current use; if anything, support for it is increasing. – Marnen Laibow-Koser Jan 07 '17 at 03:35
GraphicConverter has a demo version (free), which handles this just fine.. – frank ankersly Jan 11 '18 at 16:47

score 3 · Answer 7 · answered Dec 20 '14 at 01:41

3

I found that applications would refuse to open an SVG on OSX unless I gave it the correct extension. So I renamed the file to, in my case, pprof.svg. I was then able to "open with" Chrome.

answered Dec 20 '14 at 01:41

Matt Joiner

1,064
2
12
27

Paul Waldo · Answer 8 · 2018-10-28T12:03:09.050

2

I just discovered SVG Converter by Ohanaware on the Mac App Store. It converts to a number of formats and can crop before converting. Opening an SVG image gives you a nice window that shows the image and conversion is optional.

edited Oct 28 '18 at 12:03

answered Oct 27 '18 at 15:55

Paul Waldo

121
3

@Scott it does give a preview. This is where the cropping can occur. – Paul Waldo Oct 28 '18 at 12:04
Thanks for responding and editing your answer. – Scott - Слава Україні Oct 28 '18 at 16:36

score 2 · Answer 9 · answered Feb 15 '19 at 10:29

On macOS 10.12, I have been working with SVG files drawn using Inkscape and my own hand-written SVG files composed in a text editor.

Initially the Inkscape files would open as images in a web browser, in Preview, and via Quick Look (spacebar in the Finder), but my hand-written files would not. Instead they were displayed as raw source XML.

It turned out that the critical difference between the two was that my hand-written files were missing xmlns:

<svg xmlns="http://www.w3.org/2000/svg" width=… …>
…
</svg>

Once I added a namespace declaration to <svg>, macOS recognised my hand-written files as SVG images and displayed them as such.

Perhaps your bioinformatics visualization tool has also omitted this declaration?

score 1 · Answer 10 · answered Sep 29 '18 at 13:58

1

you can try this photo viewer to browse SVG images on Mac with ease.

answered Sep 29 '18 at 13:58

alexhamberg

11
1

1

Almost went with this option, turns out I had "icon preview off" in finder view options. That solved my problem of dealing with hundreds of SVGs in a folder – Ray Foss Mar 28 '19 at 13:42

Paul · Answer 11 · 2021-11-30T01:28:41.873

1

Quick no-install option:

Preview it in finder with spacebar
Maximize the window (top left)
Take screenshot with cmd-shift-3 or similar

edited Nov 30 '21 at 01:28

answered Apr 09 '19 at 19:16

Paul

111
3

The best answer ever! :) No additional software, pure macOS :) Thanks! – Oo.oO Nov 06 '21 at 16:47

score 1 · Answer 12 · answered Jan 04 '22 at 23:11

Pressing spacebar is noted on the answers but I was interested to know how one can bring that from command line without the finder and turned out that be can done using

qlmanage -p filename.svg

But apparently it needs an interactive shell to work as I couldn't issue it from an app/script I wanted the functionality, to me it quickly turned out, my editor, IntelliJ Idea, was able to show SVGs itself so I'm using that anyway guess however someone will see find how one can bring qlmanage from a shell correctly also.

Also to note, qlmanage is also able to render SVG to PNG or something but I didn't just test it. — Ebrahim Byagowi, Jan 05 '22 at 15:21

SheeplessKnight · Answer 13 · 2019-05-24T17:54:35.237

0

I love the tool ImageMagick it is available from the apt repo for linix as well as a GitHub.

Edit: It is a simple command-line utility that utilizes the file extensions, or user flags to override to convert images, with the first file being converted (and copied ) into the second file in the argument list. Source: https://github.com/ImageMagick/ImageMagick

edited May 24 '19 at 17:54

answered Apr 03 '19 at 21:55

SheeplessKnight

1
2

1

Explaining how this tool answers the question would make it more helpful. Also, please read our Help section where there's an article explaining how best to recommend software. – music2myear Apr 03 '19 at 22:38
This is a quite non-Mac answer to a Mac-specific question. Mac does not have APT. It does, however, have third-party package managers likeHomebrew, MacPorts, Fink… all of which I believe offer ImageMagick (e.g., `brew install imagemagick`). The ImageMagick website itself recommends installing via Homebrew. – Frungi Dec 01 '20 at 00:35

score 0 · Answer 14 · answered Mar 20 '20 at 11:26

0

For new versions of Chrome, it can render SVG files directly(I just tried with Chrome 79).

answered Mar 20 '20 at 11:26

prehistoricpenguin

101
2

user1821961 · Answer 15 · 2021-01-18T16:53:50.697

0

Gimp is free and worked for me. https://www.gimp.org/

edited Jan 18 '21 at 16:53

answered Jan 14 '21 at 14:32

user1821961

109
5

score 0 · Answer 16 · answered Jul 16 '21 at 01:47

0

Most internet browsers can view SVGs.

right click the svg -> open in safari, then it will open in a new tab.

answered Jul 16 '21 at 01:47

Embedded_Mugs

161
5

score 0 · Answer 17 · answered Aug 08 '22 at 06:55

0

svg format is an XML format. So you do not need to convert it into html. You should be able to directly view it in a browser. You can confirm this by opening the file in a text editor and checking the encoding.

answered Aug 08 '22 at 06:55

uzumas

111
1

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Aug 08 '22 at 07:45

How to view an SVG image on Mac OSX?

17 Answers17