Skip to main content
Coding Theme

Color themes

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#f0e8d9
  • activityBar.border#00000000
  • activityBar.foreground#585040
  • activityBar.inactiveForeground#9a8f7d
  • activityBarBadge.background#70553a
  • activityBarBadge.foreground#fcf5e6
  • button.background#70553a
  • button.foreground#fcf5e6
  • dropdown.background#ede4d2
  • dropdown.listBackground#ede4d2
  • editor.background#fcf5e6
  • editor.foreground#585040
  • editor.lineHighlightBackground#f0e8d9
  • editor.selectionBackground#e4d8bA
  • editor.wordHighlightBackground#e4d8ba85
  • editor.wordHighlightBorder#e4d8ba
  • editor.wordHighlightStrongBackground#e4d8ba75
  • editor.wordHighlightStrongBorder#e4d8ba
  • editorBracketHighlight.foreground1#585040
  • editorBracketHighlight.foreground2#585040
  • editorBracketHighlight.foreground3#585040
  • editorBracketHighlight.foreground4#585040
  • editorBracketHighlight.foreground5#585040
  • editorBracketHighlight.foreground6#585040
  • editorCursor.foreground#585040
  • editorGroup.border#9a8f7d40
  • editorGroupHeader.tabsBackground#f0e8d9
  • editorHoverWidget.background#ede4d2
  • editorIndentGuide.activeBackground1#58504080
  • editorIndentGuide.background1#9a8f7d33
  • editorLineNumber.activeForeground#585040
  • editorLineNumber.foreground#9a8f7d
  • editorLink.activeForeground#855a35
  • editorSuggestWidget.background#ede4d2
  • editorSuggestWidget.selectedBackground#e4d8bA
  • editorWhitespace.foreground#9a8f7d
  • editorWidget.background#ede4d2
  • editorWidget.border#9a8f7d
  • errorForeground#c48484
  • focusBorder#9a8f7d60
  • foreground#585040
  • input.background#f0e8d9
  • input.border#9a8f7d40
  • input.foreground#585040
  • input.placeholderForeground#9a8f7d
  • list.activeSelectionBackground#e4d8bA
  • list.activeSelectionForeground#585040
  • list.focusBackground#e4d8bA
  • list.highlightForeground#70553a
  • list.hoverBackground#f0e8d9
  • list.inactiveSelectionBackground#e4d8bA80
  • panel.background#f0e8d9
  • panel.border#00000000
  • panelTitle.activeBorder#70553a
  • panelTitle.activeForeground#585040
  • panelTitle.inactiveForeground#9a8f7d
  • peekView.border#9a8f7d
  • peekViewEditor.background#fcf5e6
  • peekViewEditor.matchHighlightBackground#e4d8ba
  • peekViewEditorGutter.background#fcf5e6
  • peekViewResult.background#ede4d2
  • peekViewResult.matchHighlightBackground#e4d8ba
  • peekViewResult.selectionBackground#e4d8bA
  • peekViewResult.selectionForeground#585040
  • peekViewTitle.background#f0e8d9
  • peekViewTitleDescription.foreground#70553a
  • peekViewTitleLabel.foreground#585040
  • quickInput.background#ede4d2
  • scrollbar.shadow#00000000
  • scrollbarSlider.activeBackground#9a8f7d
  • scrollbarSlider.background#e4d8bA
  • scrollbarSlider.hoverBackground#9a8f7d
  • selection.background#e4d8bA
  • sideBar.background#f0e8d9
  • sideBar.border#00000000
  • sideBar.foreground#585040
  • sideBarSectionHeader.background#f0e8d9
  • statusBar.background#585040
  • statusBar.border#00000000
  • statusBar.debuggingBackground#70553a
  • statusBar.debuggingForeground#fcf5e6
  • statusBar.foreground#fcf5e6
  • statusBar.noFolderBackground#585040
  • tab.activeBackground#fcf5e6
  • tab.activeBorderTop#00000000
  • tab.activeForeground#585040
  • tab.border#00000000
  • tab.inactiveBackground#f0e8d9
  • tab.inactiveForeground#9a8f7d
  • tab.unfocusedActiveBorderTop#00000000
  • textLink.activeForeground#585040
  • textLink.foreground#855a35
  • titleBar.activeBackground#f0e8d9
  • titleBar.activeForeground#585040
  • titleBar.border#00000000
  • titleBar.inactiveBackground#f0e8d9
  • titleBar.inactiveForeground#9a8f7d
  • widget.shadow#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9a8f7ditalic
punctuation#585040—
keyword, storage.type, storage.modifier#70553abold
entity.name.function, support.function, entity.name.class, entity.name.type, support.type, support.class#5e6a75—
string, constant.numeric, constant.language, constant.character, constant.other#72785b—
variable.parameter—italic
entity.name.tag#70553a—
entity.other.attribute-name#5e6a75—
invalid#c48484—
Old Book by Konstantin Gorodinskiy - VS Code Theme