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.

  • activityBar.background#f5edba
  • activityBarBadge.background#17434b
  • editor.background#f5edba
  • editor.foreground#1f0e1c
  • editor.lineHighlightBackground#d79b7d
  • editor.selectionBackground#8c8fae
  • editorBracketHighlight.foreground1#9d303b
  • editorBracketHighlight.foreground2#17434b
  • editorBracketHighlight.foreground3#647d34
  • editorBracketHighlight.foreground4#70377f
  • editorBracketHighlight.foreground5#34859d
  • editorBracketHighlight.foreground6#584563
  • editorBracketHighlight.unexpectedBracket.foreground#9d303b
  • editorBracketMatch.background#d79b7d
  • editorBracketMatch.border#17434b
  • editorCursor.foreground#17434b
  • editorIndentGuide.activeBackground1#9a6348
  • editorIndentGuide.background1#d79b7d
  • editorLineNumber.activeForeground#584563
  • editorLineNumber.foreground#9a6348
  • editorRuler.foreground#d79b7d
  • sideBar.background#f5edba
  • sideBarTitle.foreground#584563
  • statusBar.background#f5edba
  • tab.activeBackground#f5edba
  • tab.inactiveBackground#d79b7d
  • titleBar.activeBackground#f5edba

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment.line, comment.line.double-slash, comment.line.number-sign, comment.line.semicolon, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment#584563italic
keyword, storage.type, storage, storage.modifier#9d303b
keyword.control, keyword.control.loop, keyword.control.conditional, keyword.control.flow, keyword.control.import, keyword.control.export, keyword.control.trycatch, keyword.control.exception#17434b
keyword.operator, keyword.operator.arrow, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.ternary, keyword.operator.spread, keyword.operator.rest, keyword.operator.typeof, keyword.operator.instanceof, keyword.operator.expression, keyword.operator.new, keyword.operator.delete, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.wordlike#70377f
string, string.quoted, string.quoted.double, string.quoted.single, string.quoted.other, string.quoted.triple, string.template, meta.embedded.assembly#647d34
string.regexp, source.regexp, constant.regexp, string.regexp.character-class, string.regexp.arbitrary-repitition#647d34
constant.character.escape, string.regexp constant.character.escape#7a9050bold
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded, punctuation.section.embedded.begin, punctuation.section.embedded.end#9d303b
constant.numeric, constant.numeric.decimal, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal, constant.numeric.dozenal, keyword.other.unit#9a6348
constant.language, variable.language#9d303bitalic
constant.language.boolean#9d303bitalic
entity.name.type, support.type.builtin, support.type.primitive#34859d
support.type, entity.name.type.class, entity.name.type.struct, entity.name.type.enum, entity.name.type.interface, entity.name.type.alias, entity.name.type.module, entity.name.namespace, entity.other.inherited-class, support.class#17434b
support.type.nominal#70377fitalic
support.type.comptime#9a6348italic
entity.name.type.parameter, support.type.parameter#34859ditalic
entity.name.function, support.function, entity.name.operator.custom-literal, support.constant.handlebars#647d34
variable, variable.other, meta.definition.variable.name, entity.name.variable#3e2137
variable.other.constant, variable.other.enummember, entity.name.constant#3e2137bold
variable.parameter, variable.parameter.function#34859ditalic
variable.parameter.output#9d303bitalic bold
variable.other.global#70377f
variable.other.property, variable.other.object.property, support.variable, meta.object-literal.key, meta.property-name, support.type.vendored.property-name, support.type.property-name#3e2137
entity.name.tag, support.class.component#647d34
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#8c8fae
entity.other.attribute-name, entity.name.decorator, meta.decorator, entity.name.function.decorator#e4943a
punctuation.accessor, punctuation.accessor.property, punctuation.accessor.tuple, punctuation.separator.dot-access#584563
punctuation.bracket, keyword.operator.bracket, punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.arguments#8c8fae
punctuation.accessor.pointer#17434b
punctuation.accessor.typepun#9a6348
punctuation.separator, punctuation.separator.comma, punctuation.terminator, punctuation.terminator.statement#8c8fae
invalid, invalid.illegal#9d303b
invalid.deprecated#9d303bitalic
support, support.constant, support.other#3e2137
meta.embedded, source.groovy.embedded, meta.template.expression#1f0e1c
entity.name.label#1f0e1c
meta.preprocessor, entity.name.function.preprocessor, keyword.control.directive#9d303b
constant.other.reference.link, string.other.link#647d34
markup.heading, heading.1.markdown, heading.2.markdown, heading.3.markdown, heading.4.markdown, heading.5.markdown, heading.6.markdown, entity.name.section, entity.name.section.markdown, markup.heading entity.name#17434bbold
punctuation.definition.heading.markdown#34859d
markup.bold, markup.bold.markdown#9d303bbold
markup.italic, markup.italic.markdown#70377fitalic
markup.bold markup.italic, markup.italic markup.bold#9d303bbold italic
markup.underline#647d34underline
markup.strikethrough, markup.strikethrough.markdown#9a6348strikethrough
markup.underline.link, markup.underline.link.markdown, markup.underline.link.image.markdown, string.other.link.description.markdown#647d34
string.other.link.title.markdown#34859d
markup.inline.raw, markup.inline.raw.string.markdown, markup.raw.inline.markdown#9a6348
markup.fenced_code.block.markdown, markup.raw.block.markdown#1f0e1c
fenced_code.block.language.markdown#17434b
markup.quote, markup.quote.markdown, punctuation.definition.quote.begin.markdown#584563italic
punctuation.definition.list.begin.markdown, beginning.punctuation.definition.list.markdown#70377f
meta.separator, meta.separator.markdown#d79b7d
markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted#647d34
markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted#9d303b
markup.changed, punctuation.definition.changed#e4943a
meta.diff.range#70377fbold
meta.diff.header#17434b
support.type.property-name.json, support.type.property-name.json.comments#647d34
support.type.property-name.css, support.type.property-name.less, support.type.property-name.scss#3e2137
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.scss, entity.name.tag.css, entity.name.tag.less#9a6348
support.constant.property-value, support.constant.color, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value#647d34