Skip to main content
Coding Theme

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.

  • diffEditor.insertedLineBackground#def8de90
  • diffEditor.insertedTextBackground#98eb9890
  • diffEditor.removedLineBackground#ffcccc90
  • diffEditor.removedTextBackground#ffa3a390
  • diffEditorGutter.insertedLineBackground#d6d4d4
  • diffEditorGutter.removedLineBackground#d6d4d4
  • editor.background#fff
  • editor.findMatchHighlightBackground#ffb442
  • editor.foreground#303030
  • editor.lineHighlightBorder#fff
  • editor.selectionBackground#b0c5e3
  • editor.selectionHighlightBackground#dad98090
  • editorBracketMatch.background#f3ec12
  • editorBracketMatch.border#fff
  • editorGutter.addedBackground#98eb98
  • editorGutter.background#c7c7c7
  • editorGutter.deletedBackground#fd7793
  • editorGutter.modifiedBackground#69a3f3
  • editorLineNumber.activeForeground#000
  • editorLineNumber.foreground#606060
  • editorWidget.background#e7e7e7
  • gitDecoration.addedResourceForeground#085308
  • gitDecoration.conflictingResourceForeground#ff0000
  • gitDecoration.deletedResourceForeground#ffa0b4
  • gitDecoration.ignoredResourceForeground#aaa
  • gitDecoration.modifiedResourceForeground#317ac6
  • gitDecoration.renamedResourceForeground#ff00ff
  • gitDecoration.stageModifiedResourceForeground#317ac6
  • gitDecoration.untrackedResourceForeground#009200
  • input.border#c0c0c0
  • list.activeSelectionBackground#4699ef
  • list.activeSelectionIconForeground#b0c5e3
  • list.inactiveSelectionBackground#eee
  • panel.background#e7e7e7
  • quickInput.background#e7e7e7
  • sideBar.background#fff
  • sideBar.border#aaa
  • statusBar.background#cecece
  • statusBar.border#aaa
  • statusBar.foreground#333
  • statusBar.noFolderBackground#cecece
  • statusBarItem.hoverBackground#e7e7e7
  • tab.activeBorderTop#398ee7
  • tab.hoverBackground#fff
  • tab.inactiveBackground#e7e7e7
  • terminal.background#000
  • terminal.foreground#fff
  • terminal.selectionBackground#c0c0c0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, comment.block.preprocessor, comment.documentation, comment.block.documentation#999
