3D chess built entirely with CSS

3D CSS Hartwig Chess Set is an interactive chess game built entirely with CSS. There are four different themes available, and the chess board rotates with your mouse movements. It’s an amazingly cool example. Particularly helpful is the guides that show up on the board when you click on a piece, that show you possible moves. It works best in Chrome or Safari.

@juliangarnier made this beautiful Chess set.

3D CSS Hartwig Chess Set

You can play it here - http://codepen.io/juliangarnier/full/BsIih

Update: 24th December 2012

I loved the  minimalist design of the chess board. Initially I was under the impression that it was created by Julian, however I came across this photo today which made it clear that this is a bauhaus design created a long time ago. Further digging revealed this amazing thought put behind the design:


The beautiful chess pieces were designed by Josef Hartwig all the way back in 1923.  The Bauhaus Chessmen, are a great example about minimalism and simplicity in design, but above all a perfect example of applied symbolism.

Each piece is shaped as a combination of cubes, cylinders and balls, representing the way they move on the board. For example, the queen is shaped with a big cube with a ball on representing it can move on any direction.

Another touch of minimalism: the board itself does not have a frame: it’s just the checked field.

via Minimalissimo

Related posts:

Let's keep in touch! We share tips on how to get the most from your website.