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#000000
  • activityBar.foreground#FFB23F
  • activityBar.inactiveForeground#F4EBC180
  • activityBarBadge.background#D62828
  • activityBarBadge.foreground#FFFFFF
  • badge.background#D62828
  • badge.foreground#FFFFFF
  • button.background#D62828
  • button.foreground#FFFFFF
  • button.hoverBackground#FF7A00
  • dropdown.background#111111
  • dropdown.border#003049
  • dropdown.foreground#F4EBC1
  • editor.background#111111
  • editor.findMatchBackground#FF7A0070
  • editor.findMatchHighlightBackground#FFB23F44
  • editor.foreground#F4EBC1
  • editor.lineHighlightBackground#1A1A1A
  • editor.selectionBackground#003049
  • editor.selectionHighlightBackground#00304999
  • editor.wordHighlightBackground#00304980
  • editorBracketMatch.background#003049AA
  • editorBracketMatch.border#FFB23F
  • editorCursor.foreground#FF7A00
  • editorError.foreground#D62828
  • editorIndentGuide.activeBackground1#FFB23F
  • editorIndentGuide.background1#252525
  • editorInfo.foreground#2E7D96
  • editorLineNumber.activeForeground#FFB23F
  • editorLineNumber.foreground#5C5C5C
  • editorWarning.foreground#FFB23F
  • input.background#000000
  • input.border#003049
  • input.foreground#F4EBC1
  • inputOption.activeBorder#FF7A00
  • list.activeSelectionBackground#003049
  • list.activeSelectionForeground#FFFFFF
  • list.highlightForeground#FFB23F
  • list.hoverBackground#1A1A1A
  • list.inactiveSelectionBackground#00304988
  • menubar.selectionBackground#1E1E1E
  • menubar.selectionForeground#FFB23F
  • panel.background#0C0C0C
  • panel.border#003049
  • panelTitle.activeForeground#FFB23F
  • panelTitle.inactiveForeground#F4EBC188
  • progressBar.background#FF7A00
  • scrollbarSlider.activeBackground#FF7A00
  • scrollbarSlider.background#00304988
  • scrollbarSlider.hoverBackground#003049CC
  • sideBar.background#0C0C0C
  • sideBar.border#1E1E1E
  • sideBar.foreground#F4EBC1
  • sideBarSectionHeader.background#111111
  • sideBarSectionHeader.foreground#FFB23F
  • sideBarTitle.foreground#FFFFFF
  • statusBar.background#003049
  • statusBar.debuggingBackground#D62828
  • statusBar.debuggingForeground#FFFFFF
  • statusBar.foreground#FFFFFF
  • statusBar.noFolderBackground#1E1E1E
  • tab.activeBackground#111111
  • tab.activeBorderTop#FF7A00
  • tab.activeForeground#FFFFFF
  • tab.border#000000
  • tab.hoverBackground#1A1A1A
  • tab.inactiveBackground#0C0C0C
  • tab.inactiveForeground#F4EBC1AA
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#003049
  • terminal.ansiBrightBlack#1E1E1E
  • terminal.ansiBrightBlue#00587A
  • terminal.ansiBrightCyan#4FA8C7
  • terminal.ansiBrightGreen#FFF6C9
  • terminal.ansiBrightMagenta#FF9A2F
  • terminal.ansiBrightRed#FF4545
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#FFD16A
  • terminal.ansiCyan#2E7D96
  • terminal.ansiGreen#F4EBC1
  • terminal.ansiMagenta#FF7A00
  • terminal.ansiRed#D62828
  • terminal.ansiWhite#FFFFFF
  • terminal.ansiYellow#FFB23F
  • terminal.background#000000
  • terminal.foreground#F4EBC1
  • terminalCursor.foreground#FF7A00
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#FFFFFF
  • titleBar.inactiveBackground#111111
  • titleBar.inactiveForeground#F4EBC199

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#777777italic
keyword, storage.type, storage.modifier#D62828
keyword.control, keyword.operator.expression#FF7A00
string, constant.other.symbol#FFB23F
constant.numeric, constant.language, support.constant#FF7A00
entity.name.function, support.function, meta.function-call#FFE08A
entity.name.type, entity.name.class, support.type, entity.name.struct#F4EBC1
variable, variable.other, meta.definition.variable.name#FFFFFF
variable.parameter#F4EBC1
variable.other.property, support.variable.property#FFB23F
keyword.operator, punctuation#CFC6A0
meta.preprocessor, keyword.control.directive, punctuation.definition.directive#2E7D96
invalid, invalid.illegal#FFFFFF
LASER Brand Theme by Liga Acadêmica de Sistemas Embarcados (LASER) - VS Code Theme