# Source files (preferably SVG, if it exists) for Graphviz logo? **URL:** \ **Category:** Site Feedback\ **Created:** [May 4, 2024, 9:46am UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175 "2024-05-04T09:46:50Z")\ **Posts on this page:** 15\ **Page:** 1
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [May 4, 2024, 9:46am UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/1 "2024-05-04T09:46:50Z")
I’ve looked around the set of repos at [graphviz · GitLab](https://gitlab.com/graphviz) and so far come up empty-handed, so I’m wondering: Are source files available for the Graphviz `app.png` logo(s)? (I’ve found at least two versions, coming back to that in a second…) Specific reason I’m asking: I noticed that the logo banner here at the forum is a non-transparent image, and it looks pretty bad in the dark theme: ![image](https://global.discourse-cdn.com/graphviz/original/2X/6/68b3975ab6d84e4fcf03dc5f94b34383f66c0d4f.png) The _icon_ it’s made with appears to be [https://graphviz.org/Resources/app.png](https://graphviz.org/Resources/app.png) which is, similarly, a non-transparent, white-background PNG. It’s **possible** to “transparent-ize” PNG files with a background, but the results are usually less-than-perfect. It’s especially hard to do when the image uses things like gradient drop-shadows, as the `app.png` logo does. I found a _different_ version [of the icon](https://gitlab.com/graphviz/graphviz-web-static/-/blob/8a3b4f424f8e43b8775d17fc9fbe567819353e16/gvicons/app-graphviz.png) in the old-static-website repo, which I personally feel looks a lot better (it doesn’t have that green nonsense on it), and which initially seemed promising because it actually does have a transparent background. But, turns out the transparency there is an illusion, it was clearly an after-the-fact background erase that looks OK against light backgrounds, but will look like hot garbage against a _dark_ background: ![image](https://global.discourse-cdn.com/graphviz/original/2X/d/df81c559d4f78a53790d0396e76de948dedb06d8.png) Long and short, the _easiest_ thing would be to just use a vector source file to create a transparent version of the logo. But that’s assuming such a vector source exists somewhere. Or even a Photoshop/etc. bitmap source file with separated layers. ---
**Author:** ![scnorth](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/scnorth/32/89_2.png) [@scnorth](https://forum.graphviz.org/u/scnorth)\ **Post date:** [May 4, 2024, 12:02pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/2 "2024-05-04T12:02:11Z")
Icons in this style were first created by Glen Low for the MacOS front end to Graphviz. I think some of the source files like Graphviz.ai (for Adobe Illustrator) are still found in [macosx · main · graphviz / graphviz · GitLab](https://gitlab.com/graphviz/graphviz/-/tree/main/macosx) There are some variants of this icon seen in the wild, but I don’t believe anyone in our project designed them. ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [May 4, 2024, 2:14pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/3 "2024-05-04T14:14:10Z")
Ah, excellent, thank you! So, here’s what I found there. There is indeed an Adobe Illustrator file (`Graphviz.ai`), which after conversion by Adobe’s [online AI → PDF converter tool](https://www.adobe.com/acrobat/online/convert-pdf.html) became a `Graphviz.pdf` that’s openable in Inkscape. It appears to contain the _building blocks_ of the icon, in a somewhat unfinished state. Both of the layers are there (the primary layer, and the underlying one “revealed” by the magnifying glass), but the actual magnifying glass itself and the effect of combining the two layers is not executed. (Also, I’m getting a bad font substitution for whatever font the blue letters should be rendered in.) ![image](https://global.discourse-cdn.com/graphviz/original/2X/9/9d5af4b7daeb9d1131fd72dc17b44771af289465.png) There’s also a `Graphviz.psd` (Photoshop) file, which _does_ contain the fully-executed icon, on a transparent background, at `512×512` pixels which is four times the size (16 times the surface area) of the `128×128` versions I’ve seen so far: ![image](https://global.discourse-cdn.com/graphviz/original/2X/3/30ab7836f3e0db68b942e67a4788550f1c87ab5c.png) So, just exporting that bitmap file to PNG should provide a transparent version of the icon that’s far higher-resolution than most of what’s in use now (I won’t cry that it sacrifices the green “stuff” above the magnifying glass), and maybe that’s sufficient even though a fully-completed vector version doesn’t seem to be present in a ready-to-go state. (There’s also a second Illustrator file, `Graph.ai`, which is something completely different:) ![image](https://global.discourse-cdn.com/graphviz/original/2X/b/b9be80964138cf90100ab460cc2167c72c2e27a1.png) ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [May 4, 2024, 2:15pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/4 "2024-05-04T14:15:18Z")
And as soon as the spam nanny decides my reply isn’t spam, it’ll be visible. ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [May 4, 2024, 2:23pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/5 "2024-05-04T14:23:46Z")
Hmm. Looking at `Graphviz.psd` more, I’m beginning to suspect that there’s no “pure-vector” version of the final logo, because it was _executed_ entirely in Photoshop. Possibly because the magnifying glass is a bitmap image. I can believe Illustrator would’ve been… “reluctant” to do that properly. The `.psd` file contains two layers for bitmap-rendered versions of the two sheets in the vector file, which it combines using a mask to create the magnifying-glass effect. Then the magnifying glass itself is inserted on top in another layer. (Well, like 3 layers, when you include the shadow effects and whatnot.) ---
**Author:** ![magjac](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/magjac/32/16_2.png) [@magjac](https://forum.graphviz.org/u/magjac)\ **Post date:** [August 26, 2024, 7:39pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/6 "2024-08-26T19:39:43Z")
![image](https://global.discourse-cdn.com/graphviz/original/2X/f/fc15886c36d9786c7ae1b45e4716bd16f80944c5.png) That particular combination was made by me. I could easily change the “Graphviz” text to be on a transparent background. I agree the green “stuff” looks bad. I’ve never used Photoshop or Illustrator or anything similar and have no intention to learn. But if you can provide the nicer logo on a transparent background, I can try to combine them and update the forum logo. Or, even better, you give me a ready-made logo that I can use 😄. ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [August 27, 2024, 12:19am UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/7 "2024-08-27T00:19:39Z")
Ooh, thanks for poking this, I’d completely forgotten about it. Where I last left off (and hadn’t yet updated this thread yet) was that I’ve actually found an extremely close match to the magnifying-glass image used in the logo, but **as an SVG file** : ![image](https://global.discourse-cdn.com/graphviz/original/2X/1/1f0df208b2410f13d77d8e70f94f838fe6c2c996.jpeg) That file lives [at WikiMedia Commons](https://commons.wikimedia.org/wiki/File:Magnifying_glass_icon_mgx2.svg), no less, licensed under Creative Commons CC0-1.0 (public domain dedication) terms that would make it available for use in the Graphviz logo imagery. So it’s just a matter of me finding the time to combine the elements in `Graphviz.ai` with extracted elements of Commons’ `File:Magnifying glass icon mgx2.svg` (losing the drop shadow and lens shading, basically), and turn them into a vector version of the logo. ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [September 12, 2026, 10:06am UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/8 "2026-09-12T10:06:17Z")
Ohh-kay. So it’s taken me over 2 years, but I finally have at least a first draft of the mostly-recreated, 100% bitmap-free, entirely-vector-based version of the logo. A few things are undeniably changed. The goal was never to create something 100% identical to the bitmap version. For starters, this vector logo is made with the assets I had available to me, which means a different magnifying glass (as noted above), and different fonts for the text pieces. I have an Inkscape SVG of the logo with the text as fonts. The blue “formula” text uses a font called Kalam, which is [available from Google Fonts](https://fonts.google.com/specimen/Kalam). If that’s not installed, the text won’t look right. (The numbers are Helvetica, so that’s easily obtained or substituted.) Since a drawing with fonts that need matching or replacing won’t work well for an icon, I also exported a version with all of the text converted to paths: ![Graphviz_NoFonts](https://global.discourse-cdn.com/graphviz/original/2X/0/0dced8a20641d48f4e0a78fc119c843f8fcdaf83.svg) Hm. Still messing up the magnifying glass handle. That was copy-pasted right from the original SVG I linked to above, and uses some complicated gradient tricks. Let me see if I can debug where it’s breaking the SVG renderer here, since that’ll likely happen in other places where it’s used, too. (Looks fine in Inkscape, but that’s hardly the point.) ---
**Author:** ![steveroush](https://avatars.discourse-cdn.com/v4/letter/s/a9adbd/32.png) [@steveroush](https://forum.graphviz.org/u/steveroush)\ **Post date:** [September 12, 2026, 5:59pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/9 "2026-09-12T17:59:35Z")
I believe you can solve the “Kalam” font problem by using the SVG **@face-font** feature - either embedded (subsetted) or linked -(see [Unwanted space around html font tags with svg output (#1891) · Issues · graphviz / graphviz · GitLab](https://gitlab.com/graphviz/graphviz/-/work_items/1891#note_2373759631), [https://www.w3.org/TR/SVG11/fonts.html#FontFaceElement](https://www.w3.org/TR/SVG11/fonts.html#FontFaceElement)) ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [September 12, 2026, 11:05pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/10 "2026-09-12T23:05:36Z")
> [@steveroush](#): > > I believe you can solve the “Kalam” font problem by using the SVG @face-fontface-font feature Maybe, but with the (“magnified” numbers) text being flowed onto curves, too many SVG renderers seem to handle that badly, so I figure it’s better that all the text be converted to path objects. Then there are no worries about support for various font features. Here’s another try, with the clipping path removed from the magnifying glass handle (which I hope is what was throwing things off), and the elements inside the magnifying glass “dumbed-down” for wider support. (Previously the magnified graph paper viewed through the lens was constructed from an actual clone of the base paper/grid objects, enlarged by 20% and then clipped into the circular lens area. But that seems to confound a lot of SVG renderers, so now it’s just an enlarged, circular, completely-separate copy of the “paper” elements. Hopefully that’s less of a challenge.) ![Graphviz_NoFonts](https://global.discourse-cdn.com/graphviz/original/2X/c/cae7d3c51b6a4a1e6db19ccc0db3b72cf3b0b5e4.svg) …Man, it really does hate that handle. It’s constructed from a 5-stop gradient, which I suppose may be the problem. Either that, or it’s the drop-shadow filter. I’ll try removing the shadow first, if that fixes the handle rendering I can add it back in as a separate object instead of a filter effect. If it’s not the shadow, then I’ll just simplify the gradient into a set of layered solid-color objects. ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [September 12, 2026, 11:07pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/11 "2026-09-12T23:07:18Z")
Drop-shadow-less-handle says what? ![Graphviz_NoFonts](https://global.discourse-cdn.com/graphviz/original/2X/c/c8882ebadfb635aef24298265d113704353f2de8.svg) Ayup. There it is. Lemme just add a shadow back under it, without using the filter. ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [September 12, 2026, 11:17pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/12 "2026-09-12T23:17:23Z")
Is it soup? ![Graphviz_NoFonts](https://global.discourse-cdn.com/graphviz/original/2X/0/07c517cea3cfefd2b50f4527535ac6abf677c6ae.svg) It is!! \o/ ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [September 12, 2026, 11:53pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/13 "2026-09-12T23:53:25Z")
Now, let’s see how it looks shrunk down as tiny as the headerbar icon at the top of this page… here’s a 68x64px scaled version, so Discourse will render it appropriately tiny. ![Graphviz_68x64](https://global.discourse-cdn.com/graphviz/original/2X/2/26fd902890b73abf1971e2f4f71acd5eb92ae4f9.svg) Eh. Not bad. The mag-glass handle could maybe use a bit of a light-colored outline, for when it’s placed against a dark background. (As it is above, for those of us who’re viewing the site in dark mode). The SVG can of course be used against light or dark backgrounds. Here it is against the dark-mode background color of this site, the blue of the [graphviz.org](http://graphviz.org) headerbar, and a `#fff` white page: ![Graphviz_3backgrounds](https://global.discourse-cdn.com/graphviz/original/2X/3/35add888e83dc9f8b71dbfc119e41552abe7dbb9.svg) The page also has a drop shadow filter applied to it, which I am now realizing the SVG renderer here is not showing either. Makes the “paper” get kind of lost against the background. I’ll replace that filter with a separate shadow object, like for the handle. ---
**Author:** ![steveroush](https://avatars.discourse-cdn.com/v4/letter/s/a9adbd/32.png) [@steveroush](https://forum.graphviz.org/u/steveroush)\ **Post date:** [September 12, 2026, 11:56pm UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/14 "2026-09-12T23:56:58Z")
Very nice ---
**Author:** ![FeRDNYC](https://sea2.discourse-cdn.com/graphviz/user_avatar/forum.graphviz.org/ferdnyc/32/1428_2.png) [@FeRDNYC](https://forum.graphviz.org/u/FeRDNYC)\ **Post date:** [September 13, 2026, 12:08am UTC](https://forum.graphviz.org/t/source-files-preferably-svg-if-it-exists-for-graphviz-logo/2175/15 "2026-09-13T00:08:19Z")
Thanks! There were magnifying-glass-lens shadows that also weren’t rendering, so I baked those in as well. Now all of the (obviously not well-supported) filter shadows are gone. ![Graphviz_NoFonts](https://global.discourse-cdn.com/graphviz/original/2X/a/a2f28ae893e0535ffb4751bd2daeeaec15198d18.svg) And, the same 3-backgrounds survey… ![Graphviz_3backgrounds](https://global.discourse-cdn.com/graphviz/original/2X/5/5348ebd0e822a190525923cc1f7df25e64b3e97c.svg)