Skip to main content
CodingTheme

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.insertedTextBackground#76cddc23
  • diffEditor.removedTextBackground#ff3a2840
  • editor.background#000000
  • editor.findMatchBackground#ff815c50
  • editor.findMatchHighlightBackground#2d3a3caa
  • editor.foreground#accecb
  • editor.lineHighlightBackground#2d3a3c
  • editor.selectionBackground#a1e4f250
  • editorCursor.foreground#a1e4f2
  • editorGutter.addedBackground#a1e4f2
  • editorGutter.modifiedBackground#fefedb
  • editorOverviewRuler.addedForeground#a1e4f2
  • editorOverviewRuler.deletedForeground#ff815c
  • editorOverviewRuler.modifiedForeground#fefedb
  • editorWarning.foreground#ff815c
  • editorWhitespace.foreground#2d3a3c
  • focusBorder#ff815c
  • input.border#3f5459
  • list.activeSelectionBackground#2d3a3c
  • list.focusBackground#2d3a3c
  • list.highlightForeground#ff815c
  • sideBar.background#1b191b
  • statusBar.background#3f5459
  • statusBar.noFolderBackground#ff815c
  • titleBar.activeBackground#2d3a3c
  • titleBar.activeForeground#ffffff

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#accecbff
comment#396269
keyword.operator.class, constant.other, source.php.embedded.line#76cddc
variable, support.other.variable, string.other.link, string.regexp, entity.other.attribute-name#fefedb
variable.language#accecb
constant.numeric, entity.name.tag, meta.tag, declaration.tag, constant.language, support.constant, constant.character, variable.parameter, punctuation.section.embedded, keyword.other.unit#ff815c
meta.tag#accecb
entity.name.class, entity.name.type.class, support.type, support.class#d9fefdnormal
string, constant.other.symbol, entity.other.inherited-class, markup.heading#9ea485
keyword.operator, constant.other.color#78cfde
entity.name.function, meta.function-call, support.function, keyword.other.special-method, meta.block-level#78cfdeitalic
keyword, entity.name.tag.css#d1dbaf
storage#d1dbaf
storage.type#78cfdeitalic
invalid#8a291b
meta.separator#9fa586
invalid.deprecated#8a291b
meta.structure.dictionary.json string.quoted.double.json#fefedb
meta.diff, meta.diff.header#396269
markup.deleted#ff815a
markup.inserted#c4fefd
markup.changed#fcffc7
constant.numeric.line-number.find-in-files#5997a3
constant.numeric.line-number.match.find-in-files#000000bold
entity.name.filename.find-in-files#fcffc7
text.html.markdown#9dc3bf
text.html.markdown markup.raw.inline#77c9d9italic
text.html.markdown markup.raw.inline punctuation.definition.raw.markdown#c4fefd
text.html.markdown meta.dummy.line-break#d1fefc
markdown.heading, markup.heading | markup.heading entity.name#fcffc7bold
markup.heading.markdown punctuation.definition.heading.markdown#396269normal
markup.italicitalic
markup.boldbold
markup.underlineunderline
markup.quote, punctuation.definition.blockquote.markdown#c5cf8ditalic
markup.quote#8b9474italic
markup.underline.link.markdown,string.other.link.markdown,markup.underline.link.image.markdown#8b9474underline
punctuation.definition.string.begin.markdown,punctuation.definition.string.end.markdown#fc674ebold
meta.image.inline.markdown#fcffc7normal
string.other.link.title.markdown#b3bd93underline
markup.raw.block#d1fefc
punctuation.definition.list_item.markdown#fc674e
markup.raw.block.fenced.markdown#ffffff
punctuation.definition.fenced.markdown, variable.language.fenced.markdown#263f45
variable.language.fenced.markdown#d1fefcitalic
meta.separator#fcffc7bold
markup.table#b42a1d
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Tech49 Theme by Tim Dang - VS Code Theme