ElkArte Community

Elk Development => Theme development => Topic started by: badmonkey on September 04, 2017, 09:29:49 pm

Title: custom Board ::before icon SVG image
Post by: badmonkey on September 04, 2017, 09:29:49 pm
Does anyone know a site to get a png image converted to SVG code so it can be used in CSS?  Or a Windows based script would be ok as well.  Specifically here's the png to be used (attached).  Thanks!   8)
Title: Re: custom Board ::before icon SVG image
Post by: Frenzie on September 05, 2017, 03:29:03 am
You can typically trace bitmaps in most vector editors. I've attached a quick Inkscape trace. That being said, why not just use the image as is?

@emanuele Interesting error.
Quotebla.svg : The post data is missing. This error could be caused by trying to submit a file larger than allowed by the server. Please contact your administrator if this problem continues.
Title: Re: custom Board ::before icon SVG image
Post by: badmonkey on September 05, 2017, 07:09:13 am
Using the png image is an option.  It would certainly work fine.  I'm also hoping to learn the process to potentially customize other icons in a theme.  The same could be done there too, of course, but for sake of scalability as well as uniformity....  Thanks Frenzie.
Title: Re: custom Board ::before icon SVG image
Post by: Spuds on September 05, 2017, 09:09:13 am
Most programs that do the conversion are not very good ... but https://vectormagic.com can do a decent job at really attempting to vector-ize an image vs just creating a image with a bunch of vector cubes.   You can actually get some rather artistic results with this, but if you want it to be a tight geometric vector map you may need to fill in voids in the png so the edge detection does not get fooled.
Title: Re: custom Board ::before icon SVG image
Post by: Frenzie on September 05, 2017, 12:37:18 pm
My avatar here is actually a vectorization with limited colors. I think it can often be quite interesting to give it a go on photos.

I also like to vectorize scans of random doodles (http://fransdejonge.com/2017/08/the-ghost-of-student-counseling/). I often prefer the results over straight digital drawing (http://fransdejonge.com/2016/04/trois-champignons/), even if we have a pretty decent Wacom drawing tablet. Ctrl+z also has its advantages. I'm still happy with this one (http://fransdejonge.com/2009/12/space-dino/), done on an el cheapo Trust tablet. :P
Title: Re: custom Board ::before icon SVG image
Post by: emanuele on September 06, 2017, 05:56:13 pm
Quote from: Frenzie – @emanuele Interesting error.
Quotebla.svg : The post data is missing. This error could be caused by trying to submit a file larger than allowed by the server. Please contact your administrator if this problem continues.
Oh, I didn't see the mention. xD
hmm... I don't think svg are allowed as attachments (but I may be wrong), in any case, it looks like something is wrong (either the error message or the upload).
Title: Re: custom Board ::before icon SVG image
Post by: Frenzie on September 07, 2017, 08:34:34 am
@emanuele
Unless you changed something (I didn't check before trying) it says "Allowed file types: doc, gif, jpg, mpg, pdf, png, txt, zip, gz, php, css, psd, js, xml, svg"
Title: Re: custom Board ::before icon SVG image
Post by: emanuele on September 07, 2017, 10:28:57 am
oh I always use the quick reply and forgot about the list there. xD