Skip to content

2jacobtan/my-recommendations

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

48 Commits
 
 

Repository files navigation

Fonts (all with ligature support)

• JetBrains Mono: main site | github release

Pragmatic, no-frills, elegant design optimised for easy/fast reading. Unique feature: rectangular characters allow eyes to smoothly scan through text.

• Like JetBrains Mono, but with more "character" (less strictly rectangular character designs)

Fira Code | Cascadia Code | Hasklig (variant of Source Code Pro with added ligatures)

• Victor Mono (narrow; cursive italics) | github release

font weight

In text editor, tweak font weight setting for optimum clarity on computer screen.

extra reference https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight#common_weight_name_mapping

VSCode

Themes

Sorted by popularity https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Installs

I like Noctis Lux at daytime. All dark themes here are great for nighttime, many also good for daytime.

vividly coloured

Ayu - by teabyii (dark; light)

Choice of background brightness level (bordered, mirage, dark).

Includes icon theme that can be applied separately. "Opened folder" icon is nice.

Family: Ayu Green | Ayu Baby Blue | Ayu Mirage Plus

Moonlight II - by atomiks (dark)

Vast semantic highlight colour variety (e.g. JSON). Optional italics. Medium contrast.

Similar feel to Ayu, but with blue and orange switched.

After Dark - by Simeon Kerkola (deep dark)

Optimised for low-light environment. Medium contrast, low brightness. [no colour preset for data constructors]

Needs some tweaks for colour variety. (see customizing a colour theme section below)

unique style

Vim Theme - by HarryHopkinson (dark; light)

Warm colour temperature. Choice of contrast level (soft, medium, hard). [Is one amongst several Gruvbox clones.]

Noctis - by Liviu Schera (dark; light)

Fancy package with many colour filters.

simple and elegant

Atom One Dark Theme - by Mahmoud Ali (dark)

Neutral, soft colours. Unassumingly easy on the eyes. [no colour preset for operators, see customizing a colour theme section below]

Family: Atom One Dark Coal - by shiftybody | One Dark Pro - by binaryify | One Dark Vivid - by Kevin Kozee

Night Owl - by sarah.drasner (dark; light version less popular)

Cool colour temerature. Dark theme is well-calibrated for low-light clarity (high contrast).

Monokai Pro - by Monokai original author (dark)

Pragmatic colour scheme. Normal shades of red, green, blue, orange clearly denote different elements.

Has several useful filters to tweak colour temperature and brightness.

Includes icon theme that can be applied separately.

Free trial with occasional nag to pay. [no colour preset for data constructors]

built-in/pre-installed themes (the good ones)

• Solarized {Light,Dark}

Muted control flow keyword colours. "Boring," but it works.

• Tomorrow Night Blue (dark, high contrast)

Bright font, high contrast. [no colour preset for data constructors]

hidden gems

RubyBlue Theme - by hirofumii (dark, high contrast)

Zeonica - by Andrew Vallette (dark; colourful)

colourblind friendly

GitHub Theme - by GitHub (dark; light)

Wide range of contrast levels (dark, dimmed, default, high contrast, colorblind).

Red, blue, purple. No green. A basic colour scheme great for colourblindness.

customizing a colour theme

https://code.visualstudio.com/docs/getstarted/themes#_customizing-a-color-theme

