mac style dock menu

Create Mac Style Dock Menu – CSS Example.

I have seen a lot of websites trying to mimic MacOS components.

Most of them use jQuery to make Mac docks.

So I was thinking about making one only using transitions and transform elements.

In this live example ill show you the mac style dock menu created with CSS only .

Absolutely no JavaScript used.

Of course it has a bit different look and feel in every browser, but it will help you get the basic idea.

Feel free to Fork it on CodePen and use it as you wish.

Mac Style Dock Menu :

Check out this Pen!


You can check also some cool CSS text animations effects  here


If you liked this article please share it on your social networks.


Nikola Petrovic
Get in Touch

Nikola Petrovic

Hi there. My name is Nikola,
I speak English, Greek and Serbian.
As a Web Producer i can deal with almost anything web design & development related.
As a freelancer, I charge only a small portion of the money you would pay to agencies to create your website. Affordable web design doesn’t mean that it will lack any of the advanced features of today’s web technology. We just cut out the cost of the middle man.
Feel free to request a free quote using the form on the right or the one bellow.
Nikola Petrovic
Get in Touch