10 ms·
Show HN: XP.css – Windows XP CSS file and framework for building GUIs
- olq 6y agoPeak UX! Damn I miss it
- quickthrower2 6y agoI miss the old start menu. I now have to remember the complete names of programs I have installed, as win 10 search won’t find partial matches all the time
- smitty1e 6y agoPin to the star menu?
- shawa_a_a 6y agoAfter using Windows 10 for a while I grew similarly fed up. I found OpenShell [1] to be a very faithful replication of the old start menu I'm used to from XP and before. 1: https://github.com/Open-Shell/Open-Shell-Menu https://github.com/Open-Shell/Open-Shell-Menu
- nivethan 6y agoThanks! Reskinned to look and act like xp. Hopefully I’m not getting stuck in my ways...
- LargoLasskhyfv 6y agoI'm using that too, but under W7 in classic aka W2k-look.
- spideymans 6y agoI’m still stunned at how bad Windows search is. They’ve been trying to get this right since they begun development of Windows Vista nearly 20 years ago. Meanwhile in OS X land, their 16-year-old search implementation has always been so good that in a lot of cases, the file manager isn’t necessary to find even the most obscure and poorly organized documents.
- bmn__ 6y ago> They’ve been trying to get this right Company politics interfered with the work on database as file system, one of Longhorn's greater ideas. I can't remember the specifics, it's on Slashdot somewhere, can't find it anymore. > their 16-year-old search implementation … is Giampaolo's 22-year-old implementation. http://enwp.org/Dominic_Giampaolo http://enwp.org/Dominic_Giampaolo https://arstechnica.com/information-technology/2018/07/the-beos-filesystem/ https://arstechnica.com/information-technology/2018/07/the-b...
- Fannon 6y agoThis is something that is really puzzling to me, how such a basic and useful feature can be broken for years. It's annoying me since the release of Windows 8. Keyboard Launchers like Keypirinha (also used Launchy back in the days) are my current workaround. They can index what the start menu should be indexing and do it right. I also keep my own (synced) folder of shortcuts that I add to the indexing.
- mrighele 6y agoI still think that the UI of Windows 2000 was better. Windows 2000 had also better usability for keyboard users since you can be extremely productive without a mouse. I think it is the last versions where they really cared about keyboard users. For example latter versions added extra information to Explorer and that had the resukt of requiring extra keystrokes to move from the path bar to the file list. Anyway I am digressing... I came here to say that while the Css is very cool, it seems to introduce strange delays. On my android phone actions on tabs, checkboxes and radio buttons give a result at least one second after i click them.
- mehrdadn 6y agoI loved the Media Center Edition theme :-)
- Multicomp 6y agoDon't forget the zune theme with the orange start button and the black taskbar! Edit: or the embedded blue theme!
- karateka 6y agoBeautiful! I've added it to my list of retro css: https://github.com/matt-auckland/retro-css https://github.com/matt-auckland/retro-css
- someperson 6y agoYou might enjoy: https://news.ycombinator.com/item?id=23129434 https://news.ycombinator.com/item?id=23129434
- znpy 6y agothose repository might be better with more screenshots
- mdre 6y agoFinally! Someone made a list on Github that's not Awesome.
- parkovski 6y agoI know the awesome meme seems overdone, but it's cool that you can search that one word and see curated lists of interesting/high quality projects.
- theandrewbailey 6y agoWow, that's awesome! Title bars are a bit thick. Take off the min-height, and you're practically there. The title bar gradient seems a bit off, but unless you're looking at an XP VM, no one would know.
- root670 6y agoThe fade when hovering & clicking the minimize/maximize/close buttons in the title bar should be removed, otherwise pretty neat.
- pmalynin 6y agoLooks good, but seems to be really broken on my iPhone. The checkmarks float below the checkbox, and the slider also seems to have a check mark in it.
- bawolff 6y agoThis is cool, but To me, the 98.css rocks more. It feels like a more clear and consistent ui. I wonder if that's really true or if its just ny nostalgia for what i had as a kid. Probably the latter. Nonetheless, props to the author
- soylentgraham 6y agoThis is what I think too, but the amount of people I hear that say XP was the best windows makes me wonder, do the more colourful buttons, lighter backgrounds, (maybe not rounded edges?) make for a better UI than win95 ultra-consistency (very grey, X not highlighted)? Can any proffesional designers chip in? (Win2k was the peak windows, although using win3.1 web emulators to play solitaire is my peak nostalgia)
- toyg 6y ago> the amount of people I hear that say XP was the best windows makes me wonder It's just a function of generational popularity IMHO. Windows XP broke into the mainstream in a way that 98/2000 had not, for a number of reasons. It was literally garish, but between people looking for a "wow" factor after years of grey borders, and the increased amount of total desktop users, more people loved it right there and then than anything that preceded it or followed it. I wouldn't extrapolate any big theory of design from this phenomenon. As a long-time Windows user at the time, I can say that "the dream" back then was OSX.
- marakv2 6y agoWow, that's awesome. I'd also forgotten how nice the interface was of xp.
- Reelin 6y agoI really liked it as well. Most systems are more functional in one way or another these days but somehow nothing ever seems to achieve a look and feel on par with XP (IMO). It was a sad day when regular security updates for it stopped.
- deleted 6y ago[deleted]
- rapind 6y agoI like everything but the font. The dropdowns in particular are superior to browser defaults.
- vsskanth 6y agoThis brings back so many memories! I hope there is a windows 7 css out there. Every time I have to use UWP apps I feel really sad and angry about how much Windows Desktop UI has regressed.
- Multicomp 6y agoI know what you mean, I get that skeuomorphic was overdone in a lot of places but, the remedy may have been worse than the disease since we have had such regression in UI design that it now looks somewhat like high-dpi versions of text user interface graphical blue blocks everywhere.
- vsskanth 6y agoEven worse actually. text user interfaces had contrasting backgrounds between different controls. It took me a while to learn the large-text-as-a-tab style in Metro UI. It's not just the flatness that irritates me, there is such low information density, so much white space and large text sizes it feels like using a blown up tablet app.
- userbinator 6y agoit feels like using a blown up tablet app. That's because that was precisely what it was intended as --- the idea was to use the same UI on both desktop and mobile, and unfortunately they picked the latter instead of the former to build upon. The former would've resulted in something more similar to WinCE.
- ComputerGuru 6y agoI think WinCE fell victim to the technology of the time. I believe today’s higher precision and lower effort capacitive touch screens would have reduced much of the issues that plagued its usability with its crappy resistive touch screens and styli.
- voldacar 6y ago
- sebyx07 6y agoI think this was build too late..
- ComputerGuru 6y agoIt’s honestly great - it’s what I was hoping someone would make when the 98.css made it to HN - but does the kerning have to suck? What’s wrong with beautiful typography that’s not constrained by the DPI of the 90s?
- freeone3000 6y agoThe kerning is part of the font, which is part of the experience.
- behnamoh 6y agoYes, HN with XP, 98, and old OSX CSS would truly be awesome.
- yreg 6y agoThis article highlights the importance of the "shitty" typography. [0] article: https://vistaserv.net/blog/90s-fonts-modern-browsers https://vistaserv.net/blog/90s-fonts-modern-browsers [1] discussion: https://news.ycombinator.com/item?id=23129434 https://news.ycombinator.com/item?id=23129434
- shivekkhurana 6y agoIs there a macos alternative? A mac like UI is something I'd personally be happy to use in prod.
- sdwvit 6y agoBroken in safari ios
- zmix 6y agoOuch! This just came 15 years too late for me. I would have loved this in Windows XP times to style MS HTML Applications (HTA). Anybody knows of some (preferrably simple, preferrably outside of any UI framework) Windows 10 CSS style, that is free?
- smnrchrds 6y agoFor what it's worth, it may be impossible to implement this using CSS features no more recent than 2005.
- kn0where 6y agoI’m imagining some horrible <table> layout now.
- plorntus 6y agoDoesn't really fit your 'outside any UI framework' requirement but there is http://reactdesktop.js.org/ http://reactdesktop.js.org/ Does a pretty good job at mimicking both Windows 10 and Mac OS. If there isn't a CSS framework someone else can link you to then you could either just use react (providing it's a project where that sort of decision doesn't affect anything) or attempt to take the CSS styles from this project.
- worble 6y agoWhile its not exactly Windows 10, MIcrosoft's design system is called "Fluent UI"[0] which includes what they use for the Web. It features a similar flat UI but isn't exactly a copy of Windows 10, it does it's own thing. The components are also unfortunately tied to React. [0]https://developer.microsoft.com/en-us/fluentui#/ https://developer.microsoft.com/en-us/fluentui#/
- zmix 6y agoIf I display the page in 90% size, the images are become dirty. If I enhance to >100% they seem to be fine.
- pix64 6y agoFont scaling on "Pixelated MS Sans Serif" is terrible in Windows (both Firefox and Chrome). This does not look correct on a high dpi monitor.
- speedgoose 6y agoGreat work! It's interesting to see that Windows XP's blue and gradients design didn't age well compared to Mac OS X's blue and gradients.
- captainmuon 6y agoWell, you have to compare it to early 2000s Mac OS with Aqua pill buttons and pinstripe background.
- chj 6y agoI always used classic in XP, that said, anything not win10 is welcome.
- CawCawCaw 6y agoFantastic! Going to use this in my next project.
- hnarn 6y agoThe checkboxes don’t seem to render correctly in Safari (iOS).
- behnamoh 6y agoIt's awesome and nostalgic! Just one thing: the scroll bars should change color/brightness when they're hovered/clicked.
- yreg 6y agoThis one also includes a styled Dropdown, which missed from the 98 one.
- butz 6y agoTreeView lists should have selected state for items, otherwise it's very accurate.
- swiley 6y agoYou can almost hear ticks and shwoops from XP! That’s fantastic! I wish the scroll bars worked on mobile but that probably needs JS in addition to the CSS.
- emdowling 6y agoSo nostalgic and brings back many memories of my teenage years. I had way too much time when Windows XP was being built - would hang out on IRC and download leaked new builds every week or so. devils0wn is forever embedded in my memory (if you know, you know). It was such a fun time, downloading new builds, installing hacks to disable product key checks. A golden age.
- toastal 6y agoI appreciate that the dropdowns are native so they actually work on mobile. I think the treeview (and others) however should select off of the aria roles for this kind of widget to enforce accessibility.
- TazeTSchnitzel 6y agoI have tried before to recreate the 95 UI in CSS. I didn't release the results but I was quite happy with what I managed. Honestly, I should probably contribute to these projects. Annoyingly, certain parts of the Windows UI cannot be recreated with just HTML and CSS. One of these is how focusing works. I don't know what the proper names for it are, but Windows has two kinds of focus: • Dotted line (or flashing cursor for text boxes). If you press space bar, something will happen with this element. • Black outline around the outside. If you press Enter, this button's action will be triggered. This is why the OK button in a typical Windows dialogue box looks different to the Cancel button. I don't remember what this looks like in XP but I think it uses a thicker blue border. However, the browser only really has the former kind of focus — even for HTML buttons in Internet Explorer on Windows 95! So if you want a full Windows-like look and experience, you need some JavaScript to emulate the second. I notice that XP.css lacks this kind of focus, and I think that's why it feels like something is missing from the buttons.
- ptx 6y agoThe first kind is the input focus and the second kind is the default button in a dialog (not really a kind of focus): "If the button is in a dialog box, the user can select the button by pressing the ENTER key, even when the button does not have the input focus."[1] [1] https://docs.microsoft.com/en-us/windows/win32/controls/button-styles#BS_DEFPUSHBUTTON https://docs.microsoft.com/en-us/windows/win32/controls/butt...
- TazeTSchnitzel 6y agoI feel like it is almost its own kind of focus because that state can be lost, though I don't remember how. Multi-line text boxes maybe.
- ptx 6y agoYeah, there are definitely some non-obvious details in its behavior. The default button focus moves with the input focus to other buttons but reverts to the default default button if you focus another kind of control. Raymond Chen has an explanation: https://devblogs.microsoft.com/oldnewthing/20040802-00/?p=38283 https://devblogs.microsoft.com/oldnewthing/20040802-00/?p=38...
- znpy 6y agothe most surprising thing is how readable the whole webpage is. really a good testament to the user interface of windows xp.
- mathiasrw 6y agoIf we could get a windows 2000 version of this I would 100% use it for real projects...
- Jaruzel 6y agoWill the 98.css version do? https://github.com/jdan/98.css https://github.com/jdan/98.css
- crizzlenizzle 6y agoI love it. I’m sure we can also get a Vista theme using things like https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-fi... some time.
- hawski 6y agoIt's strange, but I like it now much more then 18 years ago. Though this sharp blue is still not my style.
- rutchkiwi 6y agoMy company, an online pharamcy, actually works with more than one supplier whose website has some elements looking like this. You can tell they definitly didn't do it for a nice retro feeling though.. sigh
- ddevault 6y agoNice! Windows XP was peak UI design, I wish we'd make more UI's like it today.
- charles_f 6y agoNow you've got the tool to fulfill your wish
- mhd 6y agoReally? I thought it was quite garish, plastic-y, especially the blue version. I still think that in the Windows timeline, original Win95 (with actual toolbar buttons) was the best. It got all "designy" with each official iteration afterwards, but at least the progress of time meant that the weird third party shenanigans died out (like Borlands(?) huge buttons with the cross/checkmark). Switching back to 9x looks, moving away from Nappa and installing a real file manager was always on top of my list when switching to Windows.
- Fiveplus 6y agoWindows XP was peak windows aesthetic without compromising usability. The toolbars, icons, Taskbar and everything in between was the right balance of style and functionality.
- dingo_bat 6y agoIs it just me or does Win XP look amazingly beautiful compared to the flat boring shit we have now?
- vehemenz 6y agoIt's slightly unsettling to see the default window theme of XP to be used for this. Most users of XP (at least in my experience) changed the theme from "Royale" to "Windows Classic" immediately and never looked back. Except for your parents or those people in your office who didn't know what they were doing and wanted to look at goofy colors all day.
- MartijnBraam 6y agoNah the zune theme is where's it's at. That black and orange theme was the best