VS Code: Good Enough Light Themes
Tags: vscode, themes
Published: 2021-05-09 10:28:06

## No theme out there is best, so what makes them good enough?

- Good contrast ratio between background and foreground colors.
- Adequate set of colors to identify keywords of a particular language.
- A light color to highlight the current line. 
- High text legibility on every component of the application.
- Good contrast ratio between Title Bar, Side Bar, Files Menu, Tabs and Footer to separate them out.
- Overall package should be easy on the eyes.

Presenting to you my collection of hand-picked light color themes for VS Code. All of them have been tested against the parameters above. I hope you like them.

# 1. [JetJet - Light](https://marketplace.visualstudio.com/items?itemName=JohnyGeorges.jetjet-theme)
---

Authored by [Johny Georges](https://marketplace.visualstudio.com/publishers/JohnyGeorges), it comes within a set of 5 themes. Built on top of default VS Code Light theme, it offers a pleasing background color with good text legibility. However, sometimes I find it hard to highlight current tab which is permissible considering it fares well on other parameters.

Javascript
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wuk0ow1wxotrzkzx1jof.PNG)

HTML
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ncsuag7mw4s5dfc23yt1.PNG)

CSS
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vi7f3j2l1v3kt3kge7e1.PNG)

# 2. [Winter is Coming - Light](https://marketplace.visualstudio.com/items?itemName=johnpapa.winteriscoming)
---


Authored by [John Papa](https://marketplace.visualstudio.com/publishers/johnpapa), it comes within a set of 6 themes. It offers a duotone outlook and distinguishes well the various parts of the editor, text legibility is also good, fares well on the parameters. However, the borders around highlighted tabs and icons in the navigation panel look annoying to me.

Javascript
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9k8vgucvav2rv040mepz.PNG)

HTML
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/egxo6urafxpj4dmp1kkh.PNG)

CSS
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mmr36k2kjr3v3z4u5oiu.PNG)

# 3. [Atom One - Light](https://marketplace.visualstudio.com/items?itemName=akamud.vscode-theme-onelight)
---

Extracted from the [Atom](https://github.com/atom) editor, it comes as a standalone theme. It has a flattish outlook and manages to highlight well the various parts of the editor, fares equally well on the parameters as other themes.

Javascript
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ng2ergolkhlrygn3u0vx.PNG)

HTML
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hdiz1j0bsjy74cklgwlh.PNG)

CSS
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fnde03uapi15qryqy7jz.PNG)

# 4. [GitHub Sharp](https://marketplace.visualstudio.com/items?itemName=joaomoreno.github-sharp-theme)
---

Authored by [Joao Moreno](https://marketplace.visualstudio.com/publishers/joaomoreno), it is a fork of the [GitHub Plus](https://marketplace.visualstudio.com/items?itemName=thenikso.github-plus-theme) theme. The duotone look distinguishes well the exteriors and interiors of the editor. It offers a pleasing color scheme. No complaints so far from it.

Javascript
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tesviet5mlgf6pnxqfcl.PNG)

HTML
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/spvr4lp8zotxawojp0bg.PNG)

CSS
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5308gjx9ow9ynhtm04np.PNG)

*Cover Photo by [Artem Sapegin](https://unsplash.com/@sapegin?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/code?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)*