Skip to main content
CodingTheme

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#2e3436
  • badge.background#75507b
  • button.background#2B3C5D
  • debugExceptionWidget.background#2e3436
  • debugExceptionWidget.border#555753
  • debugToolBar.background#2e3436
  • diffEditor.insertedTextBackground#3465a4
  • diffEditor.removedTextBackground#a40000
  • dropdown.background#888a85
  • editor.background#2e3436
  • editor.findMatchHighlightBackground#555753
  • editor.lineHighlightBackground#555753
  • editor.selectionBackground#3465a4
  • editorCursor.foreground#edd400
  • editorGroup.border#888a85
  • editorGroup.dropBackground#2e3436
  • editorGroupHeader.tabsBackground#555753
  • editorHoverWidget.background#555753
  • editorHoverWidget.border#888a85
  • editorIndentGuide.activeBackground#5c3566
  • editorIndentGuide.background#555753
  • editorLineNumber.activeForeground#e9b96e
  • editorLineNumber.foreground#8f5902
  • editorLink.activeForeground#4e9a06
  • editorMarkerNavigation.background#a40000
  • editorMarkerNavigationError.background#cc0000
  • editorMarkerNavigationWarning.background#ce5c00
  • editorWhitespace.foreground#ad7fa8
  • editorWidget.background#555753
  • extensionButton.prominentBackground#5c3566
  • extensionButton.prominentHoverBackground#ad7fa8
  • focusBorder#ad7fa8
  • input.background#888a85
  • inputOption.activeBorder#729fcf
  • inputValidation.errorBackground#cc0000
  • inputValidation.errorBorder#a40000
  • inputValidation.infoBackground#204a87
  • inputValidation.infoBorder#3465a4
  • inputValidation.warningBackground#ce5c00
  • inputValidation.warningBorder#ce5c00
  • list.activeSelectionBackground#888a85
  • list.dropBackground#555753
  • list.focusBackground#888a85
  • list.highlightForeground#8ae234
  • list.hoverBackground#888a85
  • list.inactiveSelectionBackground#555753
  • panel.border#c17d11
  • peekView.border#888a85
  • peekViewEditor.background#2e3436
  • peekViewEditor.matchHighlightBackground#555753
  • peekViewResult.background#2e3436
  • peekViewResult.matchHighlightBackground#555753
  • peekViewTitle.background#2e3436
  • pickerGroup.border#ad7fa8
  • pickerGroup.foreground#ad7fa8
  • progressBar.background#d3d7cf
  • scrollbar.shadow#555753
  • scrollbarSlider.activeBackground#888a85
  • scrollbarSlider.background#555753
  • scrollbarSlider.hoverBackground#888a85
  • sideBar.background#555753
  • sideBarSectionHeader.background#8f5902
  • statusBar.background#555753
  • statusBar.debuggingBackground#555753
  • statusBar.noFolderBackground#ef2929
  • statusBarItem.prominentBackground#4e9a06
  • statusBarItem.prominentHoverBackground#73d216
  • tab.border#2e3436
  • tab.inactiveBackground#555753
  • terminal.ansiBlack#555753
  • terminal.ansiBlue#ad7fa8
  • terminal.ansiBrightBlack#888a85
  • terminal.ansiBrightBlue#729fcf
  • terminal.ansiBrightCyan#f57900
  • terminal.ansiBrightGreen#8ae234
  • terminal.ansiBrightMagenta#ad7af8
  • terminal.ansiBrightRed#ef2929
  • terminal.ansiBrightWhite#eeeeec
  • terminal.ansiBrightYellow#fce94f
  • terminal.ansiCyan#3465a4
  • terminal.ansiGreen#73d216
  • terminal.ansiMagenta#5c3566
  • terminal.ansiRed#cc0000
  • terminal.ansiWhite#d3d7cf
  • terminal.ansiYellow#edd400
  • titleBar.activeBackground#555753

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
punctuation.definition.directive, keyword.control.directive#ef2929bold
entity.name.scope-resolution#ef2929
entity.name.namespace, meta.body.namespace.cpp#8ae234
entity.name.type, storage.type.primitive, storage.type.user-defined, meta.function.definition.parameters.cpp, storage.type#8ae234
storage.type.class, storage.type.template.cpp, storage.type.template.argument.class, storage.type.namespace.definition.cpp, storage.type.namespace.directive.cpp#ad7fa8bold
comment, punctuation.definition.comment#888a85
string, punctuation.definition.string#fce94f
punctuation.section, punctuation.definition, punctuation.separator, punctuation.terminator, meta.function.definition.special.constructor#eeeeec
meta.body.function.definition, meta.block, variable.parameter.cpp, variable.other.object.access.cpp#eeeeec
constant.character, constant.other, constant.numeric.decimal.cpp#ce5c00
entity.name.function#729fcf
variable.other.property, variable.other.object.property.cpp, variable.other.object.cpp#8ae234
meta.conditional.case.cpp#8ae234
keyword#ad7fa8bold
storage.modifier, storage.type.modifier.access.public.cpp, storage.type.modifier.access.private.cpp, storage.type.modifier.access.protected.cpp, storage.type.modifier.access.control.public.cpp, storage.type.modifier.access.control.private.cpp, storage.type.modifier.access.control.protected.cpp#ad7fa8bold
constant.language.c, constant.language.cpp, constant.language.true.cpp, constant.language.false.cpp#ef2929
entity.name.type.inherited#ad7fa8
invalid#ef2929
invalid.deprecated#ef2929
meta.diff, meta.diff.header#babdb6italic
markup.deleted#a40000
markup.changed#f57900
markup.inserted#8ae234
markup.quote#729fcf
markup.bold, markup.italic#729fcf
markup.inline.raw#c4a000
markup.heading.setext#edd400

Shiki preview

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

Loading...

Oblivion++ by parityb1t - VS Code Theme