https://github.com/sdras/night-owl-vscode-theme
π NIGHT OWL: A VS Code dark theme for contrast for nighttime coding, π¦ LIGHT OWL: a daytime light theme
https://github.com/sdras/night-owl-vscode-theme
dark-syntax-theme dark-theme dark-vscode-theme editor-theme night night-owl owl theme vscode vscode-theme
Last synced: about 1 month ago
JSON representation
π NIGHT OWL: A VS Code dark theme for contrast for nighttime coding, π¦ LIGHT OWL: a daytime light theme
- Host: GitHub
- URL: https://github.com/sdras/night-owl-vscode-theme
- Owner: sdras
- License: mit
- Created: 2018-05-17T05:06:45.000Z (almost 7 years ago)
- Default Branch: main
- Last Pushed: 2024-12-31T22:23:48.000Z (4 months ago)
- Last Synced: 2025-01-30T06:23:41.032Z (3 months ago)
- Topics: dark-syntax-theme, dark-theme, dark-vscode-theme, editor-theme, night, night-owl, owl, theme, vscode, vscode-theme
- Homepage: https://aka.ms/nightowl
- Size: 3.38 MB
- Stars: 2,848
- Watchers: 26
- Forks: 246
- Open Issues: 42
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome - night-owl-vscode-theme - πNIGHT OWL: A VS Code dark theme for contrast for nighttime coding, π¦LIGHT OWL: a daytime light theme (Others)
- my-awesome-list - night-owl-vscode-theme
- awesome-starred-test - sdras/night-owl-vscode-theme - π NIGHT OWL: A VS Code dark theme for contrast for nighttime coding, π¦ LIGHT OWL: a daytime light theme (Others)
- awesome-list - night-owl-vscode-theme
README
# Night Owl π


