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#1E272C
  • activityBar.foreground#EEFFFF
  • activityBarBadge.background#007ACC
  • activityBarBadge.foreground#EEFFFF
  • editor.background#263238
  • editor.foreground#EEFFFF
  • editor.lineHighlightBackground#314549
  • editor.selectionBackground#546E7A80
  • editorCursor.foreground#FFCC00
  • editorGutter.addedBackground#C3E88D
  • editorGutter.background#263238
  • editorGutter.deletedBackground#FF5370
  • editorGutter.modifiedBackground#FFCB6B
  • sideBar.background#1E272C
  • sideBar.foreground#EEFFFF
  • sideBarTitle.foreground#BBBBBB
  • statusBar.background#1E272C
  • statusBar.debuggingBackground#FF5370
  • statusBar.foreground#EEFFFF
  • statusBar.noFolderBackground#1E272C
  • tab.activeBackground#314549
  • tab.activeForeground#EEFFFF
  • tab.inactiveBackground#1E272C
  • tab.inactiveForeground#BBBBBB

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment.line.double-slash, comment.line.number-sign, punctuation.definition.comment#546E7Aitalic
variable, string constant.other.placeholder#EEFFFF—
invalid, invalid.illegal#FF5370—
keyword, storage.type, storage.modifier#C792EA—
keyword.operator, punctuation#89DDFF—
entity.name.function, support.function, variable.language.super#82AAFF—
string#C3E88D—
punctuation.definition.string.begin, punctuation.definition.string.end, punctuation.definition.string.begin.json, punctuation.definition.string.end.json, punctuation.definition.string.begin.terraform, punctuation.definition.string.end.terraform, punctuation.definition.string.begin.hcl, punctuation.definition.string.end.hcl, punctuation.definition.string.begin.js, punctuation.definition.string.end.js, punctuation.definition.string.begin.ts, punctuation.definition.string.end.ts, punctuation.definition.string.begin.jsx, punctuation.definition.string.end.jsx, punctuation.definition.string.begin.tsx, punctuation.definition.string.end.tsx, punctuation.definition.string.begin.python, punctuation.definition.string.end.python, punctuation.definition.string.begin.php, punctuation.definition.string.end.php, punctuation.definition.string.begin.cs, punctuation.definition.string.end.cs, punctuation.definition.string.begin.yaml, punctuation.definition.string.end.yaml, punctuation.definition.string.begin.xml, punctuation.definition.string.end.xml, punctuation.definition.string.begin.html, punctuation.definition.string.end.html, punctuation.definition.string.begin.shell, punctuation.definition.string.end.shell, source.terraform punctuation.definition.string.terraform, source.hcl punctuation.definition.string.hcl#89DDFF—
constant.numeric#F78C6C—
constant.language.boolean, constant.language.boolean.true, constant.language.boolean.false, constant.language.boolean.true.js, constant.language.boolean.false.js, constant.language.boolean.true.ts, constant.language.boolean.false.ts, constant.language.boolean.true.jsx, constant.language.boolean.false.jsx, constant.language.boolean.true.tsx, constant.language.boolean.false.tsx, constant.language.boolean.terraform, source.terraform constant.language.boolean.terraform, constant.language.boolean.hcl, source.hcl constant.language.boolean.hcl, constant.language.hcl, source.hcl.terraform constant.language.hcl, source.hcl constant.language.hcl, constant.language.boolean.yaml, constant.language.json, constant.language.boolean.python, constant.language.boolean.php, constant.language.boolean.cs#C792EA—
entity.name.class, support.class#FFCB6B—
entity.name.type, support.type#FFCB6B—
entity.name.tag#F07178—
entity.other.attribute-name#C792EA—
source.cs keyword#C792EA—
keyword.preprocessor.region.cs, keyword.preprocessor.endregion.cs, meta.preprocessor.region.cs, meta.preprocessor.endregion.cs, string.unquoted.preprocessor.message.cs#546E7A—
source.cs entity.name.type#FFCB6B—
source.cs entity.name.function#82AAFF—
source.cs string#C3E88D—
source.cs constant.numeric#F78C6C—
source.cs comment#546E7Aitalic
source.cs meta.attribute#C792EA—
source.cs keyword.control#89DDFF—
comment.block.documentation, comment.block.documentation.jsdoc#546E7Aitalic
entity.name.tag.jsdoc, keyword.other.jsdoc#FFCB6B—
support.type.jsdoc#FFCB6B—
punctuation.definition.block.tag.jsdoc, punctuation.definition.block.sequence.item.yaml, punctuation.definition.string.begin.yaml, punctuation.definition.string.end.yaml, punctuation.separator.key-value.mapping.yaml, punctuation.definition.tag.xml, punctuation.definition.string.begin.xml, punctuation.definition.string.end.xml#89DDFF—
support.type.object.module.js, support.type.object.module.ts#82AAFF—
support.type.primitive.ts, support.type.builtin.ts#FFCB6B—
entity.name.type.interface.ts, entity.other.inherited-class.ts#FFCB6B—
meta.type.parameters.ts#C792EA—
entity.name.tag.jsx, entity.name.tag.tsx#F07178—
entity.other.attribute-name.jsx, entity.other.attribute-name.jsx#82AAFF—
punctuation.accessor.js, punctuation.accessor.jsx, punctuation.accessor.ts, punctuation.accessor.tsx, punctuation.decorator.js, punctuation.decorator.jsx, punctuation.decorator.ts, punctuation.decorator.tsx, punctuation.definition.string.template.begin.js, punctuation.definition.string.template.begin.jsx, punctuation.definition.string.template.begin.ts, punctuation.definition.string.template.begin.tsx, punctuation.definition.string.template.end.js, punctuation.definition.string.template.end.jsx, punctuation.definition.string.template.end.ts, punctuation.definition.string.template.end.tsx, punctuation.definition.tag.begin.jsx, punctuation.definition.tag.end.jsx, punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx, punctuation.separator.comma.js, punctuation.separator.comma.jsx, punctuation.separator.comma.ts, punctuation.separator.comma.tsx, punctuation.separator.key-value.js, punctuation.separator.key-value.jsx, punctuation.separator.key-value.ts, punctuation.separator.key-value.tsx, punctuation.terminator.statement.js, punctuation.terminator.statement.jsx, punctuation.terminator.statement.ts, punctuation.terminator.statement.tsx#89DDFF—
punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.js, punctuation.definition.template-expression.end.ts#C792EA—
constant.language.boolean.true.js, constant.language.boolean.false.js, constant.language.boolean.true.ts, constant.language.boolean.false.ts, constant.language.boolean.true.jsx, constant.language.boolean.false.jsx, constant.language.boolean.true.tsx, constant.language.boolean.false.tsx#C792EA—
constant.language.null.js, constant.language.null.ts, constant.language.null.jsx, constant.language.null.tsx, constant.language.undefined.js, constant.language.undefined.ts, constant.language.undefined.jsx, constant.language.undefined.tsx#F07178—
meta.decorator.angular, entity.name.decorator.angular#C792EA—
text.html.angular#EEFFFF—
meta.object-literal.key.js, meta.object-literal.key.jsx, meta.object-literal.key.ts, meta.object-literal.key.tsx#DCD0E2—
variable.object.property.ts, variable.object.property.tsx#DCD0E2—
text.html.basic entity.other.attribute-name#FFCB6Bitalic
source.css support.type.property-name#B2CCD6—
fenced_code.block.language.markdown, punctuation.definition.heading.markdown#B2CCD6—
markup.underline.link#82AAFFunderline
markup.bold#F78C6Cbold
markup.italic#C792EAitalic
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown, punctuation.definition.markdown, punctuation.definition.list.begin.markdown, punctuation.definition.list.end.markdown, punctuation.definition.link.title.begin.markdown, punctuation.definition.link.title.end.markdown, punctuation.definition.metadata.markdown, punctuation.definition.quote.begin.markdown, punctuation.definition.string.begin.html, punctuation.definition.string.end.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#89DDFF—
punctuation.separator.key-value.html#EEFFFF—
punctuation.separator.dictionary.key-value.json, punctuation.separator.dictionary.pair.json, punctuation.separator.array.json.comments#89DDFF—
support.type.property-name.json#82AAFF—
string.quoted.double.json#F78C6C—
constant.numeric.json#C3E88D—
constant.language.json#C792EA—
constant.language.null.json#FF5370—
constant.language.boolean.yaml#82AAFF—
constant.language.null.yaml#C792EA—
constant.character.escape.octal.php, keyword.control.php, keyword.other.type.php, keyword.control.for.php, support.function.construct.php, punctuation.section.embedded.end.php, support.function.construct.output.php, punctuation.section.embedded.begin.php, keyword.operator.logical.php, storage.type.php, storage.modifier.php, storage.type.class.php, keyword.control.case.php, keyword.control.break.php, storage.type.function.php, keyword.control.switch.php, storage.modifier.extends.php, constant.character.escape.php, storage.modifier.final.php, keyword.control.while.php, storage.type.trait.php, keyword.control.yield.php, keyword.control.default.php, storage.type.interface.php, keyword.control.import.include.php, storage.modifier.implements.php, keyword.control.declare.php, keyword.control.exception.catch.php, keyword.control.exception.php, keyword.control.foreach.php, keyword.other.namespace.php, keyword.control.return.php, keyword.control.else.php, keyword.control.if.php, keyword.other.use.php, keyword.other.new.php#F78C6C—
constant.language.php, variable.other.php, variable.other.local.php, variable.other.global.php, variable.other.php.dollar.php, variable.other.global.safer.php, variable.other.php.dollar.bracket.php, punctuation.definition.variable.php, variable.language.this.php, variable.other.class.php, constant.other.class.php, constant.other.php, punctuation.definition.array.begin.php, punctuation.definition.array.end.php, punctuation.separator.key-value.php#B59BD1—
support.constant.std.php, support.constant.ext.php, support.constant.core.php, constant.other.class.php#B59BD1italic
support.function.constructor.php, support.function.array.php, support.function.math.php, support.function.json.php, meta.function-call.php, entity.name.function.php#82AAFF—
constant.other.php, keyword.operator.key.php, keyword.operator.class.php, keyword.operator.ternary.php, keyword.operator.assignment.php, punctuation.section.array.end.php, keyword.operator.return-value.php, punctuation.section.array.begin.php, keyword.operator.null-coalescing.php, meta.embedded.inline.phpx punctuation.definition.tag.begin.html, meta.embedded.inline.phpx punctuation.definition.tag.end.html, punctuation.definition.arguments.begin.bracket.round.php, punctuation.definition.arguments.end.bracket.round.php, keyword.operator.increment-decrement.php, punctuation.terminator.expression.php, punctuation.separator.delimiter.php, punctuation.separator.inheritance.php, keyword.definition.arrow.php, keyword.operator.string.php, source.sql.embedded.php, source.sql#E8E8E8—
meta.class.php support.other.namespace.php, meta.class.php meta.class.body.php meta.method-call.php support.other.namespace.php, support.class.php, support.other.namespace.php, support.class.builtin.php, entity.name.type.class.php, entity.name.type.namespace.php, entity.other.inherited-class.php#E8E8E8—
keyword.other.phpdoc.php, comment.block.documentation meta.other.type.phpdoc.php#E8E8E8italic
source.php string#C3E88D—
source.php constant.numeric#4DD0E1—
source.php comment#546E7Aitalic
constant.other.table-name.sql, variable.other.property.php#E1A2D3—
meta.attribute.php, punctuation.decorator.php, meta.decorator entity.name.function.php, constant.other.character-class.regexp, meta.attribute.php support.attribute.php, meta.class.php meta.attribute.php support.other.namespace.php#D4C570—
meta.embedded.block.php meta.method-call.php entity.name.variable.parameter.php, meta.embedded.block.php meta.attribute.php entity.name.variable.parameter.php, meta.embedded.block.php meta.attribute.php punctuation.separator.colon.php#7EAFE3—
source.python keyword#F78C6C—
source.python meta.import#F78C6C—
source.python entity.name.function#82AAFF—
source.python variable.parameter#F67B56—
source.python string, punctuation#C3E88D—
source.python constant.numeric#89DDFF—
source.python comment#546E7Aitalic
source.python entity.name.class#FFCB6B—
source.python meta.decorator#C792EA—
source.python support.type#89DDFF—
string.unquoted.argument.shell#EEFFFF—
constant.other.option.dash.shell#89DDFF—
constant.other.option, punctuation.definition.subshell.single.shell#C792EA—
punctuation.definition.string.begin.shell, punctuation.definition.string.end.shell, punctuation.separator.statement.and.shell, punctuation.terminator.statement.semicolon.shell#89DDFF—
punctuation.definition.string.begin.hcl, punctuation.definition.string.end.hcl#89DDFF—
source.hcl.terraform entity.name.type.terraform, source.hcl.terraform entity.name.type.hcl#C792EAbold
source.hcl.terraform variable.other.enummember.hcl#FFCB6Bitalic
Material Theme for VSCode by Víctor Hugo Valle-Castillo - VS Code Theme