{"id":23739173,"url":"https://github.com/PhantomGamers/SFP","last_synced_at":"2025-09-04T14:32:41.020Z","repository":{"id":37962776,"uuid":"481084114","full_name":"PhantomGamers/SFP","owner":"PhantomGamers","description":"This utility is designed to allow you to apply skins to the modern Steam client","archived":false,"fork":false,"pushed_at":"2025-02-10T00:54:38.000Z","size":3581,"stargazers_count":597,"open_issues_count":18,"forks_count":11,"subscribers_count":10,"default_branch":"main","last_synced_at":"2025-02-10T01:31:03.415Z","etag":null,"topics":["reverse-engineering","skin","steam","steam-client","theme","valve"],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/PhantomGamers.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"ko_fi":"phantomgamers"}},"created_at":"2022-04-13T05:31:07.000Z","updated_at":"2025-02-09T10:18:55.000Z","dependencies_parsed_at":"2023-01-31T10:15:18.739Z","dependency_job_id":"0bba0c4a-ef07-46d7-ba20-057fc047b73c","html_url":"https://github.com/PhantomGamers/SFP","commit_stats":null,"previous_names":[],"tags_count":47,"template":false,"template_full_name":null,"purl":"pkg:github/PhantomGamers/SFP","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PhantomGamers%2FSFP","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PhantomGamers%2FSFP/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PhantomGamers%2FSFP/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PhantomGamers%2FSFP/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/PhantomGamers","download_url":"https://codeload.github.com/PhantomGamers/SFP/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PhantomGamers%2FSFP/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":273621843,"owners_count":25138743,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-04T02:00:08.968Z","response_time":61,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["reverse-engineering","skin","steam","steam-client","theme","valve"],"created_at":"2024-12-31T09:36:36.927Z","updated_at":"2025-09-04T14:32:40.998Z","avatar_url":"https://github.com/PhantomGamers.png","language":"C#","funding_links":["https://ko-fi.com/phantomgamers"],"categories":["C# #"],"sub_categories":[],"readme":"# SFP (Formerly SteamFriendsPatcher)\n\nThis utility allows you to apply skins and scripts to the new Steam client.\n\n- [SFP (Formerly SteamFriendsPatcher)](#sfp--formerly-steamfriendspatcher-)\n  * [Instructions](#instructions)\n  * [Features](#features)\n    + [Steam Skinning](#steam-skinning)\n    + [Scripting](#scripting)\n    + [Skins and Scripts in Separate Folders](#skins-and-scripts-in-separate-folders)\n    + [Enable JavaScript Injection](#enable-javascript-injection)\n  * [Skin Authors](#skin-authors)\n    + [Matching against pages with variable titles](#matching-against-pages-with-variable-titles)\n    + [Finding Steam Page Titles](#finding-steam-page-titles)\n    + [Using System Accent Color](#using-system-accent-color)\n  * [Todo](#todo)\n  * [Known Issues](#known-issues)\n  * [Dependencies](#dependencies)\n    + [All](#all)\n    + [Linux](#linux)\n  * [Credits](#credits)\n\n\u003csmall\u003e\u003ci\u003e\u003ca href='http://ecotrust-canada.github.io/markdown-toc/'\u003eTable of contents generated with markdown-toc\u003c/a\u003e\u003c/i\u003e\u003c/small\u003e\n\n## Instructions\n\n1. Download and extract the [latest zip file under Releases](https://github.com/PhantomGamers/SFP/releases/) for your\n   operating system.\n   - If you have .NET 7 installed, download the \\_net7.zip release; otherwise, download the \\_SelfContained.zip release.\n2. Run the SFP_UI application.\n3. By default, SFP_UI will automatically wait for Steam to start and inject, or inject if Steam is already running.\n4. For full functionality, **SFP must be running with its injector started as long as Steam is running**.\n5. Steam must be running with the `-cef-enable-debugging` argument for SFP to work.\n    - If Steam is started with SFP, it will do this automatically. Otherwise, you can use the \"Force Steam\n      arguments\" setting to automatically restart Steam with the chosen arguments if it does not already have them.\n    - This setting is enabled by default\n6. Use the \"Open File\" button in SFP to access the files where your custom skins and scripts are applied from.\n\nFor more information and links to existing skins see [Steam Skins Wiki](https://steamskins.pages.dev/)\n\n## Features\n\n### Steam Skinning\n\n- Reads and applies custom CSS to Steam pages.\n    - Customize which files apply to which pages in the skin config.\n    - By default, SFP applies skins from:\n        - Skins for the Steam client, library, and overlay go in `Steam/steamui/libraryroot.custom.css`.\n        - Skins for the friends list and chat windows go in `Steam/steamui/friends.custom.css`.\n        - Skins for the Steam store and community pages go in `Steam/steamui/webkit.css`.\n        - Skins for Big Picture Mode go in `Steam/steamui/bigpicture.custom.css`.\n\n### Scripting\n\n- Reads and applies custom JavaScript to Steam pages.\n    - Customize which files apply to which pages in the skin config.\n    - By default, SFP applies scripts from:\n        - Scripts for the Steam client, library, and overlay go in `Steam/steamui/libraryroot.custom.js`.\n        - Scripts for the friends list and chat windows go in `Steam/steamui/friends.custom.js`.\n        - Scripts for the Steam store and community pages go in `Steam/steamui/webkit.js`.\n        - Scripts for Big Picture Mode go in `Steam/steamui/bigpicture.custom.js`.\n\n### Skins and Scripts in Separate Folders\n\n- Skins and scripts can also be added to their own folders within `Steam/steamui/skins` and then selected in SFP's\n  settings.\n\n### Enable JavaScript Injection\n\n- JavaScript injection is disabled by default and must be enabled in SFP's settings.\n- JavaScript code can potentially be malicious, so only install scripts from people you trust!\n\n## Skin Authors\n\nIf you want to customize which Steam pages are skinned and which files are applied to each page, include a `skin.json`\nfile in the root of your skin folder.\n\nDefault `skin.json`:\n\n```json\n{\n  \"Patches\": [\n    {\n      \"MatchRegexString\": \"https://.*.steampowered.com\",\n      \"TargetCss\": \"webkit.css\",\n      \"TargetJs\": \"webkit.js\"\n    },\n    {\n      \"MatchRegexString\": \"https://steamcommunity.com\",\n      \"TargetCss\": \"webkit.css\",\n      \"TargetJs\": \"webkit.js\"\n    },\n    {\n      \"MatchRegexString\": \"^Steam$\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^OverlayBrowser_Browser$\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^SP Overlay:\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"Supernav$\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^notificationtoasts_\",\n      \"TargetCss\": \"notifications.custom.css\",\n      \"TargetJs\": \"notifications.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^SteamBrowser_Find$\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^OverlayTab\\\\d+_Find$\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^Steam Big Picture Mode$\",\n      \"TargetCss\": \"bigpicture.custom.css\",\n      \"TargetJs\": \"bigpicture.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^QuickAccess_\",\n      \"TargetCss\": \"bigpicture.custom.css\",\n      \"TargetJs\": \"bigpicture.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"^MainMenu_\",\n      \"TargetCss\": \"bigpicture.custom.css\",\n      \"TargetJs\": \"bigpicture.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \".friendsui-container\",\n      \"TargetCss\": \"friends.custom.css\",\n      \"TargetJs\": \"friends.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \"Menu$\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \".ModalDialogPopup\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    },\n    {\n      \"MatchRegexString\": \".FullModalOverlay\",\n      \"TargetCss\": \"libraryroot.custom.css\",\n      \"TargetJs\": \"libraryroot.custom.js\"\n    }\n  ]\n}\n```\n\nEach entry should have a \"MatchRegexString\" key, where the value is either a regex string that will be matched against a\nSteam page title or a url that begins with `http://` or `https://` that will be matched against a url.\n\nEach entry can also have a TargetCss key and a TargetJs key, which will be the css and js files that are applied to the\npage if the regex matches.\n\nAn entry can have both a TargetCss and a TargetJs key, or just one of them.\n\nEach target can only have one Css and one Js file injected at a time, with the first match taking precedence, so order\nyour patches correctly.\n\nIf you would like to use SFP's default config you can simply omit the skin.json file or include this:\n\n```json\n{\n    \"UseDefaultPatches\": true\n}\n```\n\nIf that key is included along with custom patches, the custom patches will be applied first, followed by the default patches.\n\n### Matching against pages with variable titles\n\nCertain pages will have titles that change either depending on the user's language settings or some other factor.\n\nIn order to match against these pages, you can match against a selector that exists within the page. SFP will match\nagainst a selector if MatchRegexString begins with `.`, `#`, or `[`.\n\nFor example:\n\n- The Friends List and Chat windows can be matched against with `.friendsui-container`\n\n- The library game properties dialog and most of the dialogs that pop up in the overlay menu can be matched against\n  with `.ModalDialogPopup`\n\n- The sign in page can be matched against with `.FullModalOverlay`\n\n### Finding Steam Page Titles\n\nTo find steam page titles to match against, make sure Steam is running with `cef-enable-debugging` and then\nvisit \u003chttp://localhost:8080\u003e in your web browser.\n\n### Using System Accent Color\n\nWhen the user has the UseAppTheme setting enabled, SFP passes the System Accent Color to Steam via CSS variables.\n\nYou can use these variables in your skin to match the system accent color.\n\nThe variables are as follows:\n\n- `--SystemAccentColor`\n- `--SystemAccentColorLight1`\n- `--SystemAccentColorLight2`\n- `--SystemAccentColorLight3`\n- `--SystemAccentColorDark1`\n- `--SystemAccentColorDark2`\n- `--SystemAccentColorDark3`\n\nThese variables contain **hex colors**.\n\nWhen using these variables, make sure to fallback to sane defaults as these variables may not exist if the user does not enable UseAppTheme or uses a different patcher.\n\n## Todo\n\n- Add ability to install and customize skins directly from SFP\n\n## Known Issues\n\n- None currently\n\n## Dependencies\n\n### All\n\n- [.NET 7.0](https://dotnet.microsoft.com/en-us/download/dotnet/7.0) (Only if not using self contained version)\n\n### Linux\n\n- ttf-ms-fonts\n  -  run `fc-cache --force` after installing\n\n## Credits\n\n- Darth from the Steam community forums for the method.\n- [@henrikx for Steam directory detection code.](https://github.com/henrikx/metroskininstaller)\n- [Sam Allen of Dot Net Perls for GZIP compression, decompression, and detection code.](https://www.dotnetperls.com/decompress)\n- [@maxhauser for semver](https://github.com/maxhauser/semver)\n- [The Avalonia team for the AvaloniaUI framework](https://github.com/AvaloniaUI/Avalonia)\n- [@amwx for the FluentAvalonia theme](https://github.com/amwx/FluentAvalonia)\n- [@d2phap for FileWatcherEx](https://github.com/d2phap/FileWatcherEx)\n- [@alastairtree for LazyCache](https://github.com/alastairtree/LazyCache)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FPhantomGamers%2FSFP","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FPhantomGamers%2FSFP","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FPhantomGamers%2FSFP/lists"}