Top all-time · #1929
Keith Clark
Personal blog · keithclark.co.uk/articleswebprogramming
Keith Clark's personal blog at keithclark.co.uk covers web and programming. Since 2010, 38 different Hacker News readers have linked it 45 times, most often “CSS-Powered 3D Engine (2014)”. It is still writing: the last post was on 2025-10-02, and you can follow it by feed.
Too few sampled comments (22) to say how often HN recommends it.?
Why HN links it
HN readers link Keith Clark's CSS-only 3D demos and articles on pure-CSS parallax and GPU text rendering, valued as examples of what CSS can do.
- Recommended for · 5 comments
- Called a "good description" of the parallax technique, "pretty cool", and recommended as "Start here"; one commenter said "you might like" the CSS 3D FPS demo.
Summarised by Claude from a sample of 22 HN comments that link here. Each comment is marked recommending, critical or neutral (citing without judging); how this works.
A front-end web developer based in Farnborough, UK.
Most-linked posts?
- CSS-Powered 3D Engine (2014)10 people · 10 mentions · first linked 2019-02-24
- Creating 3D Worlds with HTML and CSS (2013)4 people · 4 mentions · first linked 2018-07-05
- Pure CSS Parallax4 people · 4 mentions · first linked 2014-10-21
- A grouped pure CSS parallax demo3 people · 3 mentions · first linked 2014-10-21
- /labs/css-fps/desktop/2 people · 2 mentions · first linked 2020-02-27
What Hacker News says?
Reminds me of a couple of Keith Clark's projects from a good 10+ years back https://keithclark.co.uk/labs/css-fps/desktop/ https://keithclark.co.uk/labs/css-3d-shadows/
Comment linking /labs/css-3d-shadows/
on “CSS Minecraft”Submitted Creating 3D worlds with HTML and CSS as a story · 339 points
HN discussionTo me it looks like speed is one of the major advantages. JavaScript speed is only one thing. There is also render speed. E.g. this runs totally smoothly (with a bit of flickering (z order problems?)) in Chrome: http://keithclark.co.uk/labs/css-fps/nojs/ In Firefox it seems to have something between 1 and 5 fps and is totally glitched out. JavaScript speed is not what needs to be worked on currently. Render speed is.
Comment linking /labs/css-fps/nojs/
on “The First Browser Dedicated to Developers Is Coming”Submitted CSS-Powered 3D Engine (2014) as a story · 305 points
HN discussionMy first reaction when I saw the title was "oh, not this again", but this looks neat and the CSS source, surprisingly clean! I really enjoyed the first attempts at 3d in CSS (in pre-canvas, WebGL times). Can't find the right example, but in a nutshell, the approach involved using border-width to create triangles, and thus triangle meshes. You might like this one: https://keithclark.co.uk/labs/css-fps/desktop/
Comment linking /labs/css-fps/desktop/
on “The Simpsons in CSS”Submitted A grouped pure CSS parallax demo as a story · 129 points
HN discussionHere's an example of where CSS starts to become a bit more expensive: http://www.keithclark.co.uk/labs/css-fps/nojs/ Edit: The site seems to be overloaded. Here's an archive: https://web.archive.org/web/20160702222211/http://keithclark...
Comment linking /labs/css-fps/nojs/
on “A Single Div”Submitted Creating 3D Worlds with HTML and CSS (2013) as a story · 48 points
HN discussion> Can you imagine rewriting a modern web browser engine to use GPU-accelerated text rendering? It is tricky, but I thought they already (partly) do that. https://keithclark.co.uk/articles/gpu-text-rendering-in-webk... (2014): “If an element is promoted to the GPU in current versions of Chrome, Safari or Opera then you lose subpixel antialiasing and text is rendered using the greyscale method” So, what’s missing? Giv…
Comment linking /articles/gpu-text-rendering-in-webkit/
on “Rendering Crispy Text on the GPU”Submitted Loading CSS without blocking render as a story · 35 points
HN discussionCheck out Keith's project's page - https://keithclark.co.uk/ - and his lastest js1k entry - https://keithclark.co.uk/articles/js1k-2019-flux/final/ He's a clever guy
Comment linking /articles/js1k-2019-flux/final/
on “CSS-Powered 3D Engine (2014)”Submitted Webkit renders your content blury if you translateZ or translateX as a story · 6 points
HN discussionThis is from 2013: https://keithclark.co.uk/articles/creating-3d-worlds-with-ht... I remember seeing his old one in 2012 and spending an 8 hour plane ride with a bottle of vodka and a laptop trying to recreate the windows maze screensaver the same way. (Needless to say, the vodka was the only winner)
Comment linking /articles/creating-3d-worlds-with-html-and-css/
on “CSS-Powered 3D Engine (2014)”Submitted 3D FPS concept using HTML and CSS3 as a story · 6 points
HN discussionhttps://keithclark.co.uk/labs/css-fps/desktop/
Comment linking /labs/css-fps/desktop/
on “The World of CSS Transforms”Submitted A 3D FPS engine using HTML5 and CSS3 3D transforms by Keith Clark as a story · 4 points
HN discussionVery nice! Reminds me of the work of Keith Clark ( https://keithclark.co.uk/labs/css-fps/ ) I also experimented with 3d rendering with just CSS a few years ago. The result came out pretty nice (desktop only I'm afraid): https://www.michaelbromley.co.uk/experiments/css-space-shoot...
Comment linking /labs/css-fps/
on “Show HN: 3D first person game rendered in CSS/HTML”- _s · 2015-03-25
Submitted Pure CSS Parallax as a story · 3 points
HN discussion > HTML and CSS are content, not software (they're not executables) - they're like DOC or PDF. Well… https://keithclark.co.uk/labs/css-fps/ You could also argue that DOCs and PDFs are software.
Comment linking /labs/css-fps/
on “My Talk at Microsoft”Submitted Single Element Pure CSS Pie Charts (2018) as a story · 2 points
HN discussionI was talking about HTML5 demos posted on HN. Like this one that DOES use CSS: http://www.keithclark.co.uk/labs/css3-fps-new/ Granted, it's a terrible abuse of a CSS, but it's also a perfect example of how I'm supposed to be wowed by a buggy HTML5 demo my PC could render better in every way 15 years ago. And no one has answered my question yet. What benefit does HTML5 bring me as a gamer? Why are HTML5 games better…
Comment linking /labs/css3-fps-new/
on “Artillery is building a hardcore RTS with HTML5 and WebGL”Submitted HTTPS: //keithclark.co.uk/articles/creating-3D-worlds-with-HTML-and-CSS/ as a story · 2 points
HN discussionUsing pure CSS to make a 3D "game engine": https://keithclark.co.uk/labs/css-fps/
Comment linking /labs/css-fps/
on “Pure CSS Website”Submitted Creating 3D worlds with HTML and CSS (2013) as a story · 2 points
HN discussionSome of these things are actually pretty cool IMO, like http://keithclark.co.uk/articles/pure-css-parallax-websites/... from https://github.com/you-dont-need/You-Dont-Need-Javascript#Pa...
Comment linking /articles/pure-css-parallax-websites/demo3/
on “You Don't Need”Submitted Pure CSS Parallax Websites as a story · 2 points
HN discussionStart here. http://keithclark.co.uk/articles/pure-css-parallax-websites/ http://keithclark.co.uk/articles/pure-css-parallax-websites/... .. http://lmgtfy.com/?q=vertical+parralax+css+template
Comment linking /articles/pure-css-parallax-websites/demo3/
on “Winklevoss Twins’ Bitcoin Exchange”Submitted Elegant explanation of how to do parallax in CSS as a story · 2 points
HN discussionThe associated article gives a good description of how this effect is achieved: http://keithclark.co.uk/articles/pure-css-parallax-websites/ I find it interesting that parallax was initially a way to fake 3d-like effects, and now we're using 3d effects to implement parallax!
Comment linking /articles/pure-css-parallax-websites/
on “A grouped pure CSS parallax demo”Submitted A 3D environment with lighting, shadows built with CSS transforms as a story · 2 points
HN discussion