[](https://vscode.dev/theme/sdras.night-owl)A Visual Studio Code theme for the night owls out there. Fine-tuned for those of us who like to code late into the night. Color choices have taken into consideration what is accessible to people with colorblindness and in low-light circumstances. Decisions were also based on meaningful contrast for reading comprehension and for optimal razzle dazzle. β¨
As of 1.0.0, there's a Light Owl Theme too! Color balanced from the Dark version for easy viewing in daylight. π
About this theme, and some of the considerations made while creating it (as well as _how_ to create it should you want to make your own): [https://css-tricks.com/creating-a-vs-code-theme/](https://css-tricks.com/creating-a-vs-code-theme/)
## Night Owl

## Light Owl

# Installation
1. Install [Visual Studio Code](https://code.visualstudio.com/)
2. Launch Visual Studio Code
3. Choose **Extensions** from menu
4. Search for `night owl`
5. Click **Install** to install it
6. Click **Reload** to reload the Code
7. From the menu bar click: Code > Preferences > Color Theme > **Night Owl**## Disable Italics
If you wish to disable italics, there is now a no-italic theme available. You will have access to both, select **Night Owl No Italics** as your color theme.
## Other versions
The community is awesome and has ported this theme over to other environments.
#### Dark Theme
- Hyper: [https://github.com/pbomb/hyper-night-owl](https://github.com/pbomb/hyper-night-owl)
- iTerm2
1. [https://github.com/nickcernis/iterm2-night-owl](https://github.com/nickcernis/iterm2-night-owl)
2. [https://github.com/jsit/night-owl-iterm2-theme](https://github.com/jsit/night-owl-iterm2-theme)
3. [https://github.com/florianeckerstorfer/night-owl-itermcolors](https://github.com/florianeckerstorfer/night-owl-itermcolors)
4. [https://github.com/andrewfluck/night-owl-iterm2](https://github.com/andrewfluck/night-owl-iterm2)
- Xresources: [https://github.com/alochaus/night-owl-xresources-theme](https://github.com/alochaus/night-owl-xresources-theme)
- Atom: [https://atom.io/themes/night-owl-vs-code-syntax](https://atom.io/themes/night-owl-vs-code-syntax)
- Jetbrains: [https://github.com/xdrop/night-owl-jetbrains](https://github.com/xdrop/night-owl-jetbrains)
- Emacs: [https://github.com/aaronjensen/night-owl-emacs](https://github.com/aaronjensen/night-owl-emacs)
- Vim
1. [https://github.com/Khaledgarbaya/night-owl-vim-theme](https://github.com/Khaledgarbaya/night-owl-vim-theme)
2. [https://github.com/haishanh/night-owl.vim](https://github.com/haishanh/night-owl.vim)
- Pygments [https://github.com/liamdawson/nightowl-pygments-style](https://github.com/liamdawson/nightowl-pygments-style)
- Alfred: [https://github.com/jbharat/night-owl-alfred-theme](https://github.com/jbharat/night-owl-alfred-theme)
- Ulauncher: [https://github.com/christoph-fricke/ulauncher-night-owl-theme](https://github.com/christoph-fricke/ulauncher-night-owl-theme)
- TextMate [https://github.com/batpigandme/night-owlish](https://github.com/batpigandme/night-owlish/tree/master/tmTheme)
- Ace Editor [https://github.com/batpigandme/night-owlish](https://github.com/batpigandme/night-owlish/tree/master/aceTheme)
- RStudio [https://github.com/batpigandme/night-owlish](https://github.com/batpigandme/night-owlish/tree/master/rstheme)
- Insomnia [https://github.com/yoannfleurydev/insomnia-plugin-night-owl-theme](https://github.com/yoannfleurydev/insomnia-plugin-night-owl-theme)
- Sublime Text 3 [https://github.com/VonHeikemen/night-owl-sublime-scheme](https://github.com/VonHeikemen/night-owl-sublime-scheme)
- Slack [https://github.com/clouby/night-owl-slack](https://github.com/clouby/night-owl-slack)
- Xcode [https://github.com/stealthanthrax/xcode-Night-Owl](https://github.com/stealthanthrax/xcode-Night-Owl)
- Visual Studio 2019: [https://github.com/kai-oswald/NightOwl-VS-Theme](https://github.com/kai-oswald/NightOwl-VS-Theme)
- Visual Studio 2022: [https://github.com/SumitKar01/NightOwl-Theme-VS-2022](https://github.com/SumitKar01/NightOwl-Theme-VS-2022)
- Prism [https://github.com/SaraVieira/prism-theme-night-owl](https://github.com/SaraVieira/prism-theme-night-owl)
- Windows Terminal [https://github.com/edurojasr/Windows_Terminal_Theme_Night_Owl](https://github.com/edurojasr/Windows_Terminal_Theme_Night_Owl)
- Alacritty: [https://github.com/alacritty/alacritty](https://github.com/alacritty/alacritty/wiki/Color-schemes)
- Terminology: [https://github.com/LividJava/night-owl-terminology](https://github.com/LividJava/night-owl-terminology)
- Gnome Terminal: [https://github.com/edurojasr/night-owl-gnome-terminal](https://github.com/edurojasr/night-owl-gnome-terminal)
- Kitty [https://github.com/Glazy/night-owl-kitty-theme](https://github.com/Glazy/night-owl-kitty-theme)
- Ghostty [https://github.com/m1yon/ghostty-night-owl](https://github.com/m1yon/ghostty-night-owl)#### Light Theme
- iTerm2: [https://github.com/fcaldera/night-owl-light-iterm2](https://github.com/fcaldera/night-owl-light-iterm2)
- Vim: [https://github.com/macguirerintoul/night_owl_light.vim](https://github.com/macguirerintoul/night_owl_light.vim)
- Tilix: [https://github.com/johanhammar/light-owl-tilix](https://github.com/johanhammar/light-owl-tilix)
- Alacritty: [https://github.com/nik27/night-owl-alacritty-theme](https://github.com/nik27/night-owl-alacritty-theme)
- Ghostty: [https://github.com/m1yon/ghostty-night-owl](https://github.com/m1yon/ghostty-night-owl)## Separate the Editor from the Sidebar
This theme uses contrast sparingly so that when it's applied, it's more meaningful. This can help reduce noise and improve your ability to scan. However, some of the decisions may not work for everyone. One such decision that some disagree on is whether or not to have a separation between the editor and sidebar, and the amount of contrast. If you wish for this to have more visual significance, please paste this into your user settings preferences. These are my recommendations for these settings but you can use whatever colors you wish. βΊοΈ
```
"workbench.colorCustomizations": {
"[Night Owl]": {
"activityBar.background": "#000C1D",
"activityBar.border": "#102a44",
"editorGroup.border": "#102a44",
"sideBar.background": "#001122",
"sideBar.border": "#102a44",
"sideBar.foreground": "#8BADC1"
},
"[Night Owl (No Italics)]": {
"activityBar.background": "#000C1D",
"activityBar.border": "#102a44",
"editorGroup.border": "#102a44",
"sideBar.background": "#001122",
"sideBar.border": "#102a44",
"sideBar.foreground": "#8BADC1"
}
},
```## Preferences shown in the preview
The font in the preview image is Dank Mono, [available here](https://philpl.gumroad.com/l/dank-mono). Editor settings to activate font ligatures:
```
"editor.fontFamily": "Dank Mono",
"editor.fontLigatures": true,
```## Misc
This is my first foray into creating a theme, so if you see something amiss, please feel free to [file an issue](https://github.com/sdras/night-owl-vscode-theme/issues)! I'm sure there are things I missed.
If you use [the VS Code Babel extension](https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel), you may see some inconsistencies in color for JSX, that's not coming from this theme.
Any relevant changes for each version are documented in the changelog. Please update and check the changelog before filing any issues, as they may have already been taken care of.
This palette was inspired in part by Material Palenight [Theme](https://marketplace.visualstudio.com/items?itemName=whizkydee.material-palenight-theme), and the accessibility idea was inspired in part by Solarized [Themes](http://ethanschoonover.com/solarized)