项目作者: swashata

项目描述 :
A set of beautiful color themes for VSCode, inspired by Sublime DA UI.
高级语言: JavaScript
项目地址: git://github.com/swashata/vscode-beautiful-ui.git
创建时间: 2018-05-02T17:44:04Z
项目社区:https://github.com/swashata/vscode-beautiful-ui

开源协议:MIT License

下载


VSCode Beautiful UI - Color Themes

codecov Build Status VSCode Version VSCode Install VSCode Rating






A collection of 32 VSCode themes inspired from
the awesome Sublime DA CS.

I am not at all the original author of the color scheme. This project was born
out of a necessity. I was a user of Sublime Text and Sublime DA UI for a long time.

Due to many reasons (mainly VSCode’s intellisense and JS friendliness) I had to
switch to VSCode and the only thing I felt missing was the awesome UI engine made
by Ihor Oleksandrov and compatible themes.

So this is my attempt to fill the gap. Personally I’ve been using Tomorrow Night
theme for a long time and I have put effort to port as many themes as possible.

  • I am not original author of any of the color schemes.
  • Syntax highlighting differs from the DA UI and DA CS, but I have managed to keep as much as possible. Also in some cases I have increased the darkness of colors for light themes.
  • If you like any color theme, go and ❤️ the original authors.

Installation

You can install manually from git or use the vscode extensions marketplace.

Marketplace Installation

From command palette, run

  1. ext install swashata.beautiful-ui

Or search for Beautiful UI in the marketplace and install from there.

Git Installation

  • Go to ~/.vscode/extensions/
  • Clone the repository.
    1. git clone git@github.com:swashata/vscode-beautiful-ui.git

Activation

After installation, open/restart vscode and from command palette search for
βui -. You can choose and apply the color theme of your choice.

Customization

Workspace colors can be customized by editing workbench.colorCustomizations
user settings. More information can be found here.

Following extensions/tools are recommended for the color schemes.

Also note the recommended user settings.

  1. {
  2. "workbench.iconTheme": "vscode-icons",
  3. "editor.fontFamily": "Operator Mono SSM Lig",
  4. "editor.lineHeight": 25,
  5. "editor.fontLigatures": true,
  6. "explorer.decorations.badges": false,
  7. "editor.fontSize": 14,
  8. "editor.letterSpacing": 0.5,
  9. "editor.fontWeight": "400",
  10. "editor.renderWhitespace": "none",
  11. "workbench.statusBar.feedback.visible": false,
  12. "editor.rulers": [
  13. 80,
  14. 100,
  15. 120
  16. ],
  17. "whiteviz.maximumLimit": 500,
  18. "whiteviz.expandedTabIndicator": false,
  19. "editor.occurrencesHighlight": true,
  20. "workbench.tree.horizontalScrolling": true,
  21. "editor.cursorStyle": "line-thin",
  22. "editor.showFoldingControls": "always",
  23. "editor.matchBrackets": true
  24. }

Color Themes

The following color themes have been ported.

Color Pack from Chris Kempson

Eighties Dark


Eighties Dark

Ocean Dark


Ocean Dark

Ocean Light


Ocean Light

Tomorrow Dark


Tomorrow Dark

Tomorrow Subliminal


Tomorrow Subliminal

Tomorrow Light


Tomorrow Dark

Color Pack from Ethan Schoonover

Solarized Dark


Solarized Dark

Solarized Light


Solarized Light

Color Pack from Dmitri Voronianski

Oceanic Next


OceanicNext

Color Pack from Wimer Hazenberg

  • Original sources.
  • Monokai © 2017.
  • You can show your appreciation to Wimer via buying Monokai Pro.

Monokai Classic


Monokai Classic

Monokai Machine


Monokai Machine

Monokai Octagon


Monokai Octagon

Monokai Pro


Monokai Pro

Monokai Ristretto


Monokai Ristretto

Monokai Spectrum


Monokai Spectrum

Color Pack from Mattia Astorino

Material


Material

Material Darker


Material Darker

Material Palenight


Material Palenight

Color Pack from GitHub Inc.

One Dark


One Dark

One Light


One Light

Color Pack from Jani Nurminen, Colin T.A. Gray, William D. Neumann

Zenburn


Zenburn

Color Pack from Adam Christiansen, Merrick Christensen, Trevor D. Miller

Nova


Nova

Color Pack from Arctic Ice Studio

Nord


Nord

Color Pack from Chris Thomas

Espresso Libre


Espresso Libre

Color Pack from Ian Hill

Espresso Soda


Espresso Soda

Color Pack from Ike Ku

Ayu Dark


Ayu Dark

Ayu Light


Ayu Light

Ayu Mirage


Ayu Mirage

Minimal Color Pack

Inspired from Dan Abramov’s Subliminal.

Minimal Blue


Minimal Blue

Minimal Yellow


Minimal Yellow

Minimal Purple


Minimal Purple

Minimal Green


Minimal Green

Development

Help porting popular tmThemes to vscode.

The development is made easy with some custom scripts. First fork and clone the
repo and run

  1. yarn install

This will install all dependencies. Then run

  1. yarn start

To build the themes and watch for file changes. You can press F5 to
launch VSCode development window where you can preview the themes.

Once satisfied run

  1. yarn build

to finalize the themes and make changes to package.json manually.

Then submit a PR.

Adding a new theme

  • Copy ./src/schemes/Template.noop.js to ./src/schemes/MyTheme.js.
  • Mark the theme dark or light and make changes accordingly.
  • Add colors to the config.
  • Import and add the theme in src/colors.js.
  • Build and test.


👨‍🎨