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.

  • editor.background#000000
  • editor.findMatchBackground#00FFFFAA
  • editor.findMatchHighlightBackground#00FFFF55
  • editor.foreground#4BFCF8
  • editor.lineHighlightBackground#0090D030
  • editor.selectionBackground#00FFFFAA
  • editor.selectionForeground#000000
  • editor.selectionHighlightBackground#00FFFF55
  • editor.wordHighlightBackground#00FFFF33
  • editorCursor.foreground#FF0099
  • editorIndentGuide.background1#33333388
  • editorWhitespace.foreground#404040

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
mcol_000000FF#FFFFFFFF—
mcol_text_000000FF#000000FF—
mcol_292929FF#D6D6D6FF—
mcol_text_292929FF#292929FF—
mcol_fefefeFF#000000FF—
mcol_text_fefefeFF#fefefeFF—
—#4BFCF8—
bracket.curly#FF44AAbold
bracket.square#FF8800—
bracket.round#00FF00—
bracket.quote——
comment#646464FFitalic
invalid——
constant#3387CCFF—
keyword#E28964—
constant.numeric#FFFF66—
storage#FF0099—
storage.modifier#CF5099—
storage.self#CC0033bold
storage.type#CF9950—
support#8A5C8DFF—
entity.name.function#BB00FF—
keyword.control#FF00FF—
keyword.control.declaration#8888AA—
keyword.control.module#FFFF33—
keyword.control.flow#FF6600bold
keyword.control.conditional#FF00FF—
keyword.control.trycatch#FF0033—
keyword.control.loop#009999—
keyword.control.switch#999999—
keyword.operator#FF0080—
meta.function.argument, variable.parameter, meta.parens.c#157EFF—
punctuation.section.embedded#00D3FFFF—
keyword.other.unit, keyword.unit.css#80FF00FF—
invalid.illegal#FD5FF1FF—
string.quoted source#DAEFA3—
string constant#CFED81—
string.regexp#6FFF17—
punctuation.definition.string#009FFF—
string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition#00D505—
string.regexp punctuation keyword#C559FF—
string variable#8A9A95—
support.function#FCF352FF—
meta.tag#4F9EFFFF—
meta.tag entity#157EFF—
meta.tag string.quoted.double.html#E07D2C—
meta.tag.block.any.html.html5#E88BFCFF—
meta.tag.block.any.html.html5 entity#D730FAFF—
source entity.name.tag, source entity.other.attribute-name, meta.tag.inline, meta.tag.inline entity#87A7E2FF—
source.js.embedded.html entity.name.tag.script.html#FF3535—
source.js.embedded.html punctuation.definition.tag.html#FF1E1E—
source.js.embedded.html string.quoted.double.html#FF9D9D—
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.event.html, entity.other.attribute-name.id.html, entity.other.attribute-name.tag.jade, constant.other.symbol.ruby, entity.other.attribute-name.jsx, entity.other.attribute-name.php, entity.other.attriubte-name.event.php, entity.other.attirubute-name.id.php#7349BEFFitalic
meta.toc-list#BEFEC7FF—
meta.initialization, variable.other.readwrite.js#FF9122—
meta.initialization, variable.other.dollar.js#FF9122italic
variable.other.object.js#FFEE00—
meta.property-name.js variable.other.object.js#FFFF88—
support.variable.property.js#3399FF—
variable.other.dot-access#66FFDD—
variable.other.property.js#37C1BE—
punctuation.section.scope.square.js#FF2404—
punctuation.section.scope.round.js, meta.brace.round#1C38FF—
punctuation.definition.arrow.js#AA00FFbold
entity.arrow.function.js#AA00FFbold
variable.language#AA0044—
variable.language.prototype#FF6600—
support.class.error.js#FF5522—
support.class.builtin.js#FFEE00italic
support.class.node.js#1224FE—
entity.name.function.node.js#D84014—
support.keyword.node.js#99EF25bold
variable.import.destructuring.js#00BBFF—
other.object.key.js#1C98C1—
meta.accessor.js punctuation.definition.parameters#005588—
storage.type.accessor.js#0066AAbold italic
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#FF0044—
storage.type.module.js, storage.type.export.js, storage.type.import.js, storage.type.from.js#CCCC44—
storage.type.class.js, storage.type.extends.js#0044AA—
meta.function.call.class.static.js #880011—
variable.other.class.static.js#AA0066—
entity.name.accessor.js#00FFCCbold italic
entity.name.method.js#AA00FFitalic bold
meta.method.js#660099bold
storage.type.function.js#FF1E1Ebold
string.quoted.single#88FFAAAA—
variable.other.quasi.js#FF0099—
string.quasi.js#00FF00—
punctuation.quasi.element#008800—
entity.quasi.tag.name.js#FFFF00—
meta.group.braces.square string.quoted.single, punctuation.destructuring#47E9AC—
string.quoted.double#63C2EB—
punctuation.section.scope.curly.js#F9044E—
meta.delimiter.object.comma.js#00FFFF—
meta.group.braces.curly string.quoted.single#16B853—
support.function#B532FF—
punctuation.definition.string.begin.js#009FFF—
punctuation.definition.string.end.js#009FFF—
meta.class.inheritance, meta.instance.constructor#E81E41italic underline
entity.name.class.js#00FFFFitalic
entity.name.extends.js#00FF99italic
meta.function-call entity.name.function#5B24FF—
meta.function-call.function.with-arguments.js#33FF00—
meta.brace.curly.js#FF0099—
meta.brace.round.js#D0C5FEFF—
constant.character.escape#10CF62FF—
meta.selector.css entity.other.attribute-name.tag.pseudo-class#4FBC4B—
entity.namespace.unicode.css#FF4F4F—
entity.other.attribute-name.id#F20073FF—
meta.prototype support.class#FF0099—
support.object#FFEE00bold
meta.prototype support.constant#FF6600—
meta.prototype.declaration.js—bold
constant.language.undefined.js#555588—
variable.other.constant.js#00FF33—
constant.language.boolean.false#AAAA55—
constant.language.boolean.true#CC7744—
constant.language.null.js#558855—
punctuation.definition.entity.id.css#FF489F—
entity.other.attribute-name.class, source.css.less entity.other.attribute-name.class.css#9529B8—
punctuation.definition.entity.class.css#CD87E4FF—
entity.other.attribute-name.pseudo-element.css#FF00FFFF—
support.type.property-name.css#B8EFECFF—
meta.preprocessor.at-rule keyword.control.at-rule#D7C271FF—
constant.other.color.rgb-value.css, support.constant.color.w3c-standard-color-name.css#FB7720FF—
support.constant.property-value.css#7CE85EFF—
punctuation.terminator, punctuation.separator#4BFCF8FF—
meta.constructor.argument.css#8F9D6AFF—
meta.diff, meta.diff.header, entity.name.namespace#F8F8F8FF—
markup.deleted#F8F8F8FF—
markup.changed#F8F8F8FF—
markup.inserted#F8F8F8FF—
markup.italic#6AD500FFitalic
markup.underline#E18964FF—
markup.quote#E1D4B9FFitalic
markup.heading, markup.heading entity#FFFFFFFF—
markup.list#6657EAFF—
markup.raw#578BB3FF—
markup comment#F67B37FF—
meta.separator#60A633FF—
meta.line.entry.logfile, meta.line.exit.logfile#F8F8F8FF—
meta.line.error.logfile#F8F8F8—
meta.structure.dictionary.json string.quoted.double#63C2EB—
meta.structure meta.structure.dictionary.json string.quoted.double#0F89BA—
meta.structure meta.structure meta.structure meta.structure.dictionary.json string.quoted.double#6D7EF1—
meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure.dictionary.json string.quoted.double#4E69C2—
meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure.dictionary.json string.quoted.double#B3BBF7—
meta.structure.dictionary.value.json string.quoted.double#AA00AA—
meta.structure meta.structure meta.structure.dictionary.value.json string.quoted.double#BF00BF—
meta.structure meta.structure meta.structure meta.structure meta.structure.dictionary.value.json string.quoted.double#FF00FF—
meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure.dictionary.value.json string.quoted.double#FF40FF—
meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure.dictionary.value.json string.quoted.double#FF80FF—
meta.structure.dictionary.value.json string punctuation.definition.string.double#8409FF—
meta.structure.array.json string.quoted.double#5522AA—
meta.structure meta.structure meta.structure.array.json string.quoted.double#7017C8FF—
meta.structure meta.structure meta.structure meta.structure meta.structure.array.json string.quoted.double#9541E9FF—
meta.structure meta.structure meta.structure meta.structure meta.structure.array.json string.quoted.double#BA83F1FF—
meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure meta.structure.array.json string.quoted.double#DFC6F9FF—
meta.structure.dictionary.json string punctuation.definition.string#66BBDDFF—
meta.structure.array.json string punctuation.definition.string#416BE9FF—
meta.structure.array.json punctuation.definition.array#FCC401FF—
meta.structure.dictionary.json punctuation.definition.dictionary#FEDF76FF—
markup.deleted.git_gutter#CD3F45—
markup.inserted.git_gutter#48FFC2—
markup.changed.git_gutter#FFD200—
markup.ignored.git_gutter#7F29C4—
markup.untracked.git_gutter#7292A1—
sublimelinter.annotations#fff—
sublimelinter.gutter-mark#603F80—
sublimelinter.outline.illegal, sublimelinter.underline.illegal, sublimelinter.outline.violation#CD3F45—
sublimelinter.outline.warning, sublimelinter.underline.warning#EDBA00—
sublimelinter.mark.warning#EDBA00—
sublimelinter.mark.error#CD3F45—
brackethighlighter.default#D8F6FF—
brackethighlighter.tag#7e99a6—
brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle#fed02e—
brackethighlighter.quote#009FFF—
brackethighlighter.unmatched#fff—
brackethighlighter.c_define#603F80—
col_gutter#ffffff—
col_00FFFFFF#323232FF—
col_FFA500FF#2D2D2DFF—
col_0000FFFF#9D9D9DFF—
col_F0FF00FF#5D5D5DFF—
col_FF00FFFF#E9E9E9FF—
col_00FF64FF#212121FF—
col_FFFF00FF#616161FF—
col_00FF00FF#151515FF—
col_FF0000FF#CCCCCCFF—
col_010101FF#818181FF—
col_008000FF#CBCBCBFF—
col_DC143CFF#D4D4D4FF—
col_AADDDDFF#4D4D4DFF—
col_FFFFFFFF#7F7F7FFF—
col_DDEEFFFF#6A6A6AFF—
col_1BD459FF#0E0E0EFF—
col_0A170C01#808080FF—
col_031E11FF#949494FF—
col_080808FF#888888FF—
col_FFFFFF01#818181FF—
col_15EB5C91#D7D7D7FF—
col_0C7B46FF#D3D3D3FF—
col_135E1D44#919191FF—
col_555555FF#D5D5D5FF—
col_00000033#808080FF—
col_020202FF#828282FF—
col_14FDCEFF#313131FF—
col_00000066#808080FF—
col_00000099#808080FF—
col_383838FF#B8B8B8FF—
col_000000CC#808080FF—
col_1BD459E0#FDFDFDFF—
col_121212FF#929292FF—
col_D2B48CFF#383838FF—
col_DEFFDEFF#717171FF—
col_00000008#808080FF—
col_BF1F7FFF#D9D9D9FF—
col_040102FF#828282FF—
col_005898FF#C4C4C4FF—
col_00000001#808080FF—
col_00000002#808080FF—
col_808080FF#000000FF—
col_F5EBF7FF#6F6F6FFF—
col_BFFFBFFF#646464FF—
col_FFFF0001#808080FF—
col_00000010#808080FF—
col_7F0087FF#B5B5B5FF—
col_00000004#808080FF—
col_1F1F1FFF#9F9F9FFF—
col_F6F6F6FF#767676FF—
col_444444FF#C4C4C4FF—
col_333333FF#B3B3B3FF—
col_666666FF#E6E6E6FF—
col_D3D3D3FF#535353FF—
col_FFFFF1FF#7D7D7DFF—
col_7F003FFF#ADADADFF—
col_00007FFF#8E8E8EFF—
BlackRain 2 by UberKaeL - VS Code Theme