Poll: What VSCode theme do you use?

The best I found so far for me is Cobalt2

I also noticed in the poll that some people actually customize the color scheme…
Does anyone managed to customize the grammar related to elixir so that the do: in inline function definitions is the same color as the def/defp?

I use New Dark RailsCasts. It’s based on old known railscast sublime theme but modernized.

NightOwl, unfortunatly the latest vscode update broke it :confused:

https://marketplace.visualstudio.com/items?itemName=sdras.night-owl

Thank you for this theme! I’ve migrated from dark ones to the New England and I feel very productive. Can’t imagine turning back :smiley:

I’m so glad you’re enjoying it. I have gone back and forth on light versus dark over the years. If you ever do need a dark theme, Yarra valley is my most actively maintained theme at the moment (support for semantic highlighting, more languages, etc.).

1 Like

After testing out multiple themes, I noticed only a few of them highlight methods (see game_pid/1, is_pid/1, assign/2, generate_auth_token/1 etc, below):

Screen Shot 2021-02-22 at 12.46.27 PM

Screen Shot 2021-02-22 at 12.53.10 PM

Screen Shot 2021-02-22 at 12.56.51 PM

As opposed to:

Screen Shot 2021-02-22 at 12.53.36 PM

How to address this issue?

It’s up to the theme designer whether a given token gets the default foreground color or some other color. In this case, the relevant Textmate scope is entity.name.function-call.elixir, so if you don’t like it, you can simply override in settings.json:

"editor.tokenColorCustomizations": {
    "[Theme Name]": {
        "textMateRules": [
            {
                "scope": [
                    "entity.name.function-call.elixir"
                ],
                "settings": {
                    "foreground": "#ffff00"
                }
            }
        ]
    }
}
2 Likes

Since this thread is getting bumped, I should mention that I’ve released a new theme called Tol. It began as a project to make my Yarra Valley theme more color-accessible, but I liked the result so much that I ended up switching to it full time:

4 Likes

Where can I find a list of available scopes ?

If you’re using ElixirLS then you can find all the current scopes in this file:

1 Like

If you want all scopes, then the grammar file for that language will contain them. That may be bundled with VS Code or supplied by an extension, depending on your setup.

Most of the time, people tweaking settings just want to know the scope stack at the current cursor position, which you can obtain with:

Command Palette > Developer: Inspect Editor Tokens and Scopes

2 Likes

I’ve seen a few references to the old Railscasts theme (also known as Twilight), I’ve been using Predawn Twilight which is a little softer and looks great on Elixir!

@axelson @Dusty Apologies for taking a whole comment to thank you guys. Legends

2 Likes

Atom One Light / Atom One Dark

I created a higher contrast version of Dark+ called Darkest+, and added some more colors to the default set to make elixir code a little easier to parse (for me, this is completely subjective). This is an example of what some elixir code looks like in the italic variant:

(colors look a little washed out in the screenshot, not sure why)

I used the Github Theme for some time and just recently switched to Night Owl.

1 Like

Currently I use iPlastic with following modifications.

    "editor.tokenColorCustomizations": {
        "[iPlastic]": {
            "textMateRules": [
                {
                    "scope": "entity.name.function",
                    "settings": {
                        "foreground": "#ff5100",
                        "fontStyle": "bold"
                    }
                },
                {
                    "scope": "code-runner.output",
                    "settings": {
                        "foreground": "#bbb"
                    }
                }
            ]
        },
    },
    "workbench.colorCustomizations": {
        "[iPlastic]": {
            "editor.background": "#f5f5f5",
            "panel.background": "#1D2021",
            "panelTitle.activeForeground": "#ccc",
            "statusBar.background": "#1D2021",
            "tab.inactiveBackground": "#ddd",
            "terminal.foreground": "#A89984",
            "terminalCursor.background": "#000000",
            "terminalCursor.foreground": "#A89984",
            "terminal.ansiBlack": "#1D2021",
            "terminal.ansiBlue": "#0D6678",
            "terminal.ansiBrightBlack": "#665C54",
            "terminal.ansiBrightBlue": "#0D6678",
            "terminal.ansiBrightCyan": "#8BA59B",
            "terminal.ansiBrightGreen": "#95C085",
            "terminal.ansiBrightMagenta": "#8F4673",
            "terminal.ansiBrightRed": "#FB543F",
            "terminal.ansiBrightWhite": "#FDF4C1",
            "terminal.ansiBrightYellow": "#FAC03B",
            "terminal.ansiCyan": "#8BA59B",
            "terminal.ansiGreen": "#95C085",
            "terminal.ansiMagenta": "#8F4673",
            "terminal.ansiRed": "#FB543F",
            "terminal.ansiWhite": "#A89984",
            "terminal.ansiYellow": "#FAC03B",
            "terminal.background": "#1D2021",
            "titleBar.inactiveBackground": "#ddd",
            "titleBar.inactiveForeground": "#ddd"
        },
    }

If you are in the habit of keeping your computer at lower brightness, then set editor.background equal to #fff or #fafafa instead of #f5f5f5.

Dark+Elixir

I had a great experience with gruvbox, is an amazing theme.