These simple animated bullet points will brighten up any webpage. Make them in any colour or style you want to match your website’s design

Step 1

Open up Animation Shop and paste the image below into it, or open up a 5 x 5 (pixel) image, and use the line tool (Line to draw around the edges:

Jasc Animation Shop Animated Bullet Points Tutorial

Step 2

Zoom in (View > Zoom in by 5) and use Flood Fill to colour the middle of your animation.

Step 3

Right click and copy, then paste ‘after current frame’. Do this a few more times until you have 3-5 frames, then use Flood Fill to colour them all individually:

Jasc Animation Shop Animated Bullet Points Tutorial

Step 4

Simply save your animation, and upload to your site, then use a regular image code to add them to a page, or see my CSS tutorials to add them as an <li>. This is mine:

Jasc Animation Shop Animated Bullet Points Tutorial Your list here
Jasc Animation Shop Animated Bullet Points Tutorial Your list here
Jasc Animation Shop Animated Bullet Points Tutorial Your list here
Jasc Animation Shop Animated Bullet Points Tutorial Your list here
Jasc Animation Shop Animated Bullet Points Tutorial Your list here