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
 
Sloan, the sloth mascot
Comment deleted
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.