Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: Cs16.css – CSS library based on Counter Strike 1.6 UI (samke.me)
806 points by samke- 5 days ago | hide | past | favorite | 140 comments







I like it! But how would you describe this one? This collection is meant more for tight/inspired themes. But I also included https://bootstra386.com/ which is on the edge too so I'm not against including this

That Bootstra386 reminds me of the Mosaic web browser. Not sure if that was the "feeling" behind it, but it feels like the early internet days.

Geocities is infamous.

ohhh that's what the geo is in reference to. Awesome, thanks!

Still a bit of a gray area because there's not set "geocities" or "myspace" style, but I'll include stuff like this for now


Wow, this takes me back! I remember visiting pages like this in the early 90's while rendering fractals in Fractint. I remember following a bunch of Geocities pages that looked at Pink Floyd's The Division Bell album, and there being a hidden meaning. Turned out to be created by the record company, but as a high schooler on the early internet, I was fascinated with it.

https://en.wikipedia.org/wiki/Publius_Enigma


I can smell that windows 98 theme, the gray plastic and the rubber mouse ball that used to get schmootz in it.

For a better experience, please clean the rubber mouse ball and put it back and set your browser window to 1024x768 resolution for the ultimate experience.

Even more important to remove the dirt from the rollers that attached to the mouse ball

and update drivers to enable 24bit color depth

Gotta scratch the schmootz off those little rollers too.

That 95 theme is terrible. May as well use the 98 theme.


Thanks! I'll add this next time I post this list :)

is there a place like a rentry or github readme where you keep this list?


Ah yes, my favourite retro UI theme... Edward Tufte

This isn't really meant to be a retro UI theme list. It's just a list of CSS stylesheets with a tight theme that's a specific reference to some sort of UI

Not to be confused with design systems or UI libraries. Just CSS stylesheets


I mean, typography on dead tree is a form of UI, and very retro too!

I was watching my son play Half Life 2 recently and it occurred to me how much more real or immersive it seemed when the menus and such had this style and they look like actual computer system UI. Dated maybe, but they feel industrial and real.... and easy to use all in one.

Meanwhile many games have hyper stylized menus with flowery wingdings all over them and makes it unrealistic / a horrible experience / chore.


> Dated maybe

When current UI trends are designed to be flat and hide functionality, destroying discoverability, a key component of UX, I'd argue that "dated" is a feature, not a bug.


I mentioned in another comment that I used some very old (2.0) bootstrap for fun recently and yeah I like it better than the flat / colorless stuff.

Don’t even get me started on modern games’ menu UIs.

I got the latest CoD for PS5 like a year ago and I couldn’t figure out what the fuck was going on in the menu. Incoherent mess impossible to navigate. I felt like I was going insane.

I guess I’m just getting old.


You’re fine, the CoD UI is indeed an inscrutable mess designed to maximize “engagement.” Same for other live service type games. I think they want the same entrancing effect as stepping into a casino.

Exactly!

Fortnite UI changes constantly and is horrible to use.

Factorio has a great UI.


Glad I’m not the only one. I could barely figure out how to start the campaign.

Aside from the atrocious menu structure, they also throw all this lingo at you with zero explanation like you’re already supposed to know how everything works. Challenges? Plunder? DMZ? Season pass? I don’t even know what a “season” is! Let me play the damn game!


I gave up on the game when the person next to me exploded into confetti… Is it really too much to ask for an Unreal Tournament reboot?

My favorite multiplayer game was Golden Eye 007 on N64. There was a couple of maps (The garden and the village I think) that has an unbeatable position where you just sit there and receive ammunition while having perfect view of everything. But due to being it local, you could ban camping.

Honestly, when I boot into CoD the menu is enough to make me want to alt-F4 instantly.

It is definitely not designed with PC in mind, but even on Xbox it feels horrible to navigate. Takes too long to get into an actual game and there is a constant “upsell” happening for premium things.

I miss the days of CoD1/2/4.


If you look up the more later versions of CoD on PC, you'll find that they are actually accessing the webcam and watching the user to drive "engagement", and the users are not made aware of this. I wish I had the link, but I found a YouTube video about it. I believe it started with CoD BlackOps on PC.

