Saffron Atelier

A warm cream-and-beige light theme for VS Code with readable charcoal text and muted olive, soft blue, terracotta and gold accents.

Previews are rendered with the theme's exact colors and IBM Plex Mono.

Contents

• Palette
• Installation
  • macOS
  • Windows
  • Linux
  • Build from source
• Activate the theme
• Recommended fonts
• Updating and uninstalling
• License

Palette

Installation

First download saffron-atelier-x.y.z.vsix from the latest release.

Any OS, using the VS Code UI: open the Extensions view (Ctrl+Shift+X / Cmd+Shift+X), click the ... menu at the top, choose Install from VSIX..., and select the downloaded file.

You can also install it from the terminal, as shown below for each OS.

macOS

# Optional: makes the `code` command available in your shell.
# In VS Code: Cmd+Shift+P → "Shell Command: Install 'code' command in PATH"

code --install-extension ~/Downloads/saffron-atelier-1.3.0.vsix

Windows

In PowerShell (the code command is added to PATH by the VS Code installer):

code --install-extension "$env:USERPROFILE\Downloads\saffron-atelier-1.3.0.vsix"

Linux

code --install-extension ~/Downloads/saffron-atelier-1.3.0.vsix

VSCodium / Cursor / other VS Code forks: use codium --install-extension ... or cursor --install-extension ... instead of code.

Build from source (any OS)

Requires Node.js 18+ and Git.

git clone https://github.com/vasikmansuri/saffron-atelier-vscode-theme.git
cd saffron-atelier-vscode-theme
npx @vscode/vsce package
code --install-extension saffron-atelier-1.3.0.vsix

Activate the theme

1. Open the Command Palette: Cmd+Shift+P (macOS) or Ctrl+Shift+P (Windows/Linux).
2. Run Preferences: Color Theme.
3. Select Saffron Atelier.

Or add this to your settings.json:

"workbench.colorTheme": "Saffron Atelier"

Recommended fonts

VS Code themes can't set fonts, so add a font in settings.json. The theme uses italics for comments, parameters, modifiers and this/self, and bold for class and function declarations. Choose a font with a real italic.

Recommended: IBM Plex Mono. Its warm, humanist shapes suit the palette. Alternatives: JetBrains Mono, Monaspace Radon / Argon.

Restart VS Code after installing the font, then add:

{
  "workbench.colorTheme": "Saffron Atelier",
  "editor.fontFamily": "'IBM Plex Mono', 'JetBrains Mono', Menlo, Consolas, monospace",
  "editor.fontSize": 14,
  "editor.lineHeight": 1.7,
  "editor.fontLigatures": false,
  "editor.letterSpacing": 0.2,
  "terminal.integrated.fontFamily": "'IBM Plex Mono', 'JetBrains Mono', monospace",
  "terminal.integrated.fontSize": 13,
  "terminal.integrated.lineHeight": 1.3
}

If you use JetBrains Mono or Monaspace, set "editor.fontLigatures": true.

Updating and uninstalling

• Update: download the newer .vsix and install it the same way. It replaces the old version.
• Uninstall: code --uninstall-extension vasikmansuri.saffron-atelier, or use the gear icon on the extension in the Extensions view.

Seeing two "Saffron Atelier" entries? Version 1.0.0 used the publisher custom-local. Uninstall it with code --uninstall-extension custom-local.saffron-atelier. If it's still listed, delete the custom-local.saffron-atelier-1.0.0 folder in ~/.vscode/extensions (Windows: %USERPROFILE%\.vscode\extensions).

Changelog

• 1.3.0: Bracket-pair colors now match the palette (VS Code's default blue/gold brackets are gone). JSX/HTML tags are terracotta, components are blue, attribute names are gold italic, {} expression braces are accented, sticky-scroll and symbol icon colors are set, and activity bar icons have more contrast.
• 1.2.0: Extension icon, preview screenshots, install steps for macOS, Windows and Linux.
• 1.1.0: Better comment contrast, italic/bold font styles, packaging.

License

MIT © Vasik Mansuri