We've been there. You're getting in the groove of designing a webpage or email, and you get to the bit with the social icons. Progress grinds to a halt. You have to search the depths of the internet for an image or vector of the right size. Then you have to port that into image editing software to recolor the icon to match your brand or design. Then you have to export the thing to the right format. What a pain in the @&$.

At least we thought so. We're always on the hunt for ways to simplify our workflow. So we took it upon ourselves to create a simple app to do the hard work for us.

Generating Social Icons (and more time!)

From Reddit to TikTok to GitHub, we gathered just about every social icon you'll probably ever need. We did squares. We did circles. We have it all. You can even filter them so you can find what you're looking for that much easier.

Color me excited

Just having them all in one place is time-saving enough, but we went a couple steps farther. As we mentioned, re-coloring icons to match a brand or design can be annoying. With our app, you can choose whatever color suits your fancy.

Want a soft millennial pink? Yup! Just plug in the hex code (#ffd1dc if you're curious) or play around with the colors 'til you find one that's just right.

If you need a logo for a web project, we even have an option to create html logos with a hover state color built in and ready for download.

On the download

Speaking of downloads—you have the option to download each icon in web-design-optimized PNG, SVG or (the aforementioned) HTML formats. Each have their uses depending on what you may need. But generally:

PNG: These images have transparent backgrounds, which makes them useful just about anywhere. The downside is that they're not scalable, so depending on the size, you may encounter resolution issues. PNGs are a decent choice if you need a quick-and-dirty static (i.e. won't resize based on if the user is using desktop, mobile, etc.) logo.

SVG: This is perhaps the most versatile format here. SVGs (scalable vector graphics) have a lot of benefits over PNGs. The biggest being that SVGs can scale (it's not just a clever name) up in size with minimal loss in resolution. So if you're planning on any sort of responsive design, SVGs are your friend. They also tend to be smaller file sizes than pngs, so they load faster. If you have code know-how, you can also animate SVGs using a bit of CSS.

HTML: Speaking of code—for our downloadable HTML logo files, we just take the SVG version and offer the option of a hover color. All you have to do is copy the code in the file into your web-based project, and voila! A hover-able social logo!

What are you going to do with your extra time?

So there you have it. Getting the right social icon is no longer the prickly project it once was. We hope that all that saved time inspires you to dream big. If you want someone to bounce ideas off of, we're here. Just get in touch. We love to hear wild ideas.