I’m also getting old. I tried playing a few of those mobile, micro-transaction driven, pay-to-win games to see what the hype was. I couldn’t even figure out what I needed to buy, and thus could not really play the games. Now I know how my grandparents felt seeing computers!

> many games have hyper stylized menus with flowery wingdings all over them

It can work depending on the style/tone of the game.

The real problem, in my opinion, is all the games nowadays with perfectly flat, generic, colorless UIs with absolutely no style or identity. Nintendo has been doing this a lot, for example.


I don't mind style or identity. But I want good UX with a good menu tree and clear active/inactive state and menu/background separation.

I'll be honest, I went back to some OLD bootstrap styling for some things and I liked it a lot. The candy looking buttons are nice ...

I'm done with flat and muted all the time.

Also (more to my example) it looks like a realistic UI. A lot of game stylized UI are UI nobody would ever make intentionally for a thing you're supposed to use often.

So yeah like you say just some depth and realistic UI feel goes a long way.


I liked the menu system in Crysis 2 (or 3 - not too sure).

Really made you feel like you were inside the cryosuit.


ikr, the old UIs have good affordance: whether or not the UI elements are interactable or not unlike the "modern" UIs which are kind of terrible in this aspect

Very nice! I installed CS 1.6 last year again, after almost 15 years of not playing, and now I almost play every day 10 - 15 mins against bots to clear my mind. To make it more fun I even created my own bot team and a whole tournament where I play against all the pro teams of the ±2008ties. I also rediscovered a map I created back then on a super old hard disk - never thought that with almost 40 I would still play it - so thank you past-me.

CS has always been a great mind clearer. A ranked 5v5 game is high pressure and intense, lasts about 30-45 mins, and has enough human contact to satisfy me. I haven’t found anything to replace it since I quit a few years ago.

TF2 (another Valve game) is an excellent option if you want something more casual/low stress and also flexible when it comes to time (no penalties on leaving since it’s a casual game).

Watch out for 1/2-hour ish capture-point campaign style maps, though... I wasted so many Fridays in my early 2010s doing that.

DotA is the same thing for me, though I assume you quit for a reason that would probably hold true for DotA as well. I hate how harshly CS punishes acting rashly, it really encourages you to hold angles and play methodically/strategically and I feel like in DotA I'm afforded more leeway to gamble with flashy plays. That all being said they are both brilliant games. There's something particularly appealing about the round model in CS, buy vs save rounds and the way the game gives you an opportunity for a series of rematches where you can learn from the way your opponents played the last round to try and get a better outcome is just a really compelling gameplay loop, even if I don't love it personally. (rather be playing q3dm17)

> I hate how harshly CS punishes acting rashly, it really encourages you to hold angles and play methodically/strategically

It does, but at the same time it doesn’t. If you spend as much time practicing rushing/+w as you do playing methodically/intelligently/holding angles, it works really well. Especially considering most people don’t expect it and don’t have a good counter to it since most people don’t play like that. This is true at all levels of play (except maybe tier 1/2/3 professionals teams). Check out the streamer/youtuber renyan for an example (on de_vertigo in particular). His play style worked well enough to get him to 4400 elo on faceit in csgo, so it can’t be that bad.


I have great memories playing kz_ maps for hours in 2005. The amount of skill of some people was mind blowing. Something nostalgic about the feeling of being alone in a kz map at 3am and then hearing someone else hopping around.

Ah, memories flood back of LAN or dial-up sessions with friends on custom maps like de_747 [1]

1: https://gamebanana.com/mods/82979 I still contend it is one of the most atmospheric custom maps ever made - how else do you get to role play as Gary Oldman or Harrison Ford!


I also haven’t touched CS 1.6 for 15-16 years, it will be cool to try it. Is it possible to run it on Mac M1 or I need a VM? Also, can you recommend any resources where I can read how to setup and configure bots? TY!

Recently tried running on Mac M2 and it was relatively easy: https://thatskevinjain.github.io/jekyll/update/2025/01/10/cs...

Isn’t ported to ARM64. Runs really well in Whisky though.

https://getwhisky.app/


