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.activeBackground#194d2c
  • activityBar.background#0f0f0f
  • activityBar.foreground#fdf4c1
  • badge.background#194d2c
  • badge.foreground#fdf4c1
  • breadcrumb.foreground#fdf4c1
  • dropdown.foreground#fdf4c1
  • editor.background#151515
  • editor.findMatchBackground#194d2c
  • editor.foreground#fdf4c1
  • editor.inactiveSelectionBackground#0f0f0f
  • editor.lineHighlightBackground#0f0f0f
  • editor.selectionBackground#735b5bf7
  • editorBracketHighlight.foreground5#3ff1e3
  • editorCodeLens.foreground#d9ff00
  • editorCursor.foreground#fde08c
  • editorSuggestWidget.background#194d2c
  • editorSuggestWidget.foreground#fdf4c1
  • editorSuggestWidget.highlightForeground#66999d
  • editorSuggestWidget.selectedBackground#232c2b
  • editorWhitespace.foreground#0f0f0f
  • editorWidget.background#64625d
  • editorWidget.foreground#fdf4c1
  • list.activeSelectionBackground#194d2c
  • list.hoverBackground#194d2c
  • list.inactiveSelectionBackground#194d2c
  • list.inactiveSelectionForeground#fdf4c1
  • menu.background#194d2c
  • menu.foreground#fdf4c1
  • menu.selectionBackground#194d2c
  • menubar.selectionBackground#194d2c
  • panel.background#0f0f0f
  • panelInput.border#fdf4c1
  • panelTitle.activeForeground#fdf4c1
  • scrollbarSlider.hoverBackground#194d2c
  • selection.background#194d2c
  • settings.checkboxForeground#14d18f
  • settings.headerForeground#fdf4c1
  • settings.numberInputForeground#14d18f
  • settings.textInputForeground#fdf4c1
  • sideBar.background#151515
  • sideBar.foreground#fdf4c1
  • sideBarSectionHeader.background#0f0f0f
  • sideBarTitle.foreground#194d2c
  • statusBar.background#194d2c
  • statusBar.foreground#fdf4c1
  • statusBarItem.hoverBackground#194d2c
  • tab.activeBackground#194d2c
  • tab.activeForeground#fdf4c1
  • tab.hoverBackground#194d2c
  • tab.inactiveBackground#0f0f0f
  • terminal.ansiBlack#fdf4c1
  • terminal.ansiBlue#64625d
  • terminal.ansiGreen#194d2c
  • terminal.ansiWhite#66999d
  • terminal.ansiYellow#9b3a3a
  • terminal.foreground#8accc0
  • welcomePage.background#0f0f0f

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#C48888
entity#A88D6A
keyword#DD6C41
keyword.control#DD6C41—
keyword.operator#DD6F48—
entity.name.type#FFA66Bunderline
support#FE801F—
storage#66999D—
storage.modifier#66CCFF—
constant#EFF4C1—
string#14D18F—
constant.numeric#D3869B bold
punctuation——
variable#FDF4C1—
invalid.deprecated#D3869Bitalic underline
invalid.illegal#D3869B—
text source—
entity.other.inherited-class#9B5C2Eitalic
source string source#FDF4C1—
source string source punctuation.section.embedded#00A0A0
string constant#269E9E
string.regexp#E9C062—
string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition#FF8000
string.regexp.group#BD9C4F
string.regexp.character-class#B18A3D
string variable#77A598
support.function#DAD085
support.constant#FFD2A7
meta.preprocessor.c#8996A8—
meta.preprocessor.c keyword#AFC4DB
meta.cast#676767italic
meta.sgml.html meta.doctype, meta.sgml.html meta.doctype entity, meta.sgml.html meta.doctype string, meta.xml-processing, meta.xml-processing entity, meta.xml-processing string#494949—
meta.tag entity#DD6C41normal
source entity.name.tag, source entity.other.attribute-name, meta.tag.inline entity#DD6C41—
entity.other.attribute-name#AAAAAA
entity.name.tag.namespace, entity.other.attribute-name.namespace#E18964
meta.selector.css entity.name.tag#66CCFFunderline
meta.selector.css entity.other.attribute-name.tag.pseudo-class#8F9D6A
meta.selector.css entity.other.attribute-name.id#83A598
meta.selector.css entity.other.attribute-name.class#83A598
support.type.property-name.css,tag#FDF4C1—
meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css#DD6C41—
meta.preprocessor.at-rule keyword.control.at-rule#8693A5—
meta.property-value support.constant.named-color.css, meta.property-value constant#87C38A—
meta.constructor.argument.css#8F9D6A—
meta.diff, meta.diff.header#F8F8F8italic
markup.deleted#F8F8F8—
markup.changed#F8F8F8—
markup.inserted#F8F8F8—
markup.italic#E9C062italic
markup.bold#E9C062 bold
markup.underline#E18964underline
markup.quote#E1D4B9italic
markup.heading, markup.heading entity#FEDCC5
markup.list#E1D4B9—
markup.raw#578BB3
markup comment—italic
meta.separator#60A633—
meta.line.entry.logfile, meta.line.exit.logfile——
meta.line.error.logfile——
sideBar.background#111—
string#7EC669—
meta.embedded.assembly#7EC669—
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—
V-Theme by V - VS Code Theme