Square Animated Spinners

Image: Square Animated Spinners GIF

Here are a bunch of pure CSS animated spinners that you can use in various web design projects, designed by Natali Davydova. There are four square styles to choose from :

  1. A sruare split in to 4 triangles and each ones spins one after the other
  2. a spinning square that zooms in and out as it spins
  3. a pulsating dot
  4. the border of a square that draws and un draws itself
  5. a spinning square’s edges get cut off to become a circle

If you are having trouble with the pen, try the archived copy on GitHub

Square Animated Spinners Snippet

See the Pen CSS3 animation spinners and preloaders by fox_hover (@fox_hover) on CodePen.0

Posted by:Saijo George

Digital Marketer with a strong focus on technical SEO and design. One of the top 100 makers on Producthunt, co-organizer of the SEO Meetup in Melbourne, an instructor at General Assembly. Worked with brands like Envato, AEON. Currently the SEO Strategy Director at Supple.