Hacker News

276

Show HN: A CSS-Only Terrain Generator

by rofko176226471575 comments
When I turn off JS, it shows a loader instead of the terrain. Is this really CSS-Only? I mean it's still a high achievement even with JS, but was expecting it would also work without JS. This one, for example, truly works without JS https://benjaminaster.com/css-minecraft/ .
by senfiaj1762276627
Wow this really feels like roller coaster tycoon!!! (I can see lots of people refer to this to their favorite sim game though)

Great work!

by forthwall1762270826
Lots of javascript for a "css-only" tool. Looks like just the rendering is css-only.
by cmiller11762271024
This is incredible - looks like SimCity 2000.
by julius-fx1762270434
Reminds me of Populous!

Very cool

by mpeg1762268107
I've used a few terrain generators before but I think this one might be my favourite. Obviously the fact its a "CSS only" demo project restricts things a bit, but its got enough going for it regardless.

It actually comes at a really good time for me, I'm currently trying to make the transition from 2d game dev to 3d and things like this are really helpful.

by bodge50001762274245
Really cool, especially when I realised you could rotate the terrain and do some zooming as well.
by paulbjensen1762273402
Impressive, but there is a noticeable lag after modifying the terrain or moving the camera. Is there a way to know if the browser is using the GPU or CPU for rendering, and is there are way to see the milliseconds per frame?
by em3rgent0rdr1762274938
for those interested in more CSS-Only art, Lynn Fisher makes some neat stuff

https://a.singlediv.com/

by kataqatsi1762293309
Really reminds me of openttd, especially the sandy border around the water

Looks really cool and runs great on my phone.

Seems like there's some kind of rendering bug in the corners sometimes causing the walls to intersect the grass

by RugnirViking1762269487
I got some rendering issues, but otherwise very cool !

https://i.imgur.com/qT6ozyh.png

Firefox 144.0.2, Windows

by w4yai1762270962
It is giving Sega Genesis "Populous" vibes.
by throwaway20371762274774
Dark Reader mutilates the rendered output, but only certain tiles. No clear pattern as to what tiles get mangled. Peculiar.
by ryukoposting1762271319
1. what's a layou tit?

2. does it sometimes raise / lower by 2 units?

3. the "flatten" tool is missing.

by stefs1762272347
This is super cool! Wonder how hard it would be to use with an RTS game.
by hersko1762273739
Amazing job by an amazing developer!
by iagorodriguez1762272680
Very cool! Do you think it’s possible to do lakes and waterfalls?
by nefarious_ends1762274660
Nice! Now do collision checks ;)
by cluckindan1762269564
This is really cool.
by robertheadley1762270958
Impressive work
by worldai1762275912
This thing is killing my CPU, what's the actual bottleneck here for CSS? Is it the number of elements visible and rendered at once? Is it the calculation engine backing CSS is super slow? Or just that most of the work is being done on the CPU it seems (on my machine, rotating around the map, my integrated GPU goes to 20% but CPU stays around 40-50%).
by ModernMech1762273084
Can someone please reimplement something like Warcraft 2 on a mobile web device?

It would be a hit, I’m telling you. Even from 1995.

Some people are still playing it 30 years later, obsessively.

And myth ii by Bungie is a classic too

by EGreg1762272531
looks sick! great job :)
by jimmydin71762267984
Crazy that vibe coding can make things like this now! 2026 going to be crazy! There is no AI bubble
by OldGreenYodaGPT1762271961