Skip to main content
While Shades of Purple works with any monospace font, the theme truly shines with a quality coding font. This guide covers font configuration and recommendations. Shades of Purple is optimized for Operator Mono, a premium coding font that features beautiful italics and ligatures. However, the theme works excellently with other fonts too.
Operator Mono is a paid font. See the alternatives section below for free options.

Font Configuration

Here are the recommended font settings for VSCode:
{
  "editor.fontFamily": "Operator Mono, Menlo, Monaco, 'Courier New', monospace",
  "terminal.integrated.fontFamily": "'Operator Mono', 'Inconsolata for Powerline', monospace",
  "editor.fontSize": 17,
  "editor.lineHeight": 24.65,
  "editor.letterSpacing": 0.5,
  "editor.fontWeight": "400",
  "editor.fontLigatures": true
}

Font Settings Explained

"editor.fontFamily": "Operator Mono, Menlo, Monaco, 'Courier New', monospace"
This setting defines a fallback chain:
  1. Operator Mono - Primary choice with beautiful italics
  2. Menlo - macOS default monospace font
  3. Monaco - Classic macOS coding font
  4. Courier New - Cross-platform fallback
  5. monospace - System default monospace
The editor will use the first available font from this list.
"terminal.integrated.fontFamily": "'Operator Mono', 'Inconsolata for Powerline', monospace"
Separate font configuration for the integrated terminal:
  • Maintains consistency with editor font
  • Includes Powerline support for enhanced terminal prompts
  • Falls back to system monospace if others unavailable
"editor.fontSize": 17
17 pixels provides:
  • Comfortable reading size for extended coding sessions
  • Good balance between screen real estate and readability
  • Optimal size for 1080p and higher resolution displays
Adjust based on your display size and personal preference. Common sizes range from 14-18px.
"editor.lineHeight": 24.65
This setting:
  • Provides ~1.45x the font size as line height
  • Creates breathing room between lines
  • Reduces eye strain during long coding sessions
  • Works harmoniously with the purple color palette
"editor.letterSpacing": 0.5
Half-pixel letter spacing:
  • Adds subtle breathing room between characters
  • Improves character distinction
  • Enhances readability without affecting code density
"editor.fontWeight": "400"
Normal weight (400) provides:
  • Standard font thickness
  • Good contrast with bold syntax highlighting
  • Reduced eye strain compared to lighter weights
Some fonts support multiple weights (300, 400, 500, 600, etc.). Experiment to find what works for you.
"editor.fontLigatures": true
Enables font ligatures that combine character sequences into single glyphs:
  • => becomes a single arrow symbol
  • != becomes a proper not-equal sign
  • >= and <= become proper comparison symbols
Ligatures require a font that supports them (like Operator Mono, Fira Code, or JetBrains Mono). This setting has no effect with fonts that don’t include ligatures.

Installing Operator Mono

1

Purchase the Font

Visit the Operator Mono website to purchase and download the font files.
2

Install the Font

macOS: Double-click the font files (.otf) and click “Install Font”Windows: Right-click the font files and select “Install” or “Install for all users”Linux: Copy font files to ~/.local/share/fonts/ and run fc-cache -f -v
3

Restart VSCode

Close and reopen VSCode for the font to be recognized.
4

Configure Settings

Add the font configuration to your VSCode settings.json file.

Free Font Alternatives

If you prefer free options, these fonts work beautifully with Shades of Purple:
{
  "editor.fontFamily": "Fira Code, monospace",
  "editor.fontLigatures": true,
  "editor.fontSize": 14,
  "editor.lineHeight": 21
}

Font Comparison

FontLigaturesItalicsLicenseBest For
Operator MonoYesBeautifulPaidPremium experience
Fira CodeYesStandardFree (OFL)Ligature lovers
JetBrains MonoYesGoodFree (OFL)Modern coding
Cascadia CodeYesGoodFree (OFL)Windows users
Source Code ProNoStandardFree (OFL)Classic look

Disabling Italics

If you prefer to disable italics while keeping your font choice:
{
  "editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": [
          "comment",
          "storage.modifier",
          "entity.other.attribute-name",
          "markup.italic.markdown"
        ],
        "settings": {
          "fontStyle": ""
        }
      }
    ]
  }
}
For more details on disabling italics, see the FAQ on GitHub.

Troubleshooting

Font Not Showing Up

  1. Ensure the font is properly installed on your system
  2. Check the exact font name in your system’s font manager
  3. Restart VSCode after installing fonts
  4. Try wrapping the font name in quotes if it contains spaces

Ligatures Not Working

  1. Verify your font supports ligatures
  2. Ensure "editor.fontLigatures": true is in your settings
  3. Try restarting VSCode
  4. Check if the font family name is correct

Font Looks Blurry

{
  "workbench.fontAliasing": "auto"
}
This setting (macOS) adjusts font smoothing for optimal clarity.

Next Steps

Now that your fonts are configured:

Build docs developers (and LLMs) love