I've been using this to play TF2 Classic on my M3 MBP and it works perfectly. I had some freezing-while-sound-skips-endlessly issues when using the voice chat hotkey, but that was resolved using WineTricks (built in to Whisky UI) to install `dsound`.

Now's a great time to start playing — The TF2C 2.2 “Double Down Update” comes out today!! https://tf2classic.com/double_down/

e: And I also had to disable macOS's default keyboard layout switching shortcuts (which I never use anyway) since I kept triggering it while crouch-jumping lol

e 2: https://news.ycombinator.com/item?id=42816545


Back in the days on lan parties there was what we called "the russian version" that only had question marks in the installation dialog (Because of unsupported fonts most likely) which had Z-Bot included.

That's probably this one: https://archive.org/details/cs-1_6_z-bot


You had the fonts, but your system was configured for cp1250 or something like that, while the installer used cp1251. So it was a text encoding issue.


You can try this browser version! https://news.ycombinator.com/item?id=34628386

Isn’t this technically the original _Steam_ UI, not just Counter Strike?

True, but the original Steam was created for managing updates to Counter Strike and their anti-cheap system (VAC if memory serves me right). Also back when having a low WON ID (now SteamID) was a badge of honor (like having a low Slashdot account ID).

Sorry for the useless comment but I really like the idea of a „anti-cheap system“.

I will use it in my next presentation for shareholders. /s


I'm sure the behavioral economics people at Activision and EA trying to get kids to buy more cosmetics would have a lot to say about that...

Yes, the Steam client was originally built on top of the same VGUI library used in Valve's games, and used the same style as HL1/CS/etc back then.

Was VGUI built on GTK back then? It looked exactly the same as other GTK apps I was using in the early 00s.

Not sure - the VGUI code in the Half-Life SDK was a bunch of header files and a .lib file but I'm not sure what actually implemented it. Back in the early 2000s I assume it was either Windows-specific or rendered using DirectX/OpenGL.

It was added to Half-Life (and not long after to Counter-Strike) in March 2000 or so. Not sure when Steam first launched but I think there was a beta from 2002?

Yeah, still feels like even today Steam could pop up something in this style somewhere when you press a less common button or cause a less common error. Kind of like how Windows would occasionally have even Windows 3.x style dialogs up until last year in Windows 11, and still has a few stragglers from Windows 9x era.


This one uses <progress> element for progress bar too.

More reading about VGUI: https://developer.valvesoftware.com/wiki/Category:VGUI

Fun fact: in CS 1.6 it could actually be reverted to the old-style WON UI by with `setinfo "_vgui_menus" "0"` in config.cfg or in the console, or buried in the menus as "Options > Multiplayer > Advanced > Buy menu type > VGUI Menus".


Yeah the text-based menus were what Half-Life launched with in 1998. Counter-Strike used these same text-based menus in 1999 and it wasn't until 2000 that the engine was updated to include VGUI. I guess Counter-Strike left the old ones in place for those that preferred them.

This is the Steam UI (server browser and config), rather that CS 1.6 specifically i think? I'm having a hard time remembering what it looked like before Steam integration though.

CS 1.6 was exclusive to Steam; I remember waiting quite a while to register because I didn't like the idea of Steam but ultimately caved (still have a 6 digit steam id, which used to sort of but not really mean something). The server browser in CS 1.5 and below was built into the menu's on the application.

This is indeed the Steam UI, not Counter-Strike. This was also back when they had games like Go built in that you could play with people on your friends list.


Oh yeah, I remember those game .dll files shipping with Steam long after they were disabled.

It's VGUI2 which was created for the Source engine, re-used for Steam and back-ported to the GoldSource engine when the games were launched on Steam.

Steam was pretty much a CS 1.6 launcher at the time.

Everyone runs faster with a knife.

A bit funny how that's still true in modern games like Call of duty black ops 6 (melee weapons in general, not just knife)

Truly.

My heart's beating! My hands are shaking!

Boom! Headshot! Boom! Headshot! BOOM! HEAD-SHOT!

Awesome

Though I am not a gamer I have seen my son playing different games, I loved it not because it belonged to a certain game but because it is clean and different.

