Style VS Code your way.
Keep it secure.

A safe way to customize VS Code: your own CSS and JS, with its security policy kept on.
A retro and cyberpunk style kit: themes, icons, fonts and effects.

Install View on GitHub

VS Code with the Night City preset: a dark indigo theme with pink and cyan neon code, glowing highlights, pixel file icons, and errors shown on their lines.

Presets

A preset sets up a complete look in one step: a color theme, the pixel icons, a Nerd Font and a set of effects. Afterwards you can still change anything on its own.

Night City: dark indigo with pink and cyan neon, and glowing code. — **Night City** Cyberpunk neon, glowing code, sparks and a boot sequence.

Phosphor Terminal: green text on black in a pixel font, with square panels. — **Phosphor Terminal** A green CRT terminal with a pixel font, scanlines and a square layout.

Amber Monitor: amber text on a dark brown background, with square panels. — **Amber Monitor** An amber monochrome monitor with scanlines and a square layout.

Daylight: a warm light theme with dark text and subtle colored highlights. — **Daylight** Calm and bright, with only the subtle effects.

There's also a High Contrast preset, with nothing that moves.

What's in the kit

Your own CSS and JS

Add your own files to change anything in VS Code's interface. They stay in place until you turn them off, and a VS Code update doesn't make you start over: Stylesmith offers to apply them again.

Effects

A gliding caret, a neon current line, glowing code blocks and selections, CRT scanlines, typing sparks, a boot sequence and a glitch on save. The loud ones are off until you turn them on, and none of them do any work while you're idle.

Problem Lens

Errors and warnings right on their line: a soft tint, a pixel icon in the gutter, the message at the end of the line, and the problem in the status bar.

Six color themes

Dark, light and high contrast. Every theme is checked against the WCAG contrast levels and simulated for color blindness, so the colors that carry meaning stay apart.

Nerd Fonts

JetBrainsMono, BlexMono, ShureTechMono and DepartureMono, bundled and set for the editor and terminal. Your own fonts stay as fallbacks.

Classic layout

Prefer square corners and tabs that look like tabs? One switch brings back the classic look of VS Code, and puts your settings back when you turn it off.

Security comes first

Tools that change VS Code's look have to change VS Code's own files. Stylesmith does it without turning off what keeps VS Code secure:

VS Code's security policy stays on. Only the exact scripts Stylesmith adds are allowed to run, each by its fingerprint.
A project can't change what runs. Settings are read from your user settings only, never from a workspace you open.
Your files, on your terms. No http://, https:// only if you allow it, a size limit, and optional fingerprints that refuse a file that changed.
Always reversible. Disable and uninstall put VS Code's file back byte for byte.
Checked on every change. About 1,800 tests, browser and end-to-end tests in a real VS Code, CodeQL and OpenSSF Scorecard.

Found a problem? Please report it privately, as described in the security policy.

Install

Stylesmith isn't on the Marketplace yet. Build the package and install it in VS Code:

git clone https://github.com/21010/stylesmith.git
cd stylesmith
npm install
npx @vscode/vsce package --no-dependencies
code --install-extension stylesmith-<version>.vsix

Then open the Command Palette and run Stylesmith: Enable, or click the paint-can button in the status bar and pick a preset. The README explains every setting.

Style VS Code your way.Keep it secure.

01 // Presets

02 // What's in the kit