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#272822
  • activityBar.foreground#f8f8f2
  • badge.background#75715e
  • badge.foreground#f8f8f2
  • button.background#75715e
  • debugToolBar.background#1e1f1c
  • diffEditor.insertedTextBackground#4b661680
  • diffEditor.removedTextBackground#90274a70
  • dropdown.background#414339
  • dropdown.listBackground#1e1f1c
  • editor.background#272822
  • editor.foreground#f8f8f2
  • editor.lineHighlightBackground#3e3d32
  • editor.selectionBackground#878b9180
  • editor.selectionHighlightBackground#575b6180
  • editor.wordHighlightBackground#4a4a7680
  • editor.wordHighlightStrongBackground#6a6a9680
  • editorCursor.foreground#f8f8f0
  • editorGroup.border#34352f
  • editorGroup.dropBackground#41433980
  • editorGroupHeader.tabsBackground#1e1f1c
  • editorHoverWidget.background#414339
  • editorHoverWidget.border#75715e
  • editorLineNumber.activeForeground#c2c2bf
  • editorLineNumber.foreground#90908a
  • editorSuggestWidget.background#272822
  • editorSuggestWidget.border#75715e
  • editorWhitespace.foreground#464741
  • editorWidget.background#1e1f1c
  • focusBorder#99947c
  • input.background#414339
  • inputOption.activeBorder#75715e
  • inputValidation.errorBackground#90274a
  • inputValidation.errorBorder#f92672
  • inputValidation.infoBackground#546190
  • inputValidation.infoBorder#819aff
  • inputValidation.warningBackground#848528
  • inputValidation.warningBorder#e2e22e
  • list.activeSelectionBackground#75715e
  • list.dropBackground#414339
  • list.highlightForeground#f8f8f2
  • list.hoverBackground#3e3d32
  • list.inactiveSelectionBackground#414339
  • menu.background#1e1f1c
  • menu.foreground#cccccc
  • minimap.selectionHighlight#878b9180
  • panel.border#414339
  • panelTitle.activeBorder#75715e
  • panelTitle.activeForeground#f8f8f2
  • panelTitle.inactiveForeground#75715e
  • peekView.border#75715e
  • peekViewEditor.background#272822
  • peekViewEditor.matchHighlightBackground#75715e
  • peekViewResult.background#1e1f1c
  • peekViewResult.matchHighlightBackground#75715e
  • peekViewResult.selectionBackground#414339
  • peekViewTitle.background#1e1f1c
  • pickerGroup.foreground#75715e
  • ports.iconRunningProcessForeground#ccccc7
  • progressBar.background#75715e
  • quickInputList.focusBackground#414339
  • selection.background#878b9180
  • settings.focusedRowBackground#4143395a
  • sideBar.background#1e1f1c
  • sideBarSectionHeader.background#272822
  • statusBar.background#414339
  • statusBar.debuggingBackground#75715e
  • statusBar.noFolderBackground#414339
  • statusBarItem.remoteBackground#ac6218
  • tab.border#1e1f1c
  • tab.inactiveBackground#34352f
  • tab.inactiveForeground#ccccc7
  • tab.lastPinnedBorder#414339
  • terminal.ansiBlack#333333
  • terminal.ansiBlue#6a7ec8
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightBlue#819aff
  • terminal.ansiBrightCyan#66d9ef
  • terminal.ansiBrightGreen#52f97a
  • terminal.ansiBrightMagenta#a992f0
  • terminal.ansiBrightRed#f92672
  • terminal.ansiBrightWhite#f8f8f2
  • terminal.ansiBrightYellow#e2e22e
  • terminal.ansiCyan#56adbc
  • terminal.ansiGreen#86b42b
  • terminal.ansiMagenta#8c6bc8
  • terminal.ansiRed#c4265e
  • terminal.ansiWhite#e3e3dd
  • terminal.ansiYellow#b3b42b
  • titleBar.activeBackground#1e1f1c
  • widget.shadow#00000098

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded, string meta.image.inline.markdown, variable.legacy.builtin.python#F8F8F2
comment#88846F
string#FFC324
punctuation.definition.template-expression, punctuation.section.embedded#F92672
meta.template.expression#F8F8F2
constant.numeric#a992f0
constant.language#a992f0
constant.character, constant.other#a992f0
variable#F8F8F2
keyword#F92672
storage#F92672
storage.type#66D9EFitalic
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution#52f97aunderline bold
entity.other.inherited-class, punctuation.separator.namespace.ruby#52f97aitalic underline bold
entity.name.function#52f97abold
entity.name.tag#F92672bold
entity.other.attribute-name#52f97aunderline
support.function#66D9EFbold
support.constant#66D9EFbold
support.type, support.class#66D9EFitalic bold
storage.type#66D9EFitalic bold
keyword#F92672bold
storage#F92672bold
storage.type#66D9EFitalic
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution#52f97aunderline
entity.other.inherited-class, punctuation.separator.namespace.ruby#52f97aitalic underline
entity.name.function#52f97a
variable.parameter#FF9E00italic
variable.other.readwrite#FFFFFF
variable.other.object#FF9E00
entity.name.tag#F92672
entity.other.attribute-name#52f97a
support.function#66D9EF
support.constant#66D9EF
support.type, support.class#66D9EFitalic
support.other.variable
invalid#F44747
invalid.deprecated#F44747
meta.structure.dictionary.json string.quoted.double.json#CFCFC2
meta.diff, meta.diff.header#75715E
markup.deleted#F92672
markup.inserted#52f97a
markup.changed#FFC324
constant.numeric.line-number.find-in-files - match#a992f0A0
entity.name.filename.find-in-files#FFC324
markup.quote#F92672
markup.list#FFC324
markup.bold, markup.italic#66D9EF
markup.inline.raw#FF9E00
markup.heading#52f97abold
markup.heading.setext#52f97abold underline
markup.heading.markdownbold underline
markup.bold.markdownbold
markup.italic.markdownitalic
markup.bold, markup.italic#66D9EFbold italic
markup.inline.raw#FF9E00
markup.heading#52f97a
markup.heading.setext#52f97abold
markup.heading.markdownbold
markup.quote.markdown#75715Eitalic
markup.bold.markdownbold
string.other.link.title.markdown,string.other.link.description.markdown#a992f0
markup.underline.link.markdown,markup.underline.link.image.markdown#FFC324
markup.italic.markdownitalic
markup.strikethroughstrikethrough
markup.list.unnumbered.markdown, markup.list.numbered.markdown#F8F8F2
punctuation.definition.list.begin.markdown#52f97a
token.info-token#6796E6
token.warn-token#CD9731
token.error-token#F44747
token.debug-token#B267E6
variable.language#FF9E00