Clarity: a platform game engine built with HTML

It's no Super Mario Bros, but it's amazing what 700 lines of HTML, CSS, and JavaScript can do.

Clarity is described by the author as "a simple, customizable and scriptable platform game engine." But the objective of the game isn't as important as that of the project itself. You see, Clarity was built in about 700 lines of HTML, CSS, and JavaScript.

In the game, you play a ball who navigates through various obstacles including stairs, pits, ladders, switches, trampolines, and even water. For a simple platform demo, the gameplay is actually pretty good. The ball eases as it starts, stops, and jumps. The screen pans in such a way that you'll feel like you're watching a football game. Even the physics change as you move between land and water.

This is another fine example of how powerful HTML is becoming. My only question is, when are we going to see a level editor?

Play around with Clarity on CodePen or fork the project on GitHub.


Author avatar

About the author

Creator of Surreal CMS and other web things. Follow me for tweets about JavaScript, CSS, and web programming.