Use this to customize each theme (lighten comments colour, add operator colour, etc.):

  "workbench.sideBar.location": "right",
  "workbench.colorCustomizations": {
    "editor.selectionBackground": "#aaa6",
    "editor.selectionForeground": "#f008", //only works for high contrast
    "editor.selectionHighlightBorder": "#808080",
    "editor.selectionHighlightBackground": "#0ff3",
    // "editor.hoverHighlightBackground": "#bbb3",
    "[Ayu Mirage Plus]":{
      "editor.background": "#242936"
    },
    "[*Dark*]": {
      "editorCursor.background": "#000",
      "editorCursor.foreground": "#fffc"
    },
    "[After Dark*]": {
      "scrollbarSlider.hoverBackground": "#fff2",
      "scrollbarSlider.activeBackground": "#fff2",
      "scrollbarSlider.background": "#fff2",
      // "scrollbar.shadow": "#ff0000",
    }
    // "[After Dark*]": {
    //   "terminal.background": "#192430",
    //   "editor.background": "#242936",
    //   "editorRuler.foreground": "#2f3646",
    //   "editorIndentGuide.background": "#2f3646"
    // }
  },
  "editor.tokenColorCustomizations": {
    "[Ayu Mirage Plus]": {
      // "comments": "#789",
      "comments": "#B8CFE680",
      "textMateRules": [
        { "scope":"keyword.operator",
          "settings": {
            "foreground": "#F29E74",
          }},
        { "scope":"keyword.other",
          "settings": {
            // "foreground": "#F29E74",
            "fontStyle": ""
          }}]
    },
    "[Ayu*]": {
      "textMateRules": [
        { "scope":"keyword.control",
          "settings": {
            // "foreground": "#e30",
            "fontStyle": "italic bold"
          }},
        { "scope":"entity.name",
          "settings": {
            "foreground": "#b9f",
            "fontStyle": "bold"
          }},
        // { "scope":"source",
        //   "settings": {
        //     "foreground": "#CBCCC6",
        //   }},
        { "scope":"storage.type",
          "settings": {
            // "foreground": "#95E6CB", // can't be changed
            "fontStyle": "italic"
          }},
        // { "scope":"constant.other",
        //   "settings": {
        //     "foreground": "#73D0FF",
        //   }}
        ]
    },
    "[Moonlight*]": {
      "textMateRules": [
        { "scope":"keyword.control",
          "settings": {
            // "foreground": "#bb5235",
            "fontStyle": "italic bold"
          }},
        { "scope":"keyword.other",
          "settings": {
            // "foreground": "#75afff"
            // "foreground": "#4af"
            // "foreground": "#65BCFF"
            // "foreground": "#C099FF" // original
          }},
        { "scope":"entity.name",
          "settings": {
            "fontStyle": "bold",
            "foreground": "#fb9de7"
          }}]
    },
    "[Vim*]": {
      "textMateRules": [
        { "scope":"keyword.control",
          "settings": {
            "fontStyle": "italic bold"
          }},
        { "scope":"storage.type",
          "settings": {
            "fontStyle": "italic"
          }}]
    },
    "[Noctis*]": {
      "textMateRules": [
        { "scope":"keyword.control",
          "settings": {
            // "foreground": "#e30",
            "fontStyle": "italic bold"
          }},
        { "scope":"keyword.operator",
          "settings": {
            "foreground": "#d1b81a",
            "fontStyle": ""
          }},
        { "scope":"storage.type",
          "settings": {
            // "foreground": "#eb7",
            "fontStyle": "italic"
          }}]
    },
    "[Monokai Pro]": {
      "comments": "#999"
    },
    "[*One Dark*]": {
      "textMateRules": [
        { "scope": "keyword.operator",
          "settings": {
            // "foreground": "#e40"
            // "foreground": "#f88"
            // "foreground": "#4c8"
            // "foreground": "#48f"
            "foreground": "#7cf"
            // "foreground": "#99f"
            // "foreground": "#faf"
          }}]
    },
    "[After Dark*]": {
      "comments": "#89a",
      "textMateRules": [
        { "scope":"keyword.other",
          "settings": {
            "foreground": "#5bf"
          }},
        { "scope":"keyword.operator",
          "settings": {
            "foreground": "#d9b",
          }},
        { "scope":"keyword.control",
          "settings": {
            "fontStyle": "italic bold",
            "foreground": "#d9b"
          }},
        { "scope":"constant.other",
          "settings": {
            "foreground": "#ea6",
          }},
        { "scope":"storage.type",
          "settings": {
            "foreground": "#ec7",
            "fontStyle": "italic"
        }},
        { "scope":"entity.name",
          "settings": {
            "fontStyle": "bold",
            "foreground": "#BA7BCC"
        }}]
    },
    "[After Dark No Italics]": {
      "textMateRules": [
        { "scope": "comment",
          "settings": {
            "fontStyle": ""
          }},
        { "scope":"storage.type",
          "settings": {
            "fontStyle": ""
          }}]
    }
  },
  "terminal.integrated.cursorBlinking": true

(add to settings.json)

extensions

VSpaceCode - Spacemacs like keybindings for Visual Studio Code (+ Vim emulation)

my settings.json entries for the Vim extension:

  "vim.camelCaseMotion.enable": true,
  "vim.easymotion": true,
  "vim.easymotionKeys": "aoeuidhtns,pyfgcrl;qjkxbmwvz",
  "vim.replaceWithRegister": true,
  "vim.sneak": true,
  "vim.sneakUseIgnorecaseAndSmartcase": true,
  "vim.handleKeys": {
    "<C-w>": false,
    "<C-a>": false,
    "<C-x>": false,
    "<C-j>": false,
    "<C-l>": false,
    "<C-c>": false,
    "<C-k>": false,
    "<C-[>": false,
    "<C-]>": false,
    // "<C-pageup>": false,
    // "<C-pagedown>": false,
  },
  
  "vim.visualstar": true,
  "vim.hlsearch": true,
  "vim.highlightedyank.enable": true,
  "vim.showMarksInGutter": true,
  "vim.searchMatchColor": "rgba(120,255,255,0.9)",
  "vim.searchMatchTextColor": "hsl(0,0%,0%)",
  "vim.searchHighlightColor": "hsl(0,0%,50%)",
  "vim.searchHighlightTextColor": "rgba(120,255,255,0.9)",
  "vim.textwidth": 79,

• utilities : Font Switcher | Bookmarks | Rainbow Highlighter | Tab out of quotes, brackets, etc | Draw.io Integration

About

dev tool recommendations

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published