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