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#000080
  • activityBar.foreground#FFFFFF
  • activityBar.inactiveForeground#808080
  • activityBarBadge.background#FF0000
  • activityBarBadge.foreground#FFFFFF
  • badge.background#800000
  • badge.foreground#FFFFFF
  • button.background#800000
  • button.border#ff0000
  • button.foreground#FFFFFF
  • button.hoverBackground#464646
  • button.separator#fdf901
  • dropdown.background#000080
  • dropdown.border#800000
  • dropdown.foreground#FFFFFF
  • editor.background#000058
  • editor.foreground#00FF00
  • editor.inactiveSelectionBackground#400000
  • editor.lineHighlightBackground#00AAAA
  • editor.selectionBackground#808080
  • editor.selectionForeground#ffffff
  • editorCursor.foreground#FFFFFF
  • editorGroupHeader.tabsBackground#303030
  • editorGutter.background#D3D3D3
  • input.background#000080
  • input.border#800000
  • input.foreground#FFFFFF
  • menu.background#D3D3D3
  • menu.border#D3D3D3
  • menu.foreground#000000
  • menu.selectionBackground#00bb54
  • menu.separatorBackground#fdf901
  • outputView.background#000000
  • panel.background#333333
  • panel.border#102030
  • panelTitle.activeForeground#FFFFFF
  • panelTitle.inactiveForeground#fdf901
  • sideBar.background#000000
  • sideBar.foreground#FFFFFF
  • sideBarSectionHeader.background#000000
  • sideBarSectionHeader.foreground#FFFFFF
  • sideBarTitle.foreground#808080
  • statusBar.background#D3D3D3
  • statusBar.foreground#000000
  • statusBar.noFolderForeground#808080
  • statusBarItem.hoverBackground#FF0000
  • tab.activeBackground#000080
  • tab.activeForeground#000000
  • tab.inactiveBackground#000000
  • tab.inactiveForeground#808080
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#0000FF
  • terminal.ansiBrightBlack#808080
  • terminal.ansiBrightBlue#0000FF
  • terminal.ansiBrightCyan#00FFFF
  • terminal.ansiBrightGreen#00FF00
  • terminal.ansiBrightMagenta#FF00FF
  • terminal.ansiBrightRed#FF0000
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#FFFF00
  • terminal.ansiCyan#008080
  • terminal.ansiGreen#008000
  • terminal.ansiMagenta#800080
  • terminal.ansiRed#800000
  • terminal.ansiWhite#C0C0C0
  • terminal.ansiYellow#808000
  • terminal.background#000000
  • terminal.foreground#b8b8b8
  • terminalCursor.background#FFFFFF
  • terminalCursor.foreground#FFFFFF
  • titleBar.activeBackground#808080
  • titleBar.activeForeground#000000
  • titleBar.inactiveBackground#000000
  • titleBar.inactiveForeground#808080
  • toolbar.activeBackground#ff0000
  • window.activeBorder#808080
  • window.inactiveBorder#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#00FFFFitalic
string#EE0000
variable#00AA00
keyword, storage.type, storage.modifier#FFFFFF
entity.name.function#00FF00
keyword.control.import#0000FF
constant.numeric.integer#808080
constant.numeric.float#FF69B4
punctuation, meta.brace, meta.separator#FFFF00
gutter#D3D3D3
Turbo C.3.0-Theme by Watkins Labs - VS Code Theme