A continuously growing set of unique SVG icons. 💁‍♀️ Brutalist design, vanilla CSS, 200ms page loads.

#css #javascript #svg #html

Checkout this landing page I recently launched for an SVG icon library I’m giving away for free. The landing page loads in under 200ms, uses IBM Plex Mono, brutalist design, and It uses pure vanilla CSS with no JS used for the SVG editing. The download buttons aren't live yet because I'm still finishing up the icon package but I wanted to get some feedback from the community.

I'd love to hear your thoughts on both the Icons and the landing page.

https://svgden.com/ 👈👈👈👈👈👈👈👈

I'll be adding and refining the library continuously in the coming months. I also plan on adding some more traditional sets for Business / Data / General UX needs.

Top comments (15)

Dennis Frijlink • Dec 22 '20

First of all my compliments for the design of the website. I love the icons. You also have a Git-repo?

Jake Counsell • Dec 22 '20 • Edited

I greatly appreciate the kind words! I'm in the process of putting all of these icons in 2 different sizes in extremely minified SVG format on Github, I'll also put an AI and EPS file with all of them on there as well. Lagging a little because of other projects, interviews, and Christmas stuff.

Dennis Frijlink • Dec 22 '20

Nice! I'll will follow the updates on the site/dev.io

Ben Halpern • Dec 23 '20

+1 This is what frontend development is all about.

Garrett Mills • Dec 22 '20

I like the design! Plus, it seems lighter to load than something like font awesome.

One gripe though, the site is broken on Firefox. ;)

Jake Counsell • Dec 22 '20

OOO really? What are you seeing on Firefox? I've been testing in FF on mobile and desktop. Let me look now, I may have broken something haha.

Garrett Mills • Dec 22 '20 • Edited

The main display area is very short, and it appears the left side isn't displaying properly. I've attached a screenshot.

I tried disabling my ad-blocker, but no difference. I'm on Firefox 83.0 on Ubuntu, if that helps.

dev-to-uploads.s3.amazonaws.com/i/...

Jake Counsell • Dec 22 '20 • Edited

Yeah, I'm seeing this, if you keep refreshing, the site actually displays perfectly for a brief second then breaks? What in the hell could be doing this? Any ideas? Works perfectly in every other browser including FF mobile.

Garrett Mills • Dec 23 '20 • Edited

I'm not sure, but it seems to be an issue with the left column's container not inferring the height correctly.

If I manually set a height of 400px on the div.lft_col, I can get the site to display.

EDIT: try setting height: 100vh on both the lft_col and rgt_col. This seemed to resolve it for me.

Jake Counsell • Dec 23 '20

Awesome, I think I have it fully resolved on FF desktop now. Thanks for the help! Can these vendors please just unify their browsers already haha.

Sadly my cool but hacky dark mode doesn't work on FF desktop... But everything should be working perfectly on FF, Saf, and chrome in mobile and on desktop now. I've even tested it in all of the hideous in-app browsers.

Jake Counsell • Dec 22 '20

I'm looking into it now!

Jim Montgomery • Dec 23 '20 • Edited

Jake what are the license terms? If you intend to make this free and want help with contributions I suggest moving the project to Github and using their .github.io hosting as it's performant, free and you can still solicit donations there to sponsor further work. If you need more help with this just message me directly.