Twitter's New Logo Inspires Parodies, CSS Greatness

Twitter unveiled a new bird logo earlier this week. To go along with the new bird the company posted some strict guidelines about how to use it, but that hasn’t stopped web developers and designers from creating awesome parodies and a pure CSS version.
Image may contain Vehicle Transportation Car Automobile Sports Car and Coupe
Twitter's new logo versus its Batman parody. Images: Twitter & Josh Helfferich

In case you’ve been too busy using third-party apps to notice, Twitter recently unveiled a new logo.

From now on, proclaims the Twitter blog, “this bird will be the universally recognizable symbol of Twitter.” At least they aren’t being too over the top about it.

Ridiculous proclamations aside, we rather like the new bird and we like it even more when rendered in pure CSS, which is exactly what the developers at Upperdog, a design agency in Stockholm, have done. View source to see how it works. It’s an impressive exercise in CSS, but of course since it will only work in the latest browsers, you’re probably better off sticking with Twitter’s official graphics for real-world use (or an icon font version).

Twitter has some rather strict new rules they’d like you to abide by when it comes to the new logo. For example, you shall not “use speech bubbles or words around the bird” nor shall you do anything fun like animate the bird. There are some half a dozen other “thou shall nots” surrounding the new logo, all of which are virtually unenforceable rules that won’t endear the company to anyone but lawyers.

Perhaps Twitter just forgot that this is the internet. Whatever the case, there are, as you would expect, no shortage of sites and images mocking Twitter’s rather draconian new guidelines, including our favorite, ViolateTwitterBrandGuidelines which will help you willfully violate all of Twitter’s rules. There are also quite a few logo parodies popping up including this awesome (rotated, tsk tsk) Batman version.

Theoretically it should be possible to create the Batman version of the Twitter logo in pure CSS, which we’d really love to see. The first person to do so will win the internet ( and a Webmonkey baseball cap if you email us).

[Update: I’ve got two submissions of a pure CSS Batman Twitter logo, both of which are awesome so consider that contest closed. I will send out hats ASAP. Of course you can still post links to your work and you will win the internet. For a day. Also, here’s a ton of other Twitter logo “avatars.”]