98.css – design system for building faithful recreations of Windows 98 UIs

(jdan.github.io)

838 points bennettfeely | 2 comments | 21 Apr 20 23:51 UTC | HN request time: 0.522s | source

Show context

JansjoFromIkea ◴[22 Apr 20 11:47 UTC] No.22944549[source]▶

Hey man, if you're looking for the fonts I had them on a similar thing I done a while ago. Only normal size unfortunately https://github.com/padraigfl/packard-belle/tree/master/src/_... Cant remember where I sourced them from but it's probably in the code somewhere, the MSSansSerif ones are pixel perfect as far as I'm aware. It outputted CSS to be used independently but it was very much a secondary concern, pretty sure I'd be the only person who knows how to use it without backtracking from the react bits https://github.com/padraigfl/packard-belle/blob/master/css/w... the data-uris might be useful, will have a look through your issues to see if I can help with anything!

Here's the attempt at a Windows 98 recreation I done with it feel free to take whatever from it:

http://packard-belle.netlify.app/

Tried doing a design system thing too but got lazy:

http://packard-belle.herokuapp.com/

replies(2): >>22945692 #>>22947482 #

1. gmmeyer ◴[22 Apr 20 16:42 UTC] No.22947482[source]▶

>>22944549 #

This looks so good, especially the fake monitor effects

replies(1): >>22948033 #

2. JansjoFromIkea ◴[22 Apr 20 17:29 UTC] No.22948033[source]▶

>>22947482 (TP) #

Thanks! Funnily that bit caused big issues for most my friends I showed it too, was definitely a case where rigidly straining to try and be _authentic_ clashed with the way most people remember things. There's an option to turn it off, I think (maybe not on mobile)

Stole that filter off codepen mind, nowhere near that clever... this one but toned down a bit https://codepen.io/lbebber/pen/XJRdrV

↑