Playing Card Experiment

November 18th, 2024

·

1 min read

I was playing around with CSS and Framer Motion with the interactive playing cards below as a result. The cards should respont to mousing over them, and flip over to reveal their backs when clicked.

The Rook

The Rook can move any number of squares in any direction.

Bonus: The Rook has a special move called castling.

The Queen

The Queen can move any number of squares in any direction.

The King

The King can move only one square in any direction.

Bonus: If the King is in check, it must move to the nearest safe square.

The Knight

The Knight can move in an L-shape.

The Bishop

The Bishop can move any number of squares diagonally.