Are there any other unique CSS libs that could be used on pages?



awesome, thanks for the link!

90s, early 2000s were peak times for UI.

It was a time when tech companies were trying to make computers a common household item, so they did tons of user testing and we made great strides in UX as discoverability became king.

Then, starting about 10 years ago, they started throwing all that research out the window in favor of minimal, clean, flat, "sleek" UIs because the screenshots are easier to market.

They started appealing to the lowest common denominator. We've lost choice and customizability in favor of allowing Apple and Microsoft to decide what our desktops should look like because some people might be confused if they open up an options panel.

I hate nearly every single thing about the MacOS UX. The dock is awful, and so many insane defaults all over the place. Hiding scrollbars is a bug, not a feature. Pointer acceleration is a bug, not a feature. The scroll wheel operating in reverse is a bug, not a feature.

At least with Windows, I can make it tolerable with third party software to make my task bar and Start menu look and feel like the Win2K days. My biggest complaint about the modern UX is coalescing multiple windows from one program into a single item and not having text. If I have 3 Firefox windows open, that should be 3 items on my task bar. It makes it so I can switch to any of them in a single click. It also means that I can use a window as a widget to monitor something by having the status as the title of the window.


> I hate nearly every single thing about the MacOS UX. The dock is awful, and so many insane defaults all over the place. Hiding scrollbars is a bug, not a feature. Pointer acceleration is a bug, not a feature. The scroll wheel operating in reverse is a bug, not a feature.

I disagree with every single thing you've said here. And I'd be willing to bet most Apple users do too.

That being said, I do think there's some charm in simple, "outdated" UIs.


Most people barely use their computers in a way that different from mainframes/terminals age. They only have a couple software they use (and web apps) and have routines for them. Most don't even care for preferences. The applications, the OS, the hardware (if it's not a laptop) don't really matter.

MacOS is a bad bet if you like to adjust your computing environment to make it more pleasant, like disabling animations, or having different motions for scrolling with mouse and trackpad.


> I hate nearly every single thing about the MacOS UX. The dock is awful, and so many insane defaults all over the place. Hiding scrollbars is a bug, not a feature. Pointer acceleration is a bug, not a feature. The scroll wheel operating in reverse is a bug, not a feature.

Yeah, me too. And I kinda hate how Gnome followed that path and made the same mistakes what Apple did. I am in trouble every time I need to use the UI. It is just very unintuitive and I get quite annoyed with it if I need to use it for longer periods. The small scrollbars, the dock, how useless Finder feels like after Dolphin...


When I was playing with WebSerial, I ended up using XP.css because it reminded me of configuring with old serial modems - I think the aesthetic works quite well.

https://web-serial-app.netlify.app/

