Me Writing Reading

Pixelated stacked text with CSS


I’ve been learning a ton of CSS lately thanks to The Joy of CSS course. I wanted to see if i could create some cool text effect of a pixelated text with layers to make it have a depth.

Turns out all i needed was using relative-absolute combo for positioning, z indexes for the corrcet stacking context and a pixelated font. It was easier than I thought.

I even tried some animations on it.

Very happy with the result. Not sure I’ll use it but looks good. Next step is to get deeper into pixel art. I really really really want to make a ui similar to Athena crisis which is an open core game developed entirely with web technologies! I wouldn’t be making a game of course, but the desktop UI of codereader.dev instead.