invalid.illegal#f00
variable, variable.other, variable.parameter#2842c5
keyword, storage#303030bold
keyword.operator#303030normal
string#447544
string.regexp#bb33dd
keyword.operator.regexp, keyword.control.anchor.regexp, keyword.operator.quantifier.regexp, keyword.operator.negation.regexp, keyword.operator.or.regexp, string.regexp.arbitrary-repetition.php#9933ddbold
entity.name.function.php, keyword.other.class.php, variable.other.property.php, support.function.string.php, punctuation.definition.arguments.begin.bracket.round.php, punctuation.definition.arguments.end.bracket.round.php, meta.embedded.line.php support.class.php#303030normal
keyword.operator.ternary.php, keyword.other.use.php, keyword.other.function.use.php, keyword.other.use-as.php, keyword.other.namespace.php, keyword.other.clone.php, storage.type.class.php, storage.type.trait.php, storage.modifier.php, storage.modifier.extends.php, storage.modifier.implements.php, storage.modifier.abstract.php, storage.modifier.final.php, storage.type.interface.php, storage.type.function.php, storage.type.php, storage.type.const.php, keyword.control.import.include.php, keyword.control.exception.php, keyword.control.exception.catch.php, keyword.other.new.php, keyword.control.return.php, keyword.control.yield.php, keyword.control.foreach.php, keyword.control.for.php, keyword.control.do.php, keyword.control.while.php, keyword.control.if.php, keyword.control.else.php, keyword.control.elseif.php, keyword.control.endif.php, keyword.control.endfor.php, keyword.control.endforeach.php, keyword.control.endwhile.php, keyword.operator.logical.php, keyword.operator.type.php, keyword.control.break.php, keyword.control.continue.php, storage.modifier.reference.php, support.function.construct.php, support.function.construct.output.php, keyword.control.exit.php, keyword.control.die.php, keyword.control.switch.php, keyword.control.case.php, keyword.control.default.php, constant.language.php#303030bold
keyword.other.phpdoc.php, keyword.other.array.phpdoc.php#999bold
meta.other.type.phpdoc.php keyword.other.type.php, comment.block.documentation.phpdoc.php storage.modifier.php#999normal
variable.other.php, variable.other.class.php, variable.other.global.php, variable.other.global.safer.php, variable.language.this.php#2842c5
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#333bold
keyword.operator.error-control.php#bb33ddbold
string.quoted.double.sql keyword, string.quoted.single.sql keyword, string.quoted.double.sql keyword.operator, string.quoted.single.sql keyword.operator, string.quoted.double.sql constant.numeric.sql, string.quoted.single.sql constant.numeric.sql, string.quoted.double.sql support.function.table.sql, string.quoted.single.sql support.function.table.sql, string.quoted.double.sql support.function.mysql.sql, string.quoted.single.sql support.function.mysql.sql, source.sql.embedded.php#447544normal
entity.name.tag.html#303030bold
meta.attribute.checked.html, meta.attribute.selected.html, meta.attribute.multiple.html, meta.attribute.readonly.html, meta.attribute.disabled.html#447544bold
punctuation.separator.key-value.html#303030normal
keyword.other.unit#303030normal
entity.other.attribute-name.id.css, entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.class.css, entity.other.attribute-name.pseudo-class.css#447544normal
support.type.property-name.media.css, support.type.property-name.css#2842c5normal
keyword.control.at-rule.media.css, keyword.other.important.css#303030bold
support.constant.media.css#303030italic
meta.object-literal.key.js#006ab1normal
variable.other.object.js, variable.other.constant.js, variable.other.readwrite.js, variable.other.readwrite.alias.js, variable.parameter.js, meta.definition.variable.js entity.name.function.js#2842c5normal
variable.other.object.property.js, variable.other.property.js, variable.other.constant.property.js#303030normal
storage.type.js, storage.type.function.js, storage.modifier.async.js, variable.language.this.js, keyword.control.import.js, keyword.control.from.js, keyword.control.as.js, constant.language.import-export-all.js, keyword.control.conditional.js, keyword.control.loop.js, keyword.operator.expression.instanceof.js, keyword.operator.expression.typeof.js, keyword.operator.expression.of.js, keyword.operator.expression.in.js, constant.language.json, constant.language.null.js, constant.language.boolean.true.js, constant.language.boolean.false.js, constant.language.undefined.js, keyword.operator.new.js, keyword.operator.logical.js, keyword.control.switch.js, keyword.control.with.js, keyword.control.flow.js, keyword.control.trycatch.js, storage.type.class.js, support.class.js, support.class.builtin.js#303030bold
storage.type.class.jsdoc#999bold
variable.other.jsdoc#999normal
source.go#2842c5normal
entity.name.package.go, entity.name.type.package.go, string.quoted.rune.go#fb35d3normal
entity.name.function.go, support.function.go, support.function.builtin.go, entity.name.type.go, punctuation.definition.begin.bracket.round.go, punctuation.definition.end.bracket.round.go, punctuation.definition.begin.bracket.curly.go, punctuation.definition.end.bracket.curly.go, punctuation.definition.imports.begin.bracket.round.go, punctuation.definition.imports.end.bracket.round.go, punctuation.definition.bracket.square.go, punctuation.definition.begin.bracket.square.go, punctuation.definition.end.bracket.square.go, punctuation.other.comma.go, punctuation.other.period.go, punctuation.terminator.go, keyword.operator.assignment.go, keyword.operator.comparison.go, keyword.operator.increment.go, punctuation.other.colon.go, entity.name.function.support.go#303030normal
constant.numeric.decimal.go#303030normal
constant.language.go, support.function.builtin.go, keyword.operator.address.go, keyword.operator.logical.go, constant.language.null.go, constant.language.boolean.go, entity.name.function.support.builtin.go#303030bold
entity.name.tag.yaml#2842c5normal
variable.other.alias.yaml, entity.name.type.anchor.yaml#C586C0normal
punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml#C586C0bold
support.type.property-name.json#006ab1normal
punctuation.definition.tag.xml, entity.name.tag.localname.xml#303030bold
entity.other.attribute-name.xml, meta.tag.preprocessor.xml#303030normal
text.xml, punctuation.definition.string.begin.xml, punctuation.definition.string.begin.xml#447544normal
support.function.builtin.shell, keyword.operator.logical.shell#303030bold
meta.scope.case-pattern.shell#447544normal
punctuation.separator.pipe-sign.shell, punctuation.definition.case-pattern.shell#303030normal
punctuation.definition.evaluation.parens.begin.shell, punctuation.definition.evaluation.parens.end.shell#303030normal
support.function.table.sql#447544normal
constant.numeric.sql#2842c5normal
support.function.mysql.sql#303030bold
keyword.other.special-method.dockerfile#303030bold
entity.name.section.markdown, punctuation.definition.heading.markdown, punctuation.definition.list.begin.markdown, punctuation.definition.quote.begin.markdown, punctuation.definition.table.markdown, punctuation.separator.table.markdown, meta.separator.markdown#303030bold
markup.inline.raw.string.markdown#447544normal
markup.underline.link.markdown#0078d4normal
markup.bold.markdown#303030bold
markup.italic.markdown#303030italic
markup.strikethrough.markdown#303030strikethrough
punctuation.definition.markdown, fenced_code.block.language.markdown#286228bold
comment.block.documentation.cs string.quoted.double.cs#999normal
entity.name.tag.localname.cs#999bold
entity.name.variable.local.cs, entity.name.variable.parameter.cs, keyword.other.this.cs#2842c5normal
variable.other.object.property.cs#303030normal
#303030bold
punctuation.separator.hash.cs, keyword.preprocessor, entity.name.variable.preprocessor.symbol.cs#3592d2bold