(Source: https://github.com/tanepiper/web-serial-controller)


Can't agree more!

But, to be fair, I still use win7 in native (unthemed) UI mode and haven't played many modern games to have a proper comparison :D


Why you didn't use progress or meter for progress bar?


why make everything need a class rather than just styling the DOM elements directly. Why wrap a checkbox into a div rather than just a <form>?

why did you skin the cat that way when there's 98 other ways to do it?

maybe there's a logical reason more than "that's just what came to mind", maybe not. that's the beauty of the whole thing. there is no one way


I'm not sure that argument holds here, not every solution in programming is equally good just because. A <progress> element has the advantage of semantically actually representing a progress bar, which improves accessibility and who knows what other browser behavior and heuristics. In general you should try to use semantically correct HTML tags unless you have a really good reason not to. Maybe in this case he couldn't get the appearance he wanted using <progress>, which would be an acceptable reason.

Obviously this is nitpicking and this UI was made for fun rather than being a serious library intended for production. But that's a different criticism of the GP than the one you made.


It's released with an MIT license so you're free to made any "improvements" you see fit to make. Fork away my friend. Then come back and do a Show HN with a full and complete write up for every little decision you've made. Not just you, but anyone else in this thread that needs to know.

I think it's fair to discuss design decisions of open source project, even if you never plan on actually implementing suggested changes.

Not every question is a criticism that needs to be defended against. The person you're responding to could very well just like to know the reason if one exists, no more, no less.

If you know a better way to get that info than asking the question, I'm all ears.

(major digression ahead)

This is actually something I've been digging into for a while, trying to improve my own communication. My own current best answer for this sort of situation is the social expectation is that a neutral question will always be accompanied by praise and gratitude, and any question asked that lacks that accompaniment will be interpreted as antagonistic.

For example, the comment you're responding too could have started with "This looks really cool, ..." or "Wow, this takes me back..." or "I can see a lot of effort went into this..." and it would have resulted in the question coming off as neutral instead of critical to some people.

What's fascinating is when I mention this kind of thing I almost always get one of two responses

* Of course that's how it works, everyone knows that!

* That's ridiculous, no one can be expected to do that!


I think I'm more cynical. Almost everything stated on the internet will be perceived as antagonistic. At least by some. It's more a representation of the reader's internal state rather than an issue with the question / statement. Unless, of course, the question / statement is overtly antagonistic.

It's definitely not just on the internet, I've been working for years to learn how to not upset people for asking reasonable and genuine questions IRL. It's a real struggle to this day to notice I'm failing to engage in the social ritual correctly and come up with appropriate extra positivity on the spot just so I can be considered a non-antagonist.

I think internalization is important for self improvement, so I admire the way you frame this. Try not to downplay the other part's role, though. They are also making a choice in the exchange.

To be fair, software discussions in particular are absolutely overflowing with snark, reflexive dismissals, and just general one-upmanship. So I can understand people assuming the worst.

Precisely why it is perfectly fine and good to be inquisitive, and ask why people do things the way they do. It's the point of a show and tell.

Just looking at this makes me feel like a noob.

I tried installing CS 1.6 20 years after launch roughly and it was pointless trying to compete.


That's because the servers that are left are filled with die-hard players that know the maps, and every little quirk about the gameplay to the pixel level... There still a lot of fun in there, some mini games, more esoteric modes, deathmatch... The other characteristic of many server is that they are modded to the gills, and in some cases the work that has been done on the game over the years ends up giving some very pleasant surprises...

I logged in about 120 hours in 2024 after not playing for 12 years, and everything was different and the same. You got a lot of 30-something's playing after office hours, keeping the servers alive, and like I said, some servers are at a completely different level, I had so much laughs and met quite a few new people...

I recommend to look a bit more and I'm sure you'll find a few servers to stick around to, even if you get headshotted by an AWP from across the map on each round.


This is the kind of thing I browse Hacker News for. Well done.

Good job! But it reminds me of the dreaded VGUI.dll. (0_0) For those who wrote code for the GS engine it's probaby one of the worst experiences.

Aww, I didn't think it was terrible (though I have limited experience with UI libraries).

The documentation was almost non-existent though.

What mod(s) did you work on?


It didn't get much better in Source either, much to my dismay.

They also added, like, 80MB DLL (AFAIR, chromium) just to render HTML MOTD at some point.

I personally had to rewrite most of mod's VGUI code to make it less leaky and more usable, and not once have I thought of using CSS instead of those INI-style theme configs. But CSS is too complicated to parse (and no one will use that anyway). :(


Originally it used Windows's built-in embeddable IE thing, which as you can imagine was not stellar for security. IIRC there have been some incidents with bad servers serving up MOTDs that exploited vulnerabilities in Trident to execute arbitrary code.

I believe they switched to Chromium while preparing for the OS X port. You'd think this would be good for security, but they then proceeded to update to the latest version approximately once a decade.


I know a lot of servers exploited that as well to play music in the background... in retrospect, the idea of a web view hanging around while you're in a game is terrifying.

Yes! And all of that just to parse some <font> and <img> tags? :D

Also, to be fair: it was VGUI2, which, AFAIK, was introduced with Steam UI and still used in HL2. And was never made available to modders of GS.


Not gonna lie, I expected bleep bloop sound effects when clicking buttons

really takes me back. i love this. that progress bar is how i remember steam being stuck updating for ages (meanhwile it was just entirely frozen and i had to restart it)

As some one who used to play CS 1.6 for countless hours as a teenager, this is amazing and I can’t wait to use this for a fun project.

Is there a way to generate a vim colorscheme given the background and foreground as used in this CSS?

Awesome stuff. Thankyou.

nice , going to add this template to https://codekeep.io/screenshot i have added 98, xp, nes before which was shared in hn.

This is so epic. Makes me want to create web pages myself which I never really have to date.

coolest thing i found out today, gotta redesign my personal sites using this.

I really like this asthetic.

Needs even worse kerning for more nostalgia :D

Also ought to be paired with https://github.com/ocornut/imgui

I came up with a terrible pun shortly after seeing this: "Kern you feel the love tonight"


This is really excellent.

It could use some styles for tables.


Looks a lot like Lesstif. Nice!

VGUI!

That's my childhood.

This is awesome!

NOSTALGIA!

Awesome job!


Guys will see this and just think "Hell yeah"

Dude, I was looking for something like this earlier today. Thank you.

fucking love it

What are the best lightweight CSS UI libraries containing widgets like tabs, trees, etc.? I don't have webdev experience (only GTK, etc.), but I need to write a web dashboard. I tried looking around but the only alternatives seem to be either bloated JS frameworks or abandoned experiments.

I am using this in production!: https://khang-nd.github.io/7.css/

Of course, it's only for my own invoicing/crm system. I started on replacing the look and feel of everything with a flat more modern/less user-friendly equivalent by downloading the static css and modifying it to look like material UI designs.


Oh wow, I really love this. PHPBB also comes to mind for this sort of style. https://www.phpbb.com/community/viewforum.php?f=551

Is there a name for this style? Im also trying to pinpoint the defining characteristics. The thing that stand out to me are:

- 3d-ish buttons

- gradients (headers, buttons, etc)

- not much whitespace between text

- small text


that style was prominent just as skewmorphism started to fall out of fashion and "web 2.0" was just becoming a buzzword.

This looks nice, thanks!

How invested in CSS do you want to be? If you're just wanting to include someone else's .css file and then assign classes where needed, that's one way to go. However, CSS isn't as daunting as many people make it out to be for the vast majority of a user's needs--adding colors, borders, padding/margin, and other basic styling. Looking to use CSS for layout is where things can get "interesting", sometimes challenging, and sometimes arghhhh!

I've hand written the CSS for all of the sites I've worked on, and the CSS is smaller than some all encompassing library. Plus, I'm much better at CSS. But I decided I wanted to invest that effort. No shame if you don't


no suggestions in this reply, nor can I speak to if this is a good or bad idea, but you may like to learn about "classless css frameworks", basically just targeting the html5 semantics

https://github.com/dbohdan/classless-css

also, https://github.com/troxler/awesome-css-frameworks

others may give you a _real_ recommendation. cheers


Yup this is the place to start if you dont want to have to learn something new. Doesn't get you too far but it's great bang for your buck.

Thanks, I found this[0] which looks somewhat promising

[0]: http://classless.de


Dashboards, tabs, trees, ... usually require at least some JavaScript to work properly. For some components, you may be able to use hacks around that. But I would generally not recommend that outside of experimentation. So a pure CSS framework is not going to work. It seems that you are not using a frontend framework like Vue.js. So I would recommend a library using web components for the interactivity. One good option is Shoelace [1] and there are a couple of others, too [2]. Take a look at the ones with the checkmark in the "W" column for libraries with web components.

[1] https://shoelace.style/

[2] https://frontaid.ch/web/ui/libraries.html


I suppose its not the most lightweight, and it's considered outdated by many but I actually think Bootstrap is great for your use case.

It uses classes to style html inline and looks pretty good. The downside is it gives a fairly generic look but I don't think you should be too worried about that.

Tailwind has largely replaced it because it offers more flexibility. You use utility classes to write the css (add padding, change color, etc.) and isnt as opinionated as bootstrap. But I dont think you want that.

If you really are going for lightweight and simple you should checkout classless css which only uses html to style things. Nothing needed from you other than including the css sheet. https://github.com/dbohdan/classless-css


Tailwind might not be the most perfect fit, but it's "just" CSS.

And Tailwind v4 is notably better than v3 in terms of being "CSS first": https://tailwindcss.com/blog/tailwindcss-v4



Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: