Home - Tags - Bookmarks - About

Tweaking Sublime Text themes to take advantage of Retina displays

Tuesday, 06 January 2015

Sublime Text already supports Retina displays on OS X, however it seems that the story is currently a bit different on Windows.

Update – Monday, November 14, 2016: To make this a whole lot easier, I’ve forked buymeasoda/soda-theme into moodmosaic/soda-theme. If you clone moodmosaic/soda-theme, it will show nicely on Retina displays on Windows.

Problem

You experience fuzzy fonts when using Sublime Text with Retina displays on Windows, even after updating to a newer version of Sublime Text.

Manual solution

The above technique has been tested with Sublime Text's Default Theme, and Soda Theme (both dark and light variants).

Soda Theme requires the following images to be excluded from the above process: tab-active, tab-hover, tab-inactive, tabset-background.

Automated solution

If done manually, this can take some time. – Here is a way to automate this with F#:

If you don't have the F# compiler and runtime, install it from here.

On a clean system without any edition of Visual Studio, the compiler, runtime, and F# Interactive will be deployed without IDE tooling.

Save the following F# program to a file:

module Sublime.Text.Windows

open System
open System.IO

type Theme = { Path : string; DpiAgnostics : string list }

let patch theme =
    Directory.GetFiles(theme.Path, "*@2x.*", SearchOption.AllDirectories)
    |> Seq.filter
        (fun candidate ->
            theme.DpiAgnostics
            |> Seq.exists
                (fun agnostic ->
                    Path.GetFileNameWithoutExtension(candidate) = agnostic)
            |> not)
    |> Seq.iter
        (fun hiDpi ->
            let lowDpi = hiDpi.Replace("@2x", String.Empty)
            File.Delete lowDpi
            File.Copy(hiDpi, lowDpi))
    ()

Assuming the above program is saved as Program.fs in X:\Tools.

You should see something like:

namespace FSI_0002.Sublime.Text.Windows
  type Theme =
    {Path: string;
     DpiAgnostics: string list;}
  val patch : theme:Theme -> unit

Once you open Sublime.Text.Windows, execute the patch function by supplying a value for theme.

Soda Theme

let sodaTheme = {
    Path = @"replace_this_with_the_soda_theme_path";
    DpiAgnostics = [
            "tab-active@2x"
          ; "tab-hover@2x"
          ; "tab-inactive@2x"
          ; "tabset-background@2x" ]
} // In one line for SublimeREPL.
patch sodaTheme

Default Theme

Default Theme is .zipped in \Packages\Theme - Default.sublime-package and has to be unzipped first, patched, and then zipped back again.

let defaultTheme = {
    Path = @"replace_this_with_the_unzipped_theme_path";
    DpiAgnostics = []
} // In one line for SublimeREPL.
patch defaultTheme

Enjoy Sublime Text with Retina displays on Windows!

━━━

This post has been filed under #sublime

Feedback

Have feedback on this page? Let @nikosbaxevanis know on twitter. Need help or found a bug? Contact me.


© 2011-2018 Nikos Baxevanis. All written content on this site is provided under a Creative Commons ShareAlike license. All code is provided under a MIT license unless otherwise stated.