3D CSS Animated Dice

Published on 6/1/2016

3D CSS Transforms and Animations

As an experiment, I decided to create a 3D dice cube in HTML that will roll a random number when clicked. The cube is composed of 6 separate layers that make up the six different sides of the dice. When the dice is clicked, a random number is chosen and the dice cube is assigned an animation that will make it appear to "roll" to that number. It was a lot of fun to make, and even more fun to play with!