DEV Community

Cover image for Desert Racer 🏜️: World's First CSS-only Swipe-Aware Game!

Desert Racer 🏜️: World's First CSS-only Swipe-Aware Game!

Philip Warkentien II on March 27, 2024

A CSS-only, no JS, no checkbox, swipe-aware (scroll-aware) game. With config options and music! Intro I built Desert Rac...
Collapse
 
grahamthedev profile image
GrahamTheDev

Great article and some interesting tricks in there! Love it. 💗

Collapse
 
edememediong1 profile image
Emediong Bassey

Bro just entered god-mode

Collapse
 
warkentien2 profile image
Philip Warkentien II

😂 Thanks!

Speaking of "God mode" there's a hidden phase in the game that only by using a trick hinted on phase 4 can you beat it.

Collapse
 
edwineinsen profile image
Einsen Vásquez

Amazing work! Like you say creativity and skills are not yet obsolete! And AI can wait for a time to reach us in that aspect.

Collapse
 
algorodev profile image
Alex Gonzalez

Congratulations for achieving god mode!

Collapse
 
diegochiola profile image
diega

so good!

Collapse
 
vikkrantxx7 profile image
Vikrant Sharma

Great ideas and skills.

Collapse
 
swatibadola profile image
Swati Badola

Interesting. Learned something new. Surely trying it!!❤️🙌

Collapse
 
gami13 profile image
Marcin Czechowicz
Collapse
 
warkentien2 profile image
Philip Warkentien II

Similar because it has a car and a road? Then we are both "ripping off" Sega Turbo 1981.

Now if you are wondering if these projects are similar in mechanics, they are not.
Alvaro is showcasing a simple position-aware trick by replacing the cursor with a car, and is checking for :hover. This game is swipe-aware, state-aware, can be played on mobile, and doesn't rely on :hover at all – there was no out-of-the-box CSS pseudo-class I could simply use to detect collisions.