Last year I spent some time playing with CSS trying to make some exciting things. Especially recreating image graphics with CSS. This inspired me to recreate my company's (DuetHealth) logo with CSS.

This is how original logo looks like

To be honest it took me few trial and error to come up with exact design rules. I also had to use Online color picker tool to extract desired color codes from logo. That worked quite well too.

Code itself is very small. I used WebStorm to write code on my local machine. It was fun 2 hour project including initial settings and nit picky changes.

I have created a repo on GitHub Here. I would love to hear if the code could be improved in any way. Just so it is easy to present, I have hosted code on JSFiddle Here.

This is how logo recreation looks like

You can find the full source code on JSFiddle. Please check it out here