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#d0d0d0
  • activityBar.foreground#999999
  • activityBarBadge.background#719899
  • editor.background#e0e0e0
  • editor.foreground#616161
  • editor.lineHighlightBackground#d9d9d9
  • editor.selectionBackground#bbddde
  • editorGroupHeader.tabsBackground#d1d0d1
  • editorGutter.background#d0d0d0
  • editorLineNumber.activeForeground#be7572
  • editorLineNumber.foreground#a5a486
  • list.activeSelectionBackground#d9d9d9
  • list.activeSelectionForeground#616161
  • list.hoverBackground#d9d9d9
  • list.inactiveSelectionBackground#d9d9d9
  • list.inactiveSelectionForeground#616161
  • sideBar.background#e1e1e1
  • statusBar.background#997371
  • statusBar.foreground#deddbc
  • tab.activeBackground#616161
  • tab.activeBorder#00000000
  • tab.activeForeground#dfdebd
  • tab.border#00000000
  • tab.inactiveBackground#bfbfbf
  • tab.inactiveForeground#75758f
  • terminal.ansiBlack#616161
  • terminal.ansiBlue#719899
  • terminal.ansiBrightBlack#616161
  • terminal.ansiBrightBlue#719899
  • terminal.ansiBrightCyan#009799
  • terminal.ansiBrightGreen#719872
  • terminal.ansiBrightMagenta#cf2172
  • terminal.ansiBrightRed#e12672
  • terminal.ansiBrightYellow#e4c203
  • terminal.ansiCyan#009799
  • terminal.ansiGreen#719872
  • terminal.ansiMagenta#cf2172
  • terminal.ansiRed#e12672
  • terminal.ansiYellow#e4c203
  • terminal.background#e0e0e0
  • terminal.foreground#616161

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#616161ff
token.info-token#316bcd
token.warn-token#cd9731
token.error-token#cd3131
token.debug-token#800080
comment#719872bold
string#616161
storage.type#be7572
storage.type.ts#9A7599
keyword#E12672
keyword.control.import#be7572
keyword.control.export#be7572
keyword.control.as#be7572
keyword.control.from#be7572
variable.other#616161
support.function#616161
support.class#616161
keyword.control.flow#BE7572
keyword.control.conditional#BE7572
meta.brace.square#AB8500
keyword.operator.new#BE7572
support.type.property-name#616161
punctuation.definition.block#A67200
punctuation.definition.dictionary.begin, punctuation.definition.dictionary.end#A67200
keyword.operator.assignment#BE7572
punctuation.definition.parameters.begin, punctuation.definition.parameters.end#BE7572
storage.type.function.arrow#BE7572
meta.brace.round#BE7572
constant.numeric.decimal#9A7372
storage.type.class#BE7572
storage.modifier#BE7572
entity.name.type#A47A33
support.type#A47A33
entity.other.inherited-class#A47A33
variable.language#9A7599
keyword.operator.type.annotation#616161
keyword.operator#616161
keyword.operator.logical#be7572
keyword.operator.comparison#BE7572
keyword.control.loop#BE7572
entity.name.tag.css#616161
punctuation.definition.entity.css#be7572
entity.other.attribute-name.class.css#9A7200
support.constant.property-value.css#9A7372
support.type.property-name.css#616161
constant.numeric#875f5f
keyword.other.unit.percentage.css#875f5f
keyword.other.important.css#E19972
keyword.control.default#9A7599
entity.other.attribute-name.pseudo-class.css#727100
keyword.other.unit.px.css#9a7372
keyword.other.unit.rem.css#9a7372
constant.numeric#9a7372
comment#719872
support.type.property-name.css#9a7200
punctuation.separator.list.comma.css#be7572
entity.other.attribute-name.class.css#9a7200
entity.name.tag.css
constant.other.rgb-value.css#9A7372
meta.tag.sgml.doctype.html, meta.tag.sgml.html#719872
entity.name.tag.block.any.html, entity.name.tag.tsx,entity.name.tag.jsx, entity.name.tag.html, entity.name.tag.structure.any.html, entity.name.tag.inline.any.html#9A7200bold
support.class.component.tsx,support.class.component.jsx#9A7200bold
entity.other.attribute-name.id.html, entity.other.attribute-name.tsx,entity.other.attribute-name.jsx, entity.other.attribute-name.html#9a7200
entity.other.attribute-name.localname.xml#9a7200
entity.other.attribute-name.xml#9a7200
entity.other.attribute-name.namespace.xml#9a7200
entity.name.tag.localname.xml#9A7200
entity.name.tag.xml#9a7200
meta.tag.preprocessor.xml#719872
lagom by shwilliam - VS Code Theme