This is a gorgeous yet simple and elegant template for 4xx and 5xx HTTP status code error pages. It features a dark, "hacker"-like atmosphere with the incredible Iosevka font and a glitch effect in pure CSS. The font has been stripped down to the ASCII character range to keep the size reasonable (~17KB vs ~1MB).
Additionally there is a JSON with error information and a small build script to put the information into the template. All client and server error codes listed in MDN are covered. 420 is also included just because 😎.
 |
 |
 |
|---|
Click on the GIF to get to the full page. Note that these examples slightly differ from the template in this repository. You can find more at https://kippi.at/public/errorpages/.
I've spend the last few days completly overengineering HTTP status code error pages. It started with me wanting an aesthetic 404 page with a glitch effect and generally a bit of "cyberpunk" and "hacker" vibes while still being simple and JS free. It ended with me (who is usually not that good at design stuff) creating a crazy good looking page, writing kind of a "template engine" (more like a wrapper around Python's string.Template, lol) and modularizing the page so that I can create one with the same design for every HTTP error code. The result is the template and JSON file you find here.
To build the pages just clone the repository and run the build.php script. It will create a new folder pages in the current working directory and put the resulting pages in there.
$ git clone 'https://github.com/AntiKippi/errorpages.git'
$ cd errorpages
$ php build.php
If you want to customize the error pages and need a more advanced and flexible build method, check out templator.