Playbit CSS keyboard

A few days ago Rasmus Andersson announced Playbit, “a computing environment which encourages playful learning, building & sharing of software”.

On the bottom of the page you can see a fun little keyboard, apparently inspired by this old calculator.

I went ahead and implemented it with HTML/CSS on Codepen in about 45 minutes:

See the Pen Playbit CSS Keyboard by Nacho Toledo (@iign) on CodePen.

This is the original illustration:

There are a couple of subtle shadow details that could definitely be improved, but I think the result is pretty cool for under an hour of CSS hacking.