A New Skin Based on Windows 10 Design Language

STEAM GROUP

Metro Skin MetroSkin

Join Group

STEAM GROUP

Metro Skin MetroSkin

9,718
MEMBERS

696

IN-GAME

3,436

ONLINE

Founded

7 August, 2015

Language

English

Location

United States

Overview Discussions Events Members Comments

All Discussions > General Discussions > Topic Details

yurisuika 12 Jul, 2023 @ 10:47pm

A New Skin Based on Windows 10 Design Language

I used Metro for a long time and tried to hold out on VGUI interfaces until they became too broken. As such, others had already developed chat skins in CSS that I forked off of. When they killed off the last of VGUI, I adapted as well, but I found that my CSS was a complete jumbled mess.

So, I decided to start from the ground up and create a new skin! I only started working on this about a week ago, but so far it is coming along!

It is based on MDL2, which is the transitional design language used in Windows 10 after Metro and before Fluent. It uses such aspects as Acrylic and Reveal to give the best possible fit into the Windows 10 design. If you liked the Metro skin, you will find this quite familiar. Just like Metro, I have used icons sourced directly from Windows to make it fit in perfectly.

https://github.com/yurisuika/Zehn

< >

Showing 1-8 of 8 comments

Flux 15 Jul, 2023 @ 5:06am

Hey, this is an excellent start! Well done! Gonna add it to my guide :)

Last edited by Flux; 15 Jul, 2023 @ 5:06am

RedSigma

20 Jul, 2023 @ 10:54am

This looks nice.

Helios 5 Aug, 2023 @ 4:25am

Extremely sexy. ;)

Redn2000 15 Aug, 2023 @ 5:55pm

Does this require SteamFriendsPatcher to use?

JmTrad 21 Aug, 2023 @ 10:42pm

looks cool

MONZUN 21 Sep, 2023 @ 12:24am

looks great !

scaypies 21 Sep, 2023 @ 1:00pm

this looks good, but the library is ULTRA laggy (as you partially described on the github page itself): I'm sorry that I'm stupid, but is there a way to disable the animations there outright? I don't really care for my games list constantly scrolling back and forth to increase screen real-estate. Why do so many companies force worthless animations without an option to just disable shit lol, ffs

EDIT: Thank you for adding the sidebar button!

Last edited by scaypies; 22 Sep, 2023 @ 9:21pm

yurisuika 28 Sep, 2023 @ 1:35am

Originally posted by scaypies:
EDIT: Thank you for adding the sidebar button!

Yeah I put it off for a long time because I didn't actually know how to do it, but it wasn't too hard to figure out in the end. I didn't know where I should be placing the buttons until I added them, but I think this is a pretty good setup for now. it centers the HOME button over the dropdown box which is nice looking, so that's a bonus.

Animating width/height/etc in HTML is very laggy, so it now fakes an expansion when you open it up with a transform instead, but it looks a lot better nonetheless.

I still have to figure out how to get it to re-inject the button once you unload it from the library (e.g. when you go to the Downloads page).