Update: Added 1x version, as the retina version doesn't scale down well on normal displays.
Update #2: As an addition to our launch of Profile Badges, we also made our camera glyph icon publicly available!
We’ve launched Instagram badges to help you link to and promote your Instagram web profile. We've tried to keep up with sizing standards and therefore made them 64, 48, 24 and 16 pixel squares, or you can use the descriptive badge.
If you are logged in, you can just copy and paste the code from http://instagram.com/accounts/badges/ and paste it on your own website, blog, or wherever!
over 1 year ago
Great work! Shame the preview is a little blurry on @1x.
This is going to spread.
next step: IGConnect
@Dan Eden: I was thinking about making the 2x version less retina specific so it would scale down, but then that would defy the point. To me it's an oversight that we can't upload two files right now, but I'll go with it. :)
Also, just noticed that the buttons don't use any scripts.
I don't know who's responsible for that, but I'm going to fly over there just to buy them a thank you beer.
Wow, awesome! It would be great if you could release a .psd or .ai for us designers ;)
@Maykel Loomans would be amazing if you:
1. auto selected all text on focus or click on the code
2. detected copy and automatically checked the #2 step when the user copied
@Dan Eden I'll have that beer. We launched a simple first iteration because of that reason. :)
Some CSS transitions would be nice, too! (:
@Pedro Ivo Hudson All of those would be part of the code that people would have to copy paste, more code looks scarier, so we're keeping it to a bare minimum. :)
@Maykel Loomans About those CSS transitions: Maybe you could link to a .css on your server instead of inside the code itself and make the code to copy shorter?
@Manolo Sañudo We did that before, but it's an extra request, an extra possibility for a cross-domain failure etc. :)
I saw that this morning. It's pretty cool, although it's a big chunk of codes. It's a shame that so much more code is needed to support Retina. Great work though! :)
Looks nice but I would have liked to see badges with no images or maybe just one—the mark—as a svg.
@Daniel Bruce The mark is available as vector PDF. You're welcome to convert it to SVG and use it. :)
Cheers @Maykel Loomans
about 1 year ago
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2014 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.