I have an idea for the aesthetics of my website. Going with a theme, I'd like to take a picture similar to this and put the text of my within the monitor. Does anyone know of any way in to make it distort slightly so it looks like it's on a screen instead of a flat screen while being simple text and not a picture? I'd like it to feel like visitors are using a

My site:

· · Web · 1 · 0 · 0

@gbrannan217 depends exactly on what effects you want. You can use text-shadow and blur to add CRT style phospher glows but if you want to mimic CRT screen curvature, you're out of luck without resorting to using something like webgl to render text and applying shaders, etc, but that won't be very accessible, nor will it be very easy to work with

@gbrannan217 there is some nice examples of text styling here but screen deformation is going to require a radically different approach

@meandeef @gbrannan217 if you wanted to go really hardcore, you could write your website as a BBC micro application and then run it in a web-page based emulator like: - with some modifications, you could even make the html canvas it uses do all the CRT effects and screen deformation you want :D

@meandeef @gbrannan217 I used one back when I was in middle school, that and some Acorn Electrons. I expect with some minimal hacks to the emulator, you could make it so you can 'follow links' in your BASIC app, which would just load a new .BAS file into the emulator - allowing you to code multiple pages that all can link off to each other, etc.

@darkliquid @gbrannan217 think I’m sticking with just the CRT CSS but thanks 🙏🏻

@meandeef @gbrannan217 no worries - going down the emulator route is crazy work for minimal payoff (plus you lose a bunch of accessibility again). Fun though, if hacking javascript bbc emulators in the browser is your idea of fun :D

Sign in to participate in the conversation

A Mastodon server for RPG folks to hang out and talk. Not owned by a billionaire.