Get a free trial // Grow your CSS skills // Land your dream job

Animation on Logo

  • # October 9, 2012 at 4:06 am

    G’day everyone,
    How’s going?
    I hope you all are fine.

    how to create animation on logo like this?

    I want to get this kind of animation on my logo.

    Please advice.

    Have a wonderfulday

    # October 11, 2012 at 11:59 pm

    html5 canvas. there are a bunch of books and tutorials on it.

    # October 12, 2012 at 3:44 am

    In photoshop we can create animated gif image. You can use it.

    # October 12, 2012 at 6:53 am

    Hi therockstar,

    We can create gif files from flash also. I think it is very easy to created this type animated logo in flash.


    # October 12, 2012 at 7:05 am

    I would have to think that an animated gif of that complexity would have a huge file size. Not recommended.

    # October 12, 2012 at 8:45 am

    therockstar, take a look at using canvas in javascript and css3 or jquery to play with the animation, canvas will help you with the design of the logo, the only problem it´s that internet explorer doesn´t support it.

    # October 12, 2012 at 8:51 am

    It seemed to work in IE9 this morning on the example link but perhaps that was a poly fill.

    # October 18, 2012 at 3:26 am

    @elneco @vanilson could you guys recommend me any good book title for canvas animation?

    # October 18, 2012 at 3:27 am

    @Paulie_D @kunjan @davikerkrish guys i don’t want to use GIF i can consider to use Flash but problem is Flash is not compatible with apple IOS devices =( seems like i need to learn canvas animation =)

    # October 18, 2012 at 3:51 am

    You can animate a logo using Flash. There are so many ways using which you can create a simple logo with an animation effects.

    # April 27, 2013 at 7:00 am

    A really great tehnique is the one that incorporates [a really big image]( “foxtail”) and background position changing, probably using a small script. I first saw it on [this]( “Mozilla Firefox partners”) page, go and check it out in motion.

    # April 27, 2013 at 9:19 am

    Old topic, but the background position technique is the one I’m using here:

    To make it responsive I had to drop IE8 support, I think a logo doesn’t need to be responsive so if anyone wants I can adapt the script to get IE8 support.

    # May 22, 2013 at 4:23 am

    The user and all related content has been deleted.

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed