Try it! https://shoot-target-css-game.netlify.com

This game is made entirely with HTML and CSS. Shoot as many targets as you can!

It has been made thanks to this amazing CSS features:

• Counters
• Custom Properties
• Custom cursor using an SVG data url
• Animations and the ability to pause them with animation-play-state
• :target pseudo-class
• Radial Gradients
• pointer-events

If you wanna read how to build this game step by step read the post I wrote for Octuweb 2018 (in spanish).

I made the first version of this game for the Alicante Codepen Meetup on December 12, 2017. It's hosted on CodePen.

Then, I made a second and improved version of the game on October 1, 2018 for the "🎯 HTML + CSS dan mucho juego" (in spanish) article published in Octuweb 2018. It's hosted on CodePen.

This final versions has a couple of tweaks but it's pretty much the same version than 2018.

Improvements

• Add link to restart game

License

MIT

Made with ♥️ by Aarón García Hervás