Themes To Die For
Publisher: Alec LarsonThemes in package: 17
A collection of my favorite VS Code themes
Color themes
VS Code preview
Full workbench mockup using this variant's colors and tokenColors.
Loading...
colors
Workbench UI color keys from the theme JSON colors map.
- activityBar.background#3a3a3a
- activityBar.foreground#999999
- activityBarBadge.background#80bcbd
- breadcrumb.foreground#999872
- debugConsole.errorForeground#e04c91
- debugConsole.infoForeground#d9d9d9
- editor.background#3a3a3a
- editor.foreground#d9d9d9
- editor.lineHighlightBackground#3f3f3f
- editor.selectionBackground#327173
- editorCursor.foreground#d8d8d8
- editorGroupHeader.noTabsBackground#3a3a3a
- editorGroupHeader.tabsBackground#3a3a3a
- editorGutter.addedBackground#87af87
- editorGutter.background#3a3a3a
- editorGutter.modifiedBackground#4496b3
- editorLineNumber.activeForeground#be7572
- editorLineNumber.foreground#999872
- editorLink.activeForeground#9bcd9b
- editorSuggestWidget.background#3a3a3a
- editorUnnecessaryCode.opacity#00000090
- editorWidget.background#363636
- focusBorder#96b096
- gitDecoration.modifiedResourceForeground#dfbc72
- input.background#3a3a3a
- list.activeSelectionBackground#3a3a3a
- list.activeSelectionForeground#96b096
- list.focusHighlightForeground#5ad7d7
- list.highlightForeground#5ad7d7
- list.hoverBackground#3f3f3f
- list.inactiveSelectionBackground#3f3f3f
- list.inactiveSelectionForeground#d9d9d9
- list.inactiveSelectionIconForeground#96b096
- menu.background#5ad7d7
- menu.selectionBackground#327173
- minimap.selectionHighlight#327173
- notificationLink.foreground#9bcd9b
- quickInput.background#363636
- quickInputList.focusBackground#505450
- sideBar.background#363636
- statusBar.background#333333
- statusBar.debuggingBackground#3d8285
- statusBar.debuggingForeground#a1e3e6
- statusBar.foreground#96b096
- statusBarItem.remoteBackground#4d9699
- statusBarItem.remoteForeground#66f2f2
- tab.activeBackground#323232
- tab.activeBorder#00000000
- tab.activeForeground#74d7d7
- tab.border#00000000
- tab.inactiveBackground#363636
- tab.inactiveForeground#879e87
- terminal.ansiBlack#4e4e4e
- terminal.ansiBlue#85add4
- terminal.ansiBrightBlack#626262
- terminal.ansiBrightBlue#add4fb
- terminal.ansiBrightCyan#87d7d7
- terminal.ansiBrightGreen#87af87
- terminal.ansiBrightMagenta#ffb0ca
- terminal.ansiBrightRed#ffafaf
- terminal.ansiBrightYellow#ffd787
- terminal.ansiCyan#87afaf
- terminal.ansiGreen#5f865f
- terminal.ansiMagenta#d75f87
- terminal.ansiRed#d68787
- terminal.ansiYellow#d8af5f
- terminal.background#3a3a3a
- terminal.foreground#d9d9d9
- textLink.activeForeground#9bcd9b
- textLink.foreground#9bcd9b
- welcomePage.progress.foreground#9bcd9b
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| token.info-token | #316BCD | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #CD3131 | — |
| token.debug-token | #800080 | — |
| meta.import keyword.control, keyword.control.export, keyword.control.as, keyword.control.from | #E18AA6 | — |
| punctuation.definition.typeparameters.begin, punctuation.definition.typeparameters.end | #D7D7AF | — |
| meta.brace.square, punctuation.definition.binding-pattern.array, punctuation.definition.begin.bracket.square, punctuation.definition.end.bracket.square | #D6D687 | — |
| punctuation.definition.binding-pattern.object | #D6D686 | — |
| constant.numeric.decimal | #9A7372 | — |
| meta.type keyword.operator.ternary | #D9D9D9 | — |
| keyword, storage.modifier, keyword.operator.expression.infer, keyword.operator.expression.is, keyword.operator.type.asserts, keyword.operator.delete, keyword.operator.expression.delete, keyword.operator.expression.extends, source.shell support.function.builtin, meta.preprocessor | #E38BA8 | — |
| meta.type.annotation storage.modifier | #87AF87 | — |
| punctuation.definition.tag.begin, punctuation.definition.tag.end | #D6D687 | — |
| meta.tag.attributes.tsx keyword.operator.assignment, meta.jsx.children punctuation.section.embedded, meta.embedded.expression.tsx meta.jsx.children punctuation.section.embedded | #D6D687 | — |
| meta.tag.attributes.tsx punctuation.section.embedded, meta.embedded.expression.tsx meta.jsx.children meta.tag.attributes.tsx punctuation.section.embedded | #899189 | — |
| entity.other.inherited-class | #D9D9D9 | — |
| variable.language | #9A7599 | — |
| keyword.operator.comparison, keyword.operator.relational, keyword.operator.new, keyword.operator.expression.instanceof, keyword.operator.expression.typeof, keyword.operator.expression.keyof, keyword.operator.expression.in | #D6D687 | — |
| meta.object-literal.key punctuation.separator.key-value, keyword.operator.assignment, keyword.operator.increment, keyword.operator.decrement, punctuation.separator.key-value.css, storage.type.function.arrow, constant.other.object.key punctuation.separator.key-value, keyword.operator.spread, keyword.operator.rest | #D6D687 | — |
| meta.type.annotation keyword.operator.type.annotation, meta.return.type keyword.operator.type.annotation, meta.parameters keyword.operator.optional, meta.field.declaration keyword.operator.optional, keyword.operator.type | #FBD1BA | — |
| punctuation.separator.comma, punctuation.separator.parameter, meta.delimiter.comma, meta.delimiter.object.comma, punctuation.separator.delimiter | #D7D7AF | — |
| meta.brace.round, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, meta.group.braces.round.function.arguments, punctuation.definition.arguments, punctuation.section.parens.begin.bracket.round, punctuation.section.parens.end.bracket.round, punctuation.section.arguments.begin.bracket.round, punctuation.section.arguments.end.bracket.round, punctuation.section.parens.control, punctuation.definition.type | #D6D687 | — |
| keyword.control.loop, keyword.control.conditional, keyword.operator.expression.of | #87AED7 | — |
| variable.other.less | #9A7599 | — |
| keyword.other.unit.px.css | #616161 | — |
| comment | #96B096 | — |
| keyword.other.unit.percentage.css | #875F5F | — |
| keyword.other.important.css | #E19972 | — |
| variable.other, support.variable.property | #D9D9D9 | — |
| support.function, support.class | #D9D9D9 | — |
| keyword.operator, keyword.operator.type.annotation | #D9D9D9 | — |
| keyword.other.unit.px.css | #D9D9D9 | — |
| entity.name.type, meta.interface entity.other.inherited-class, string.unquoted.argument.shell, meta.statement.shell, meta.type punctuation.accessor | #FBD1BA | — |
| entity.name.type.class | #D9D9D9 | — |
| meta.jsx.children.tsx | #B2D9B3 | — |
| entity.name.function, entity.other.attribute-name, variable.parameter, meta.object-literal.key | #D9D9D9 | — |
| support.type | #DFBC72 | — |
| support.type.object.module | #D9D9D9 | — |
| entity.other.inherited-class, source.shell entity.name.command | #D9D9D9 | — |
| variable.language | #FFBFBD | — |
| storage.type | #D7AF5F | — |
| storage.type.function, storage.type.interface, storage.type.type | #E18AA6 | — |
| meta.class storage.type | #E18AA6 | — |
| meta.class meta.var.expr storage.type | #D7AF5F | — |
| variable.language.super | #E18AA6 | — |
| storage.type.class | #E18AA6 | — |
| punctuation.terminator.statement | #EE87B5 | — |
| keyword.control.flow, keyword.control.default, keyword.control.js | #87AF87 | — |
| string, string.regexp keyword, string.regexp keyword.operator | #98BCBD | — |
| entity.name.function.tagged-template | #D9D9D9 | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, source.shell punctuation.definition.variable variable.other.normal | #BF9E7E | — |
| meta.brace.curly, punctuation.definition.function.body, punctuation.definition.block, punctuation.definition.subshell, punctuation.definition.dictionary.begin, punctuation.definition.dictionary.end, punctuation.section.block | #D6D687 | — |
| storage.type.class.jsdoc, punctuation.definition.block.tag.jsdoc | #FBB087 | — |
| variable.other.jsdoc | #D7D7AF | — |
| constant.numeric.decimal | #FCD787 | — |
| constant.numeric | #FCD787 | — |
| support.type.property-name, entity.name.tag.yaml | #87AF87 | — |
| constant.language | #FBAF87 | — |
| constant.language.null, constant.language.undefined, keyword.operator.expression.void | #D7AF5F | — |
| constant.language.boolean | #A8A8C6 | — |
| storage.type.function.arrow | #DEDD99 | — |
| punctuation.accessor | #D9D9D9 | — |
| keyword.operator.logical, keyword.operator.definiteassignment, punctuation.accessor.optional, keyword.operator.ternary | #A7A7C4 | — |
| keyword.control.logical.operator.less | #BDBB72 | — |
| keyword.other.important.css, source.shell constant.other.option | #FFBD98 | — |
| keyword.other.unit.percentage.css | #FFDE99 | — |
| constant.other.rgb-value.css | #6FBCBD | — |
| constant.numeric | #FFDE99 | — |
| punctuation.separator.operator.css | #CECE83 | — |
| punctuation.definition.entity.css, keyword.other.stylus | #FBAF87 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.id punctuation.definition.entity.css | #FCAFAF | — |
| entity.other.attribute-name.pseudo-class.css | #AFAF60 | — |
| source.css support.function, source.stylus support.function, source.stylus entity.name.function | #D6D6AE | — |
| punctuation.section.function.css | #FAAC85 | — |
| keyword.other.unit.css | #FCD787 | — |
| entity.name.tag.tsx, entity.name.tag.tsx support.class.component | #99BF9A | — |
| entity.name.tag.css, meta.selector, source.stylus keyword.operator | #87AF87 | — |
| support.type.property-name.css, punctuation.separator.parameter.css, source.stylus meta.property-value keyword.operator, constant.other.object.key string.unquoted | #D9D9D9 | — |
| support.constant.property-value.css, keyword.control.at-rule | #DB936F | — |
| keyword.other.unit.px.css | #FFDE99 | — |
| variable.other.less | #FFBFBD | — |
| keyword.control.trycatch | #FFBD80 | — |
| storage.modifier.async, meta.object.type meta.field storage.modifier | #87AF87 | — |
| entity.name.section.markdown, punctuation.definition.heading.markdown | #80BCBD | — |
| meta.tag.sgml.doctype.html, meta.tag.sgml.html | #719872 | — |
| keyword.control.switch | #E18AA6 | — |
| entity.other.attribute-name.localname.xml | #DFBC72 | — |
| entity.other.attribute-name.xml | #DFBC72 | — |
| entity.other.attribute-name.namespace.xml | #DFBC72 | — |
| entity.name.tag.localname.xml | #87AF87 | — |
| entity.name.tag.xml | #DFBC72 | — |
| meta.tag.preprocessor.xml | #98BCBD | — |