govicons.jpg

I’m currently working on creating a website that needs NASA’s logo (the “meatball” — don’t ask) in the upper corner. With the upcoming swarm of resolution independence due to high DPI screens and a multitude of screen resolutions, just including a standard JPG or PNG image just doesn’t cut it anymore. SVG icons allow you to include an image that scales as big or small as you need it, without any loss in image quality (and often smaller than a comparable image in PNG or JPG).

After doing some research on SVG images on the web, I came across FC Webicons, a set of social media icons presented in SVG with PNG fallbacks for older browsers that don’t support SVG images. As that code is open source, I adopted it to present NASA’s logo in a futuristic, resolution independent way…but decided, hey, it was so much fun, why stop there?

I’m happy to introduce today Gov Webicons, a set of 41 federal agency icons that you can use on your website with just two lines of code. Creating a dashboard of agencies? Include them all. Want to just update your own agency’s icon? Take out just the code and images you need and have fun living in the future.

Gov Webicons is open source and hosted on GitHub. I’d love to include additional federal agencies and can do so as long as there is a publicly available SVG version of their graphic online. Any tips on improving Gov Webicons or ideas for more agencies to add? Drop me a line in the comments below, I’d love to hear your thoughts!

About Sean

Technology Strategist

NASA Headquarters

sean.herron@nasa.gov