sdras / night-owl-vscode-theme Goto Github PK
View Code? Open in Web Editor NEWπ NIGHT OWL: A VS Code dark theme for contrast for nighttime coding, π¦ LIGHT OWL: a daytime light theme
Home Page: https://aka.ms/nightowl
License: MIT License
π NIGHT OWL: A VS Code dark theme for contrast for nighttime coding, π¦ LIGHT OWL: a daytime light theme
Home Page: https://aka.ms/nightowl
License: MIT License
Is there a reason why there isn't a tagged release? Love this theme by the way. I pretty excited about it.
@clarkio mentioned that prompts are not correct, here's a gif:
Thanks so much for this theme @sdras! I've been enjoying it thus far! π
One thing I just noticed is that most (if not all) of the other themes have a vertical line to help distinguish block scope. I have never jumped into the theme making world, so have no clue how this is done, but if it's not too much of a bother I'd like to make the suggestion of adding this to your Night Owl theme. Thank you for your consideration! π
Notice a vertical line to help distinguish block scope.
Notice no vertical line.
Just a short note on ordering your changelog that it helps readers to see what the recent changes are by ordering them in descending order.
Not sure it is common with VS Code extensions but a good many that I use the descending order....just gives quicker reference to the latest fixes without having to scroll down.
My eyes are loving the theme π₯ π
Thanks for creating and sharing this theme.
Are the screenshots in this README up to date? I was excited to try this for some cool colors but higher contrast because I work outdoors a lot. However after I installed it, everything is not nearly as bright as the screenshots.
Inside of a deeply nested object literal in TS, the booleans are italicized:
Also, variable.other.object.property
and variable.other.property
should be treated the same?
Here's the TS file: http://jmp.sh/5aVMmPt
Theme looks awesome. But, it would be great if you have an alternative version using a free font.
Congrats!
Sadly the preview image in the Readme.md is broken (file does not exists).
Hi,
Just installed this theme saw in trending it is good, but i notice one thing weird color on my tab area if its tab visibility hidden
tab color when i set tab visibility to hidden
Screenshot tab visibliey hiddeen
tab color when i set tab visibility to visible
Screenshot tab visibily visible
as its look good if i set tab visiblity to visible, but if i set that hidden that look weird.
Love your theme! It's finally convinced me to switch back to a dark one.
There is one small annoyance, though. In Rust, you can write an anonymous function with no parameters that returns 42 like this || 42
. In expression contexts, ||
is also boolean OR. So, I was quite surprised to see the double-pipe set in italic -- which looks like //
, the start of a line comment.
The span in question looks like this:
<span class="mtk3 mtki">||</span>
Maybe you can either make operators non-italic in Rust or special case this case if possible?
Hello! Thank you for such an amazing theme π
Would you consider increasing the color contrast for the inactive line number? The numbers are a bit hard to see against the background. For example, the numbers 10 and 12 are a little hard to see in the following image:
This isn't a problem when you're coding by yourself. However, I've found that my coworkers and I have a hard time finding line numbers when we're looking at the same screen and we refer to line numbers (i.e. "check out line X").
Thank you for taking the time to read this issue and considering it! Furthermore, I believe the following are the configuration settings that might need to be changed in order to fix this issue if it's accepted: editorLineNumber.foreground
and editorLineNumber.activeForeground
.
Hi! First of all, thanks for this incredible theme. It has been a blast to use.
I found an issue with list rendering. On the command list (cmd+shift+P), the focus (through keyboard navigation) indicator relies on a dotted border on the highlighted item:
But, on "secondary" lists, such as those generated by plugins, there is no dotted border, and the focus isn't really visible because "list.focusBackground": "#5f7e9700"
means no opacity. Example from the 'Advanced New File' plugin (but I found it on other lists):
I guess the way to fix this would be adding the dotted border on these lists too, and I would be happy to PR for it, but I honestly don't know how to.
I can not find the theme in my local VS Code or online in the search of the marketplace (https://marketplace.visualstudio.com/search?term=night-owl-vscode-theme&target=VSCode&category=All%20categories&sortBy=Relevance).
reported from twitter
it's not an issue. I've made these changes of colors to make it fit my needs
thought it might be helpful
"diffEditor.insertedTextBackground": "#99b76d20", "diffEditor.removedTextBackground": "#ef535020", "diffEditor.insertedTextBorder": "#00000000", "diffEditor.removedTextBorder": "#00000000", "tab.activeForeground": "#00ccff", "tab.inactiveForeground": "#5f7e9799", "editor.selectionHighlightBackground": "#ffffff22", "editorIndentGuide.background": "#05508d22", "editorGutter.background": "#00000011", "sideBar.background": "#011423", "editorHoverWidget.background": "#01111e", "panel.border": "#5f7e9728",
Hi Sarah,
great theme, I really enjoy using it. However, there is a small annoyance I observed:
As you can see, the increment operator ++
(--
is affected, too) has the same color as the value it is applied to, making it easy to miss while quickly scanning code.
I suggest giving them a different color (maybe the purple used for other math symbols?) to make them stand out more.
Thanks for making this theme :)
First off, thanks for working hard on bringing a new theme to the community that really feels truly original in the wide sea of theme options!
In JavaScript (and possibly other languages), there is a color duplication between keywords and object keys. This reduces the visibility of keywords, since they don't have a unique color by which to identify them.
The debugger
statement is not easily discernible among the object keys using the same color.
For reference, here's the default dark theme from code:
It's interesting to note that they use a lighter version of the keyword. Maybe that's an idea to riff off? Take it wherever you want to, but I thought I would at least offer some potential inspiration.
While playing with example code, I noticed that there are keywords that use a different color, like in a for..of
loop:
This seems consistent with other themes like the default dark (again):
What seems different is how the alt color is used. You're certainly welcome to approach this however you see fit, but it appears that there are subclasses of keywords. My first concern with a theme is about instant control flow recognition, so I like when themes are consistent in how they group the coloration of things. On a sub-side note, you can also see that class types have some special coloration here.
Just to let you know that Night Owl's already been ported to iTerm 2 and Hyper:
Could be mentioned in the readme or wiki, perhaps? Or not! That is fine too. :-)
Thanks for working on this great theme! I am loving it.
I would like to suggest adding a border between the editor and the explorer or have a different background color for the explorer to provide a nice separation.
First thing: Thank you very much, really nice theme. I used to switch themes depending on the project type. Now I have a couple weeks without switching, they just look great on Night Owl π
I also use VS Code for almost every text editing, and I do a lot of Powershell. And PS scripts looks... kinda funny.
Hope you find some time to check it out. Thanks again for your effort!
People have mentioned that they're hard to see.
Feature request:
I like Fira Code more than Dank Mono. This theme make keywords show up in italics, is there any way for me to disable that?
Specifically in Ruby:
Class definitions keep scope resolution coloring, I think most other color palettes give the two sides of the :: two different colors. However in invocation, the two are colored properly, unless I invoke .new
, in which case it goes back to the same color.
calling a function with a symbol as an arg is the same color, I would have expected a different color to for better contrast.
Otherwise I love the theme! It looks great!
Example here:
https://twitter.com/kentcdodds/status/999779167053856770
Thank you for the great theme. I just wanna bring up one suggestion: when writing JSX, React elements and HTML elements have the same tag color:
Night Owl:
whereas in Material Theme Ocean:
I'm not sure if the design is intentional. Having separate colors helps me when writing JSX. I hope you can consider implementing this in the future or help guide me to tweak this myself. Thanks.
I was testing out your theme (thank you!) while writing some tests π¬and saw this use case which I personally found offputting, so I thought I'd bring it up:
Nested square brackets are italicized which particularly looks kind of funny when juxtaposed against other kinds of brackets, e.g., curly, as shown below.
I don't know if it's by design or not, but in any case, I thought I'd just put it out there. Plus, I realize it can easily be disabled in settings. Thank you for your work!
ππ»
Files in the file explorer that have been .gitignored tend to be colored in a muted way, with less contrast against the background, in most themes. With Night Owl, they feel almost more pronounced in color and I find it a bit distracting to me. Maybe there's a darker blue that still gives enough contrast to be readable?
Screenshots of this theme & Dark "(Visual Studio)":
Right-click on a symbol and select Peek Declaration. The highlighted text in the list of results has no contrast against the background. (Peek Declaration may be specific to the C/C++ extension when Intellisense is configured for the project. I can provide whatever you need if you don't have code where this shows up.)
Okay, so here's a weird one for you.
If you open up vim in the integrated terminal, and highlight some text via Vim's visual mode that isn't styled, it'll vanish (I think because it turns the text the same color as the background, not that the highlight is covering it up though I can't be sure).
I made a video to illustrate the problem https://cthos-backups.nyc3.digitaloceanspaces.com/images/vim_visual_mode.mp4
And here are some screenshots:
I know it sounds a bit strange, but I would love a light version of this theme. I often find myself programming in bright environments where I simply can not see dark themes very good. However, this theme is so meticulously crafted that I would love a version which I could still use in such an environment.
At the moment I use Monokai Light or Gitbub Clean White for this.
Like this tweet specifies: https://twitter.com/KevinDavus/status/997263930203389952
"workbench.colorCustomizations": {
"panel.border": "#7e57c2"
}
Hi @sdras, I love the Night Owl Vscode theme you made. Let me create a logo for this project. Thanks :)
When I'm on the Source Control side bar, pressing ctrl+B
to toggle it causes the following error:
Cannot read property 'setVisible' of undefined
VS Code version: Code 1.23.1 (d0182c3417d225529c6d5ad24b7572815d0de9ac, 2018-05-10T16:04:33.747Z)
OS version: Linux x64 4.15.0-20-generic
Item | Value |
---|---|
CPUs | Intel(R) Core(TM) i7-7600U CPU @ 2.80GHz (4 x 2900) |
GPU Status | 2d_canvas: enabled flash_3d: enabled flash_stage3d: enabled flash_stage3d_baseline: enabled gpu_compositing: enabled multiple_raster_threads: enabled_on native_gpu_memory_buffers: disabled_software rasterization: disabled_software video_decode: unavailable_software video_encode: enabled vpx_decode: unavailable_software webgl: enabled webgl2: enabled |
Load (avg) | 2, 2, 2 |
Memory (System) | 15.39GB (1.09GB free) |
Process Argv | /usr/share/code/code --unity-launch |
Screen Reader | no |
VM | 0% |
Extension | Author (truncated) | Version |
---|---|---|
vscode-toggle-quotes | Bri | 0.3.1 |
bracket-pair-colorizer | Coe | 1.0.50 |
vscode-markdownlint | Dav | 0.16.0 |
EditorConfig | Edi | 0.12.2 |
code-settings-sync | Sha | 2.9.2 |
project-manager | ale | 0.25.2 |
vscode-custom-css | be5 | 2.7.0 |
npm-intellisense | chr | 1.3.0 |
path-intellisense | chr | 1.4.2 |
mustache | daw | 1.1.1 |
jshint | dba | 0.10.18 |
vscode-eslint | dba | 1.4.9 |
githistory | don | 0.4.1 |
eslint-disable-snippets | drK | 1.1.4 |
gitlens | eam | 8.3.0 |
tslint | eg2 | 1.0.29 |
vscode-npm-script | eg2 | 0.3.4 |
prettier-vscode | esb | 1.3.1 |
auto-close-tag | for | 0.5.6 |
vsliveshare | ms- | 0.3.125 |
debugger-for-chrome | msj | 4.4.3 |
vscode-code-outline | pat | 0.2.1 |
vscode-icons | rob | 7.23.0 |
vscode-fileutils | sle | 2.8.1 |
es6-mocha-snippets | spo | 0.1.3 |
addDocComments | ste | 0.0.8 |
vscode-import-cost | wix | 2.6.2 |
ReactSnippets | xab | 2.1.0 |
(3 theme extensions excluded)
Not sure if "weird" is the right word, but:
The circled areas should be self-explanatory, but I'll express here in words what they're about:
I'd say either all of these wrapping-kind of pairs of characters should be in italics, or none. I'm referring specifically to ()
, {}
, []
, and leaving string quotes out of the equation. In particular, the fact that parenthesis are put in italics some times and not in all situations, and square brackets are in italic but braces are not, seems odd.
Thoughts?
A windows user reported needing git to install, that should not be the case.
Not high priority, details here:
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.