---
# System prepended metadata

title: VSCode is better with…

---

# VSCode is better with...

:::success
This is my essential collection of VSCode extensions and settings throughout my years of development using [VSCode](https://code.visualstudio.com/) and [Atom Editor](https://atom-editor.cc/) that I think might help some people if I list them out.

Feel free to share this sheet, if anything you found useful and d'like to share, please contant me via x@xtl.tw or comment down below.
:::

---

[toc]

## Extensions - Web
### [Minify - Generate minified HTML, CSS or Javascript](https://marketplace.visualstudio.com/items?itemName=HookyQR.minify)

### [Auto Close Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag)

### [Thunder Client - Postman-like HTTP request test](https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client)
![](https://github.com/rangav/thunder-client-support/blob/master/images/thunder-client-v2.png?raw=true)


---


## Extensions - Web - JavaScript / TypeScript
### [JavaScript and TypeScript](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next)

### [Path Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense)
![](https://i.giphy.com/iaHeUiDeTUZuo.gif)

### [Import cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost)

### [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)

### [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)


---


## Extensions - Web - Vue
### [Official Vue Extension](https://marketplace.visualstudio.com/items?itemName=Vue.volar)

### [Vuetify VSCode](https://marketplace.visualstudio.com/items?itemName=vuetifyjs.vuetify-vscode)

### ~~\[Deprecated\] [Vue Language Features (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.volar)~~

### ~~\[Deprecated\] [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin)~~

### ~~\[Deprecated\] [Vue - Vue syntax highlighting](https://marketplace.visualstudio.com/items?itemName=jcbuisson.vue)~~


---


## Extensions - Python
### [Python - Select interpreter for ur workspace](https://marketplace.visualstudio.com/items?itemName=ms-python.python)
![](https://raw.githubusercontent.com/microsoft/vscode-python/main/images/InterpreterSelectionZoom.gif)

### [Pylance](https://marketplace.visualstudio.com/items?itemName=ms-python.vscode-pylance)
![](https://github.com/microsoft/pylance-release/raw/main/images/all-features.gif)

### [Python Indent](https://marketplace.visualstudio.com/items?itemName=KevinRose.vsc-python-indent)
![](https://github.com/kbrose/vsc-python-indent/raw/HEAD/static/demo.gif)


---


## Extensions - C#
### [C#](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp)

### [C# Dev Kit](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csdevkit)

### [IntelliCode for C# Dev Kit](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.vscodeintellicode-csharp)


---


## Extensions - Design
### [colorize](https://marketplace.visualstudio.com/items?itemName=kamikillerto.vscode-colorize)
![](https://raw.githubusercontent.com/kamikillerto/vscode-colorize/master/assets/demo.gif)


---


## Extensions - Utilities 
### [pdf - preview pdf within vscode](https://marketplace.visualstudio.com/items?itemName=tomoki1207.pdf)
![](https://user-images.githubusercontent.com/3643499/84454816-98fcd600-ac96-11ea-822c-3ae1e1599a13.gif)

### [CodeSnap - take a beautyful shot for your code](https://marketplace.visualstudio.com/items?itemName=adpyke.codesnap)
![](https://raw.githubusercontent.com/kufii/CodeSnap/master/examples/monokai_fira-code.png)

### [GitLens - ~~best tool for git blame~~](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens)
![](https://raw.githubusercontent.com/eamodio/vscode-gitlens/main/images/docs/revision-navigation.gif)

### [Git Graph](https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph)
![](https://github.com/mhutchie/vscode-git-graph/raw/master/resources/demo.gif)

### [IntelliCode - AI-assisted autocomplete](https://marketplace.visualstudio.com/items?itemName=VisualStudioExptTeam.vscodeintellicode)
![](https://aka.ms/IntelliCodeUsageExamplesv2)

### [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare)
![](https://aka.ms/vsls/quickstart/invite)

### [Spell Right](https://marketplace.visualstudio.com/items?itemName=ban.spellright)
![](https://github.com/bartosz-antosik/vscode-spellright/raw/HEAD/media/screenshot-context-menu.png)

### [JSON Path Status Bar](https://marketplace.visualstudio.com/items?itemName=richie5um2.vscode-statusbar-json-path)
![](https://github.com/richie5um/vscode-statusbar-json-path/raw/HEAD/resources/jsonpath.png)

### [Indent Rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)
![](https://raw.githubusercontent.com/oderwat/vscode-indent-rainbow/master/assets/example.png)

---


## Extensions - CI/CD/Documentation
### [Docker](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker)
![](https://github.com/microsoft/vscode-docker/raw/HEAD/resources/readme/overview.gif)

### [Todo Tree](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree)
![](https://raw.githubusercontent.com/Gruntfuggly/todo-tree/master/resources/screenshot.png)

### [Better Comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments)
![](https://github.com/aaron-bond/better-comments/raw/HEAD/images/better-comments.PNG)

### [Draw.io Integration](https://marketplace.visualstudio.com/items?itemName=hediet.vscode-drawio)
![](https://github.com/hediet/vscode-drawio/raw/HEAD/docs/demo.gif)

### [LaTeX Workshop](https://marketplace.visualstudio.com/items?itemName=James-Yu.latex-workshop)


---


## Extensions - Theme
### [Material Icon Theme - Crazy file/folder icon collection](https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme)
![](https://raw.githubusercontent.com/PKief/vscode-material-icon-theme/main/images/fileIcons.png)

### [Indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)
![](https://raw.githubusercontent.com/oderwat/vscode-indent-rainbow/master/assets/example.png)


---


## Extensions - Just for fun
### [Vscode PowerMode](https://marketplace.visualstudio.com/items?itemName=hoovercj.vscode-power-mode)
![](https://github.com/hoovercj/vscode-power-mode/raw/HEAD/images/demo-v3.gif)


---


## Useful settings
### Auto save changes when blur
```json
{
  "files.autoSave": "onFocusChange"
}
```

### Dedlicated ssh config for Remote-SSH
```json
{
  "remote.SSH.configFile": "<path-to-a-dedicated-vscode-ssh-config>"
}
```

### Auto-guessing file encoding 
```json
{
  "files.autoGuessEncoding": true
}
```


<!-- <style> img { display: none; } </style> -->


<style>
.user-card-popover{color: #fff !important;}
#meta-title-tags{ filter: invert(180); }
.ui-comment-app .open-comments{background: transparent;}
pre.part{background-color: #000 !important;}
code{background-color: #000 !important;}
.alert a,.hljs-strong,.token.bold,.token.important{font-weight:700}body[style*="background-color: white;"],body[style]{background-color:#1e1e1e!important}body{color:#abb2bf}.markdown-body,.ui-content,.ui-view-area{background:#1e1e1e;color:#abb2bf}.CodeMirror pre,.cm-m-markdown,.cm-s-default .cm-quote,.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,.list li .item.wide .content .title a,.list li .item.wide .content .title a:focus,.list li .item.wide .content .title a:hover,.markdown-body ol li,.markdown-body p,.markdown-body table tr td,.markdown-body ul li,.toc-menu a,a.list-group-item .list-group-item-heading,h1,h1 .small,h1 small,h2,h2 .small,h2 small,h3,h3 .small,h3 small,h4,h4 .small,h4 small,h5,h5 .small,h5 small,h6,h6 .small,h6 small,p{color:#ddd}.form-control,.list li .item.wide hr,.multi-select-dropdown-menu .dropdown-options,.multi-select-dropdown-menu .ui-dropdown-label,.overview-widget-group .btn,.panel-default,.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th,.template-content .ui-templates-container,.template-menu .more-template,hr{border-color:#6d6d6d}.form-control{background:#333;color:#fff}.form-control:-moz-placeholder,.form-control:-ms-input-placeholder,.form-control::-moz-placeholder,.form-control::-webkit-input-placeholder,.form-control::placeholder{color:#eee}.header,.navbar{background-color:#0e0e0e;border-color:#0e0e0e}.diff-table .pl-c,.diff-table .pl-c1,.diff-table .pl-e,.diff-table .pl-en,.diff-table .pl-ent,.diff-table .pl-k,.diff-table .pl-pds,.diff-table .pl-s,.diff-table .pl-s .pl-pse .pl-s1,.diff-table .pl-s .pl-s1,.diff-table .pl-smi,.diff-table .pl-sr,.diff-table .pl-sr .pl-cce,.diff-table .pl-sr .pl-sra,.diff-table .pl-sr .pl-sre,.diff-table .pl-v,.navbar a,.select2-default,.ui-template-item-menu{color:#eee!important}.navbar .btn-group label{background-color:#0e0e0e;color:#eee;border-color:#555}.navbar .btn-group label.btn-default:focus,.navbar .btn-group label.btn-default:hover{background-color:#2a2a2a;color:#eee;border-color:#555}.navbar .btn-group label.active,.navbar .btn-group label.active:focus,.navbar .btn-group label.active:hover{background-color:#555;color:#eee;border-color:#555}.dropdown-menu>li>a,.navbar .announcement-area .caption.inverse,.navbar-default .btn-link:focus,.navbar-default .btn-link:hover{color:#eee}.dropdown-menu .divider,.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.open>a:focus,.navbar-default .navbar-nav>.open>a:hover{background-color:#555}.btn.focus,.btn:focus,.btn:hover,.dropdown-header,.pagination.dark>li>a,.pagination.dark>li>span,.ui-comment-container .ui-comments-container .ui-comment .timestamp,div[contenteditable]:empty:not(:focus):before{color:#aaa}.dropdown-menu{background-color:#222;border:1px solid #555;border-top:none}.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover,.ui-comment-container .ui-comments-container .ui-comment .comment-menu .comment-dropdown-menu>div:hover{background-color:#555;color:#eee}.header .open .dropdown-menu{background-color:#202020}.navbar .announcement-popover,.navbar .announcement-popover .announcement-popover-footer{background:#4f4f4f}.navbar .announcement-popover .announcement-popover-header{background:#2e2e2e;border-bottom:1px solid #2e2e2e}.navbar .announcement-popover .announcement-popover-body{background:#4f4f4f;color:#eee}.label-warning{background-color:#ffc107;color:#212529}#overview-control-form #overview-keyword-input-container .select2-container .select2-choices,.search{background-color:#3e4045}.list.row-layout li .item{border-color:#696c7d}.list.row-layout li:last-of-type .item{border-bottom:none}.list li .item{background:#1c1c1c}.list li:focus .item,.list li:hover .item{background:#404040}.list li .item h4,.template-content .close,.toolbar i,.ui-template-list .list-group-item{color:#fff}.list li p,.modal-title{color:#ccc}.list li p i{font-style:normal}.list li .item .content .tags span{background:#555}.ui-item{color:#fff;opacity:.7}.ui-item:focus,.ui-item:hover{opacity:1;color:#fff}.multi-select-dropdown-menu .dropdown-options .ui-option:hover{background-color:#4d4d4d;color:#eee}#overview-control-form #overview-keyword-input-container .select2-container{background-color:#3e4045!important}.search{color:#eee}.btn.btn-gray:hover,.select2-results .select2-highlighted{background:#4d4d4d;color:#eee}.search:-moz-placeholder,.search:-ms-input-placeholder,.search::-moz-placeholder,.search::-webkit-input-placeholder,.search::placeholder{color:#eee}.btn.btn-gray{border-color:#6d6d6d;background:#333;color:#eee}.select2-container-multi .select2-choices{background:#3e4045}.select2-container-multi .select2-choices .select2-search-choice{background:#131313;color:#eee;border-color:#555;box-shadow:none}.btn-default,.btn-default:focus,.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover,.pagination>li>a,.pagination>li>span{color:#eee;background-color:#2e2e2e;border-color:#6a6a6a}.btn-default.active.focus,.btn-default.active:focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:focus,.btn-default:active:hover,.open>.dropdown-toggle.btn-default.focus,.open>.dropdown-toggle.btn-default:focus,.open>.dropdown-toggle.btn-default:hover{background:#737373}.btn-default:hover,.pagination>li>a:hover{color:#fff;background-color:#7d7d7d;border-color:#6a6a6a}.overview-widget-group .btn.active{background-color:#6a6a6a;color:#eee}.overview-widget-group .btn:hover{background-color:#7d7d7d;color:#eee;border-color:#636363}.overview-widget-group .slider.round,.overview-widget-group .slider.round:before{border-color:#ccc}.overview-widget-group input:checked+.slider{background-color:#ccc}.select2-container-multi .select2-choices .select2-search-field input,.ui-category-description-icon a,.ui-comment-container .ui-comments-container .ui-comment .comment-author,.ui-comment-container .ui-comments-container .ui-comment .comment-content,.ui-comment-container .ui-comments-container .ui-comment .comment-menu{color:#eee}.ui-infobar__user-info li,blockquote .small,blockquote footer,blockquote small,footer,footer a{color:#bbb}.item .ui-history-pin.active{color:red}.ui-history-close{color:#eee;opacity:.5}.section .form-horizontal .form-group .btn-default{font-size:16px;border-color:#6d6d6d;background-color:#333;color:#fff}.section .form-horizontal .form-group .btn-default:focus,.section .form-horizontal .form-group .btn-default:hover{background-color:#737373;color:#fff}.section .form-horizontal .form-control:focus{border-color:#bbb}#notificationLabel,.dropdown.ui-invitee .ui-invitee-label,.dropdown.ui-notification .ui-notification-label,.ui-infobar .btn.ui-edit{color:#eee;border-color:#6a6a6a}footer{background:#101010;border-top:1px solid #454545}#doc>h1,.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6,.markdown-body hr,.summary h1,.summary h2,.summary h3 .summary hr{color:#ddd;border-color:#777!important}.cm-s-default .cm-string,.cm-s-default .cm-variable-2,.cm-s-one-dark .cm-string,.cm-s-one-dark .cm-variable-2,.markdown-body a,.panel-body a,.summary .nav>li>a,.toc-menu a:focus,.toc-menu a:hover{color:#7bf}.markdown-body a code{color:#7bf!important}.markdown-body blockquote{color:#ddd;border-left-color:#777;font-size:16px}.markdown-body code,code{color:#dfdfdf!important;background-color:#424a55}.markdown-body pre{background-color:#1e1e1e;border:1px solid #555!important;color:#dfdfdf}.mark,mark{background-color:rgba(255,255,0,.32)!important;color:#ddd;margin:.1em;padding:.1em .2em}.task-list-item-checkbox{margin:.18em 0 .2em -1.3em!important}.task-list-item input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;top:-1px;margin:0 1rem 0 0;cursor:pointer}.task-list-item input[type=checkbox]::before{-webkit-transition:.1s ease-in-out;-moz-transition:.1s ease-in-out;transition:.1s ease-in-out;content:"";position:absolute;left:0;z-index:1;width:16px;height:16px;border:2px solid #a50b00}.task-list-item input[type=checkbox]:checked::before{-webkit-transform:rotate(-48deg);-moz-transform:rotate(-48deg);-ms-transform:rotate(-48deg);-o-transform:rotate(-48deg);transform:rotate(-48deg);height:9px;border-color:#00e676;border-top-style:none;border-right-style:none}.task-list-item input[type=checkbox]::after{content:"";position:absolute;top:-.125rem;left:0;width:16px;height:16px;background:#333;cursor:pointer}.markdown-body table tr{background-color:#1e1e1e;border-top:none;border-bottom:1px solid rgba(255,255,255,.3)}.markdown-body table tr:first-child{border-top:1px solid rgba(255,255,255,.2)}.markdown-body table tr:nth-child(2n){background-color:#333}.markdown-body table tr th{color:#64b5f6}.markdown-body table td,.markdown-body table th{border:none}.markdown-body table tr td:first-child,.markdown-body table tr th:first-child{border-left:1px solid rgba(255,255,255,.1)}.markdown-body table tr td:last-child,.markdown-body table tr th:last-child{border-right:1px solid rgba(255,255,255,.1)}.markdown-body pre.abc,.markdown-body pre.flow-chart,.markdown-body pre.graphviz,.markdown-body pre.mermaid,.markdown-body pre.sequence-diagram{background-color:#fff!important}.alert-danger h1,.alert-danger h2,.alert-danger h3,.alert-danger h4,.alert-danger h5,.alert-danger h6,.alert-danger mark,.alert-danger ol li,.alert-danger p,.alert-danger ul li{color:#721c24}.alert-warning h1,.alert-warning h2,.alert-warning h3,.alert-warning h4,.alert-warning h5,.alert-warning h6,.alert-warning mark,.alert-warning ol li,.alert-warning p,.alert-warning ul li{color:#856404}.alert-success h1,.alert-success h2,.alert-success h3,.alert-success h4,.alert-success h5,.alert-success h6,.alert-success mark,.alert-success ol li,.alert-success p,.alert-success ul li{color:#155724}.alert-info h1,.alert-info h2,.alert-info h3,.alert-info h4,.alert-info h5,.alert-info h6,.alert-info mark,.alert-info ol li,.alert-info p,.alert-info ul li{color:#004085}.alert a{color:#002752}.alert h1:first-child,.alert h2:first-child,.alert h3:first-child,.alert h4:first-child,.alert h5:first-child,.alert h6:first-child{margin-top:0}.markdown-body .alert>p{margin-top:0;margin-bottom:10px}.markdown-body .alert>ol,.markdown-body .alert>ul{margin-bottom:16px}.markdown-body .alert>:last-child{margin-bottom:0}.alert-warning{background-color:#fff3cd;border-color:#ffeeba}.alert-danger mark{background-color:#ffb7b7!important}.alert-warning mark{background-color:#ffe966!important}.alert-success mark{background-color:#b9e990!important}.alert-info mark{background-color:#b1d6ff!important}.ui-edit-area .ui-resizable-handle.ui-resizable-e{background-color:#303030;border:1px solid #303030;box-shadow:none}.ui-infobar{color:#999}.permission-popover-btn-group .btn.active,.permission-popover-btn-group .btn.focus,.permission-popover-btn-group .btn:active,.permission-popover-btn-group .btn:focus{background-color:#6a6a6a!important;color:#eee!important;border-color:#555!important}.permission-popover-btn-group .btn.active:hover,.permission-popover-btn-group .btn:hover{background-color:#7d7d7d!important;color:#eee!important;border-color:#636363!important}.ui-delete-note a:active,.ui-delete-note a:focus,.ui-delete-note a:hover{background-color:#dc3545!important}.ui-invitee-invite{border-color:#6a6a6a!important}.ui-invitee-invite:focus,.ui-invitee-invite:hover{background-color:#737373;color:#eee!important}.select2-container,.select2-drop,.select2-results .select2-ajax-error,.select2-results .select2-no-results,.select2-results .select2-searching,.select2-results .select2-selection-limit{background:#202020}.ui-invitee.ui-invitee-list .ui-invitee-remove,.ui-invitee.ui-invitee-list .ui-invitee-remove:active,.ui-invitee.ui-invitee-list .ui-invitee-remove:focus,.ui-invitee.ui-invitee-list .ui-invitee-remove:hover{background-color:#dc3545;border:1px solid #dc3545}.select2-container-multi .select2-choices .select2-search-field input.select2-active{color:#000}.select2-drop{color:#eee}.ui-toc-dropdown{width:42vw;max-height:90vh;overflow:auto;text-align:inherit}.ui-toc-dropdown .nav>li>a{font-size:14px;font-weight:700;color:#ddd}.ui-toc-dropdown .nav>.active:focus>a,.ui-toc-dropdown .nav>.active:hover>a,.ui-toc-dropdown .nav>.active>a,.ui-toc-dropdown .nav>li>a:focus,.ui-toc-dropdown .nav>li>a:hover{color:#7bf;border-left-color:#7bf}.ui-toc-dropdown.dropdown-menu{background:#333}.cm-m-xml.cm-attribute,.cm-s-default .cm-header,.cm-s-one-dark .cm-header{color:#ffa653}.cm-m-markdown.cm-variable-3{color:#ff7e7e}.cm-s-default .cm-link,.cm-s-one-dark .cm-link{color:#b0ee83}.cm-s-one-dark .CodeMirror-linenumber{color:#666}.cm-strong{color:#f4511e}.cm-s-one-dark .cm-comment{color:#a9a9a9}.cm-matchhighlight{color:#ffea00}.cm-positive{color:#11bf64}.cm-negative{color:#ff3e3e}.dropdown-menu.CodeMirror-other-cursor{border:2px solid #4d4d4d;background-color:#202020}.dropdown-menu.CodeMirror-other-cursor li a{color:#ececec}.topbar,:not(pre)>code[class*=language-],pre[class*=language-]{background:#1e1e1e}.summary,.toolbar{background:#1e1e1e!important;border-color:#4d4d4d!important}.summary .nav-pills>li.active>a,.summary .nav-pills>li.active>a:focus,.summary .nav-pills>li.active>a:hover{color:#ff9100}.ui-summary-search{font-size:16px;border:1px solid #6d6d6d;background-color:#333;color:#fff}.summary h1,.summary h2,.summary h3,.summary h4,.summary h5,.summary h6{border-color:#454545}div[class$=container-mask]{background:#1e1e1e;z-index:1;display:block}.ui-notification .dropdown-menu{border-top:1px solid #555}.modal-header,.ui-template-list .list-group-item .dropdown-container.open{background-color:#2a2a2a}.panel-default>.panel-heading,.ui-comment-container .ui-comment-header{background-color:#2a2a2a;color:#eee;border-color:#6d6d6d}.panel-body{background:#2e2e2e}.ui-comment-container{background-color:#2e2e2e;border-color:#6d6d6d}.ui-comment-container .ui-comments-container .ui-comment .comment-menu .comment-dropdown-menu{background:#222;color:#eee;border-color:#555}.ui-comment-container .ui-comments-container .ui-comment .comment-menu.active,.ui-comment-container .ui-comments-container .ui-comment .comment-menu:active,.ui-comment-container .ui-comments-container .ui-comment .comment-menu:hover{background-color:#737373;color:#eee}.ui-comment-container .ui-comment-input-container{background-color:#3c3c3c}.ui-comment-container textarea{background-color:#3e4045;color:#eee;border:1px solid #6d6d6d}.CodeMirror,.modal-content,a.list-group-item{background:#1f2226}.ui-comment-container textarea:-moz-placeholder,.ui-comment-container textarea:-ms-input-placeholder,.ui-comment-container textarea::-moz-placeholder,.ui-comment-container textarea::-webkit-input-placeholder,.ui-comment-container textarea::placeholder{color:#eee}@keyframes highlight{0%,30%{background-color:#3c3c3c}100%{background-color:transparent}}.template-content .modal-header{background:#2a2a2a}.gist .gist-meta a,.list-group-item.active,.list-group-item.active:focus,.list-group-item.active:hover,.template-content .modal-title,.ui-template-list .list-group-item .list-group-item-heading,.ui-template-list .list-group-item.active .list-group-item-heading,.ui-template-list-filter .ui-template-list-filter-label,.ui-template-list-filter .ui-template-list-filter-label:hover{color:#eee}.ui-templates-container .ui-create-template-btn{background:#446fab;color:#fff}.ui-template-list .list-group-item.active{background:#4d4d4d}.ui-template-list .list-group-item.active:focus,.ui-template-list .list-group-item:hover{background:#4d4d4d!important}.ui-template-list .list-group-item .dropdown-container:hover{background-color:#2a2a2a!important}.template-menu .more-template:hover{color:#eee;border-color:#6d6d6d}.modal-header{border-bottom:1px solid #46484f}.modal-footer{border-top:1px solid #46484f}a.list-group-item{color:#ddd;border:1px solid #46484f}a.list-group-item:focus,a.list-group-item:hover{background:#434651;color:#ddd}button.close{color:#ddd;opacity:.5}.close:focus,.close:hover{color:#fff;opacity:.8}.CodeMirror-gutters{background:#1f2226;border-right:1px solid rgba(204,217,255,.1)}.cm-s-default .cm-comment{color:#888}.cm-s-default .cm-def{color:#c678dd}.cm-s-default .cm-atom,.cm-s-default .cm-attribute,.cm-s-default .cm-number,.cm-s-default .cm-plus,.cm-s-default .cm-qualifier{color:#eda35e}.cm-s-default .cm-bracket,.cm-s-default .cm-operator,.cm-s-default .cm-property,.cm-s-default .cm-variable,.cm-s-default .cm-variable-3{color:#f76e79}.cm-s-default .cm-builtin,.cm-s-default .cm-keyword,.cm-s-default .cm-tag{color:#98c379}.modal-body{color:#ccc!important}.CodeMirror pre span[style^="background-color: rgb(221, 251, 230)"]{background-color:#288c27!important}.CodeMirror pre span[style^="background-color: rgb(249, 215, 220)"]{background-color:#a52721!important}.hljs{background:#1e1e1e;color:#dcdcdc}.hljs-keyword,.hljs-link,.hljs-literal,.hljs-name,.hljs-symbol,.token.boolean,.token.entity,.token.important,.token.keyword,.token.tag{color:#569cd6}.hljs-link{text-decoration:underline}.hljs-built_in,.hljs-type,.token.class-name,.token.constant{color:#4ec9b0}.hljs-class,.hljs-number,.token.number{color:#b8d7a3}.hljs-meta-string,.hljs-string,.token.attr-value,.token.string{color:#d69d85}.hljs-regexp,.hljs-template-tag,.token.regex{color:#d16969}.hljs-title,.token.function,.token.function-name{color:#dcdcaa}.hljs-formula,.hljs-function,.hljs-subst,code[class*=language-],pre[class*=language-]{color:#dcdcdc}.hljs-comment,.hljs-quote,.token.block-comment,.token.cdata,.token.comment,.token.prolog{color:#57a64a}.hljs-doctag{color:#608b4e}.hljs-meta,.hljs-meta-keyword,.hljs-tag,.token.doctype,.token.punctuation{color:#9b9b9b}.hljs-template-variable,.hljs-variable,.token.variable{color:#bd63c5}.hljs-attr,.hljs-attribute,.hljs-builtin-name,.hljs-params,.token.attr-name,.token.builtin,.token.deleted,.token.namespace,.token.property{color:#9cdcfe}.hljs-section{color:gold}.hljs-emphasis,.token.italic{font-style:italic}.hljs-bullet,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-selector-pseudo,.hljs-selector-tag,.token.selector{color:#d7ba7d}.hljs-addition,.hljs-deletion{color:#dfdfdf;display:inline-block;width:100%}.hljs-addition{background-color:#155a36}.hljs-deletion{background-color:#872e2e}.token.symbol{color:#f8c555}.token.rule{color:#c586c0}.token.atrule{color:#cc99cd}.token.char{color:#7ec699}.token.operator{color:#dcdcdc;background:0 0}.token.url{color:#67cdcc}.token.entity{cursor:help}.token.inserted{color:green}.gist .gist-file{border:1px solid #555}.gist .gist-data{background-color:#1e1e1e;border-bottom:1px solid #555}.gist .gist-meta{background-color:#424a55;color:#eee}.gist .highlight{color:#eee;background-color:#1e1e1e}.gist .blob-num{color:#afafaf}.gist .blob-code-inner{color:#dfdfdf}.pl-mb{color:#fff!important}.pl-c{color:#57a64a!important}.pl-ent,.pl-k{color:#569cd6!important}.pl-e,.pl-smi{color:#9cdcfe!important}.pl-c1,.pl-en,.pl-s .pl-v{color:#4ec9b0!important}.pl-pds,.pl-s,.pl-s .pl-pse .pl-s1,.pl-s .pl-s1,.pl-sr,.pl-sr .pl-cce,.pl-sr .pl-sra,.pl-sr .pl-sre{color:#d69d85!important}.pl-s .pl-s1 .pl-pse{color:#c5dbff!important}
</style>