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.activeBorder#f57900
  • activityBar.background#2b2e39
  • activityBar.foreground#d3dae3
  • button.background#f57900
  • button.foreground#ffffff
  • button.hoverBackground#C36200
  • contrastBorder#2b2e39
  • dropdown.background#404651
  • dropdown.border#2b2e39
  • dropdown.foreground#d3dae3
  • editor.background#383c4a
  • editor.foreground#d3dae3
  • editor.inactiveSelectionBackground#C36200
  • editor.lineHighlightBackground#404651
  • editor.selectionBackground#f57900
  • editorCursor.foreground#f57900
  • editorLineNumber.activeForeground#d3dae3
  • editorLineNumber.foreground#9ba2ab
  • editorWhitespace.foreground#505666
  • focusBorder#f57900
  • input.background#404651
  • input.border#2b2e39
  • input.foreground#d3dae3
  • input.placeholderForeground#9ba2ab
  • inputOption.activeBorder#f57900
  • list.activeSelectionBackground#f57900
  • list.activeSelectionForeground#ffffff
  • list.focusBackground#4e5467
  • list.hoverBackground#505666
  • list.inactiveSelectionBackground#C36200
  • panel.background#383c4a
  • panel.border#2b2e39
  • progressBar.background#f57900
  • sideBar.background#383c4a
  • sideBar.border#2b2e39
  • sideBar.foreground#d3dae3
  • statusBar.background#2b2e39
  • statusBar.foreground#d3dae3
  • statusBar.noFolderBackground#2b2e39
  • tab.activeBackground#383c4a
  • tab.activeBorder#f57900
  • tab.activeForeground#d3dae3
  • tab.border#2b2e39
  • tab.inactiveBackground#2b2e39
  • tab.inactiveForeground#9ba2ab
  • titleBar.activeBackground#2b2e39
  • titleBar.activeForeground#d3dae3
  • titleBar.inactiveBackground#2b2e39
  • titleBar.inactiveForeground#9ba2ab

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#7f848eitalic
keyword, storage.type, storage.modifier#ffa833
keyword.control, keyword.operator.new, keyword.operator.expression#ffa833
string, string.quoted#c6ffa8
constant.numeric, constant.language#8fcaff
entity.name.function, support.function#ffc66d
meta.function-call, meta.function-call entity.name.function#ffc66d
entity.name.type, entity.name.class, support.class, support.type#e4b1ff
variable, support.variable, meta.definition.variable.name#a8ebff
variable.other.property, variable.other.member, variable.other.object.property#e4b2ff
variable.language, variable.parameter.function.language.special#ffa833
invalid, invalid.illegal#e06c75
punctuation.terminator, punctuation.separator#ff953f
Arc Dark Theme by WillCygan - VS Code Theme