Skip to main content
Coding Theme

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#252b39
  • activityBar.foreground#dddfe1
  • activityBarBadge.background#ec5f67cc
  • button.background#293d45
  • button.foreground#dddfe1
  • editor.background#252b39
  • editor.findMatchBackground#ffffff40
  • editor.findMatchHighlightBackground#ffffff10
  • editor.findRangeHighlightBackground#ffffff10
  • editor.foreground#EEFFFF
  • editor.lineHighlightBackground#252b39
  • editor.selectionBackground#ffffff20
  • editorCursor.foreground#2196f3
  • editorGroupHeader.tabsBackground#252b39
  • editorGroupHeader.tabsBorder#252b39
  • editorGutter.addedBackground#C3E88D
  • editorGutter.addedSecondaryBackground#82AAFF
  • editorGutter.modifiedBackground#FAC863
  • editorGutter.modifiedSecondaryBackground#82AAFF
  • editorIndentGuide.background#ffffff16
  • editorLineNumber.foreground#8f999e
  • editorSuggestWidget.background#293d45
  • editorSuggestWidget.border#293d45
  • editorSuggestWidget.foreground#dddfe1
  • editorSuggestWidget.selectedBackground#ffffff16
  • editorWhitespace.foreground#252b39
  • editorWidget.background#293d45
  • focusBorder#46575f
  • gitDecoration.addedResourceForeground#8f999e
  • gitDecoration.conflictingResourceForeground#8f999e
  • gitDecoration.ignoredResourceForeground#8f999e
  • gitDecoration.modifiedResourceForeground#8f999e
  • gitDecoration.renamedResourceForeground#8f999e
  • gitDecoration.stageDeletedResourceForeground#8f999e
  • gitDecoration.stageModifiedResourceForeground#8f999e
  • gitDecoration.submoduleResourceForeground#8f999e
  • gitDecoration.untrackedResourceForeground#8f999e
  • input.background#293d45
  • input.border#293d45
  • input.foreground#dddfe1
  • input.placeholderForeground#dddfe1
  • list.activeSelectionBackground#293d45
  • list.activeSelectionForeground#dddfe1
  • list.errorForeground#8f999e
  • list.hoverBackground#293d45
  • list.hoverForeground#dddfe1
  • list.inactiveSelectionBackground#293d45
  • list.inactiveSelectionForeground#dddfe1
  • list.warningForeground#8f999e
  • scrollbarSlider.activeBackground#747D9180
  • scrollbarSlider.background#4E566680
  • scrollbarSlider.hoverBackground#5A637580
  • sideBar.background#252b39
  • sideBar.foreground#8f999e
  • sideBarSectionHeader.background#252b39
  • sideBarTitle.foreground#dddfe1
  • statusBar.background#252b39
  • statusBar.foreground#8f999e
  • statusBar.noFolderBackground#252b39
  • tab.border#252b39
  • tab.inactiveBackground#293d45
  • tab.unfocusedActiveForeground#dddfe1
  • titleBar.activeBackground#252b39
  • titleBar.activeForeground#dddfe1
  • titleBar.inactiveBackground#252b39
  • titleBar.inactiveForeground#dddfe1
  • tree.indentGuidesStroke#252b3900

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
Global settings#EEFFFF—
string#C3E88D—
punctuation, constant.other.symbol#95DCFF—
meta.decorator punctuation.decorator#82AAFF—
constant.character.escape, text.html constant.character.entity.named#FFFFFF—
constant.language.boolean#F78C6C—
constant.numeric#F78C6C—
variable.parameter, variable.language, support.constant, meta.function-call.arguments#F78C6C—
support.variable#82AAFF—
variable#fac863—
meta.definition.variable entity.name.function#EEFFFF—
meta.class meta.definition.property variable.object.property#EEFFFF—
meta.class meta.method.declaration storage.type#82AAFF—
meta.function.method variable.other.readwrite, meta.function-call.with-arguments punctuation.dollar.js, meta.function-call.with-arguments variable.other.readwrite, meta.function.arrow variable.other.readwrite, source meta.method.declaration meta.parameters variable.parameter, source.css.scss meta.at-rule.include variable, source.css.scss meta.at-rule.include support.constant.property-value, source.css.scss meta.at-rule.include support.type.property-name.css#F78C6C—
meta.group.braces.curly variable.other.readwrite, variable.other.readwrite, variable.other.constant, variable.other.property#EEFFFF—
meta.object.member variable.other.readwrite#FAC863—
meta.object-literal variable.other.readwrite, meta.method.declaration meta.object.member variable.other.readwrite#EEFFFF—
meta.block variable.other.property#82AAFF—
meta.class meta.method.declaration variable.other.property#EEFFFF—
punctuation.dollar#EEFFFF—
keyword.other#F78C6C—
keyword, modifier, support.type.object, constant.language#95DCFF—
support.type.object.module keyword.operator.accessor, keyword.operator.accessor support.type.object.module#FAC863—
variable.language.this, variable.other.class, variable.language.prototype#ec5f67—
support.type.object.dom, support.type.object.process, support.type.object.console, support.type.object.node#fac863—
variable.other.object, meta.var.expr variable.other.object.property#fac863—
meta.block variable.other.object#EEFFFF—
meta.block meta.function-call variable.other.object#fac863—
mera.block meta.function-call variable.other.object.property#EEFFFF—
meta.arrow variable.other.object, meta.block meta.var.expr meta.block variable.other.object, meta.embedded.expression meta.function-call variable.other.object#EEFFFF—
meta.var.expr variable.other.object.property#82AAFF—
entity.name.function, support.function#82AAFF—
new.expr entity.name.function#EEFFFF—
storage.type, storage.modifier, storage.control#C792EA—
support.module, support.node#E97377italic
support.type, constant.other.key#fac863—
entity.name.type, entity.other.inherited-class, entity.other#fac863—
entity.name.type.new#82AAFF—
comment#65737eitalic
comment punctuation.definition.comment, string.quoted.docstring, variable.other.jsdoc#65737eitalic
punctuation#95DCFF—
punctuation.definition.block#95DCFF—
meta.brace.round#95DCFF—
entity.name, entity.name.type.class, support.type, support.class, meta.use#fac863—
variable.object.property, meta.field.declaration entity.name.function#E97377—
meta.definition.method entity.name.function#82AAFF—
meta.function entity.name.function#82AAFF—
template.expression.begin, template.expression.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#95DCFF—
meta.embedded, source.groovy.embedded, meta.template.expression#FFFFFF—
entity.name.tag.yaml#E97377—
meta.object-literal.key, support.type.property-name.json#EEFFFF—
meta.var.expr meta.object.member meta.object-literal.key#82AAFF—
constant.language.json#f99157—
entity.other.attribute-name.class variable, source.css.scss meta.definition.variable variable#fac863—
entity.other.attribute-name.id, source.css.scss meta.property-value support.constant.property-value#F78C6C—
source.css entity.name.tag#fac863—
support.type.property-name.css#B2CCD6—
source.css.scss entity.other.attribute-name.class, source.css.scss entity.other.attribute-name.pseudo-class#FAC863—
meta.tag, punctuation.definition.tag#95DCFF—
entity.name.tag#E97377—
entity.other.attribute-name#C792EA—
meta.attribute.class entity.other.attribute-name#FAC863—
punctuation.definition.entity.html#FFFFFF—
markup.heading#95DCFF—
text.html.markdown meta.link.inline, meta.link.reference#E97377—
text.html.markdown beginning.punctuation.definition.list#95DCFF—
markup.italic#E97377italic
markup.bold#E97377bold
markup.bold markup.italic, markup.italic markup.bold#E97377italic bold
markup.fenced_code.block.markdown punctuation.definition.markdown#C3E88D—
markup.inline.raw.string.markdown#C3E88D—
keyword.other.definition.ini#E97377—
entity.name.section.group-title.ini#95DCFF—
source.cs meta.class.identifier storage.type#fac863—
source.cs meta.method.identifier entity.name.function#E97377—
source.cs meta.method-call meta.method, source.cs entity.name.function#82AAFF—
source.cs storage.type#fac863—
source.cs meta.method.return-type#fac863—
source.cs meta.preprocessor#676E95—
source.cs entity.name.type.namespace#FFFFFF—
meta.jsx.children, SXNested#FFFFFF—
support.class.component#fac863—
source.cpp meta.block variable.other#FFFFFF—
source.python meta.member.access.python#E97377—
source.python meta.function-call.python, meta.function-call.arguments#82AAFF—
meta.block#E97377—
meta.brace.square#EEFFFF—
entity.name.function.call#82AAFF—
source.php support.other.namespace, source.php meta.use support.class#FFFFFF—
constant.keyword#95DCFFitalic
entity.name.function#82AAFF—
Global settings#FFFFFF—
keyword.control#C792EAitalic
keyword.control.import, keyword.control.from, keyword.control.export#C792EAitalic
markup.quote#95DCFFitalic
markup.fenced_code.block#FFFFFF90—
punctuation.definition.quote#ff9cac—
meta.structure.dictionary.json support.type.property-name.json#C792EA—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fac863—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#F78C6C—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#E97377—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#916b53—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#82AAFF—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff9cac—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#C792EA—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#C3E88D—
Deot Theme by deot - VS Code Theme