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#003228
  • activityBar.dropBorder#be0d07
  • activityBar.foreground#ffffff
  • activityBarBadge.background#6efaa0
  • activityBarBadge.foreground#003228
  • badge.background#6efaa0
  • badge.foreground#003228
  • button.background#009b5f
  • button.secondaryBackground#001405
  • button.secondaryHoverBackground#001405bb
  • debugToolBar.background#003228
  • dropdown.background#001405
  • editor.background#00331b
  • editor.foldBackground#000a0530
  • editor.lineHighlightBackground#009b5f30
  • editor.lineHighlightBorder#28282800
  • editor.selectionHighlightBackground#6efaa030
  • editor.wordHighlightBackground#6efaa030
  • editorCursor.background#000000
  • editorCursor.foreground#be0d07
  • editorError.foreground#ff7882
  • editorGroup.border#000a05
  • editorGroup.dropBackground#6efaa030
  • editorGroupHeader.tabsBackground#003228
  • editorGutter.addedBackground#d1f1a9
  • editorGutter.deletedBackground#ff9da4
  • editorGutter.foldingControlForeground#ffffffaa
  • editorGutter.modifiedBackground#80baff
  • editorIndentGuide.activeBackground1#ffffff40
  • editorIndentGuide.background1#ffffff20
  • editorInfo.foreground#80baff
  • editorLineNumber.activeForeground#fbb2b1
  • editorLineNumber.foreground#b2b2fe
  • editorRuler.foreground#ffffff60
  • editorWarning.foreground#ffe580
  • editorWhitespace.foreground#ffffff30
  • editorWidget.background#003228
  • editorWidget.resizeBorder#009b5f
  • focusBorder#6efaa0
  • foreground#cccccc
  • gitDecoration.addedResourceForeground#d1f1a9
  • gitDecoration.conflictingResourceForeground#99ffff
  • gitDecoration.deletedResourceForeground#ff7882
  • gitDecoration.ignoredResourceForeground#8c8c8c
  • gitDecoration.modifiedResourceForeground#ffe580
  • gitDecoration.renamedResourceForeground#6efaa0
  • gitDecoration.stageDeletedResourceForeground#ff9da4
  • gitDecoration.stageModifiedResourceForeground#ffeead
  • gitDecoration.submoduleResourceForeground#bbdaff
  • gitDecoration.untrackedResourceForeground#b8f171
  • input.background#001405
  • inputOption.activeBackground#009b5f
  • inputOption.activeBorder#009b5f
  • list.activeSelectionBackground#ffffff60
  • list.dropBackground#009b5f
  • list.focusBackground#009b5f
  • list.highlightForeground#6efaa0
  • list.hoverBackground#ffffff30
  • list.inactiveSelectionBackground#ffffff40
  • menu.background#005f46
  • menu.separatorBackground#ffffff40
  • notifications.border#ffffff40
  • notificationsErrorIcon.foreground#ff7882
  • notificationsInfoIcon.foreground#80baff
  • notificationsWarningIcon.foreground#ffe580
  • panel.background#003228
  • pickerGroup.border#ffffff40
  • progressBar.background#6efaa0
  • scrollbar.shadow#000a05
  • scrollbarSlider.activeBackground#6efaa040
  • scrollbarSlider.background#6efaa020
  • scrollbarSlider.hoverBackground#6efaa060
  • selection.background#6efaa080
  • sideBar.background#016134
  • sideBarSectionHeader.background#ffffff10
  • statusBar.background#001405
  • statusBar.debuggingBackground#cc6633
  • statusBar.noFolderBackground#001405
  • statusBarItem.hoverBackground#ffffff40
  • statusBarItem.remoteBackground#009b5f
  • tab.activeBackground#00331b
  • tab.border#001405
  • tab.dragAndDropBorder#be0d07
  • tab.inactiveBackground#016134
  • terminal.ansiBlack#333333
  • terminal.ansiBlue#bbdaff
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightBlue#80baff
  • terminal.ansiBrightCyan#78ffff
  • terminal.ansiBrightGreen#b8f171
  • terminal.ansiBrightMagenta#d778ff
  • terminal.ansiBrightRed#ff7882
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#ffe580
  • terminal.ansiCyan#99ffff
  • terminal.ansiGreen#d1f1a9
  • terminal.ansiMagenta#ebbbff
  • terminal.ansiRed#ff9da4
  • terminal.ansiWhite#cccccc
  • terminal.ansiYellow#ffeead
  • terminalCursor.background#000a05
  • terminalCursor.foreground#009b5f
  • textLink.activeForeground#6efaa0
  • textLink.foreground#6efaa0
  • titleBar.activeBackground#001405
  • titleBar.inactiveBackground#003228
  • tree.inactiveIndentGuidesStroke#ffffff20
  • tree.indentGuidesStroke#ffffff40
  • widget.shadow#000a0580

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#b3b3b3italic
string#ffff80
punctuation.definition.template-expression#ccffff
constant.character.escape#ccffff
punctuation.definition.translate support.function.translate#ccffff
punctuation.definition.translate#ffffff
keyword.other.directive#ffccff
variable#ffffff
keyword, keyword.operator.expression#b3b3ff
keyword.operator#ccffff
constant#ffff80
variable.language#ffff80
support.function.object#ccffff
punctuation.definition.label, punctuation.label#80ff80
entity.name.tag, entity.name.type.struct, entity.name.member, entity.name.function#ffffff
punctuation.definition.struct#ffffff
punctuation.squarebracket#ffffff
punctuation.parenthesis#ffffff
punctuation.terminator#ffffff
punctuation.accessor#ffffff
punctuation.separator.coloncolon#ccffff
punctuation.separator.colon#ccffff
punctuation.definition.vector#ccffff
punctuation.separator.comma#ffffff
storage.type#80ff80
meta.struct.maniascript entity.name.type.struct#80ff80
entity.name.type.class#80ff80
meta.literal.enum entity.name.type.class, meta.type.name variable.other.namespace#80ff80
meta.literal.enum entity.name.type.enum-name, meta.literal.enum entity.name.type.enum-value, storage.type.with-namespace#ffffff
keyword.other.comment-tag.debug#ffaa00
Trackmania 2020 theme by Aessi - VS Code Theme