https://github.com/babakfp/vscode-pretty-styles
Change vsCode Editor UI Font-Family
https://github.com/babakfp/vscode-pretty-styles
deno picocss vscode windows
Last synced: 4 months ago
JSON representation
Change vsCode Editor UI Font-Family
- Host: GitHub
- URL: https://github.com/babakfp/vscode-pretty-styles
- Owner: babakfp
- Created: 2024-04-09T02:00:41.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2026-02-18T13:44:55.000Z (4 months ago)
- Last Synced: 2026-02-18T15:15:24.151Z (4 months ago)
- Topics: deno, picocss, vscode, windows
- Language: TypeScript
- Homepage:
- Size: 144 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# vsCode Pretty Styles
A **Windows** application that allows you to Customize vsCode Editor UI
Font-Family and add your own Custom CSS styles.
## How it works
This application modifies vsCode installation files. It doesn't make any
breaking or unexpected changes. You can easily revert the changes. Feel free to
check out the source [code](/src/utilities/updateVsCodeStyles.ts).
## Guide
1. Downloaded the latest
[release](https://github.com/babakfp/vscode-pretty-styles/releases/latest).
2. Extract the downloaded file.
3. Run the executable `vscode-pretty-styles.exe`.
## CSS variables
- `--vscode-pretty-styles-font-family`.
## Limitations
- It only works on Windows OS.
- It only works on my system. I don't know if it will work on your computer!
Windows specifications:
- Edition: Windows 11 Pro
- Version: 23H2
- OneDrive: Disabled
## Contributions
Feel welcome to open issues, PRs, send suggestions, code improvements, etc.
If possible, open an issue first, because I'll feel bad if I close your PR!
It's OK to make mistakes and not to know everything.
## Workbench path
This is the file that I modify to get things working.
```
C:\Users\Babak\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\workbench.desktop.main.css
```
## How to open dev tools?
1. Press `ctrl` + `shift` + `p`.
2. Select "Toggle Developer Tools".
## License
Icon by [Icon8](https://icons8.com).