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#000000
  • activityBar.border#00000000
  • activityBar.foreground#7D7D7D
  • activityBarBadge.background#383838
  • badge.background#383838
  • badge.foreground#C1C1C1
  • button.background#333
  • debugIcon.breakpointCurrentStackframeForeground#8aaac7
  • debugIcon.breakpointDisabledForeground#848484
  • debugIcon.breakpointForeground#c28a8d
  • debugIcon.breakpointStackframeForeground#8aaac7
  • debugIcon.breakpointUnverifiedForeground#848484
  • debugIcon.continueForeground#c28a8d
  • debugIcon.disconnectForeground#c28a8d
  • debugIcon.pauseForeground#c28a8d
  • debugIcon.restartForeground#8aaac7
  • debugIcon.startForeground#8aaac7
  • debugIcon.stepBackForeground#c28a8d
  • debugIcon.stepIntoForeground#c28a8d
  • debugIcon.stepOutForeground#c28a8d
  • debugIcon.stepOverForeground#c28a8d
  • debugIcon.stopForeground#8aaac7
  • diffEditor.insertedTextBackground#3a632a4b
  • diffEditor.removedTextBackground#88063852
  • dropdown.background#070707
  • dropdown.border#1e1e1e
  • editor.background#070707
  • editor.lineHighlightBackground#ffffff08
  • editor.lineHighlightBorder#00000000
  • editorGroup.border#00000000
  • editorGroupHeader.tabsBackground#000000
  • editorGroupHeader.tabsBorder#00000000
  • editorIndentGuide.activeBackground#383838
  • editorIndentGuide.background#2A2A2A
  • editorLineNumber.foreground#727272
  • editorRuler.foreground#2A2A2A
  • editorSuggestWidget.background#060606
  • editorSuggestWidget.border#1a1a1a
  • editorSuggestWidget.selectedBackground#161616
  • editorWidget.background#060606
  • editorWidget.border#1a1a1a
  • focusBorder#2a2a2a
  • foreground#888888
  • gitDecoration.ignoredResourceForeground#444444
  • input.background#070707
  • input.border#1e1e1e
  • input.foreground#E0E0E0
  • inputOption.activeBackground#3a3a3a
  • list.activeSelectionBackground#303030
  • list.activeSelectionForeground#F5F5F5
  • list.focusBackground#292929
  • list.highlightForeground#EAEAEA
  • list.hoverBackground#262626
  • list.hoverForeground#9E9E9E
  • list.inactiveSelectionBackground#212121
  • list.inactiveSelectionForeground#F5F5F5
  • minimap.background#070707
  • minimapSlider.activeBackground#ffffff10
  • minimapSlider.background#00000000
  • minimapSlider.hoverBackground#ffffff08
  • notifications.background#060606
  • notifications.border#1a1a1a
  • panel.background#070707
  • panel.border#00000000
  • panelTitle.activeBorder#0C0C0C
  • panelTitle.activeForeground#FAFAFA
  • panelTitle.inactiveForeground#484848
  • peekView.border#444
  • peekViewEditor.background#060606
  • pickerGroup.border#363636
  • pickerGroup.foreground#EAEAEA
  • progressBar.background#FAFAFA
  • quickInput.background#060606
  • quickInputList.focusBackground#161616
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#ffffff28
  • scrollbarSlider.background#ffffff08
  • scrollbarSlider.hoverBackground#ffffff18
  • sideBar.background#000000
  • sideBar.border#00000000
  • sideBar.foreground#7a7a7a
  • sideBarSectionHeader.background#000000
  • sideBarTitle.foreground#505050
  • statusBar.background#000000
  • statusBar.border#00000000
  • statusBar.debuggingBackground#000000
  • statusBar.foreground#7E7E7E
  • statusBar.noFolderBackground#000000
  • statusBarItem.prominentBackground#fafafa1a
  • statusBarItem.remoteBackground#07070700
  • statusBarItem.remoteForeground#7E7E7E
  • symbolIcon.classForeground#c49456
  • symbolIcon.constructorForeground#a89dd4
  • symbolIcon.enumeratorForeground#c49456
  • symbolIcon.enumeratorMemberForeground#8aaac7
  • symbolIcon.eventForeground#c49456
  • symbolIcon.fieldForeground#8aaac7
  • symbolIcon.functionForeground#a89dd4
  • symbolIcon.interfaceForeground#8aaac7
  • symbolIcon.methodForeground#a89dd4
  • symbolIcon.variableForeground#8aaac7
  • tab.activeBackground#070707
  • tab.activeBorder#00000000
  • tab.activeBorderTop#505050
  • tab.activeForeground#ebebeb
  • tab.border#00000000
  • tab.hoverBackground#070707
  • tab.inactiveBackground#000000
  • tab.inactiveForeground#383838
  • tab.unfocusedActiveBorderTop#2a2a2a
  • tab.unfocusedActiveForeground#888888
  • terminal.ansiBrightBlack#5c5c5c
  • textLink.activeForeground#fafafa
  • textLink.foreground#CCC
  • titleBar.activeBackground#000000
  • titleBar.border#00000000
  • titleBar.inactiveBackground#000000
  • widget.shadow#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#a89dd4
support.function, keyword.operator.accessor, meta.group.braces.round.function.arguments, meta.template.expression, markup.fenced_code meta.embedded.block#a89dd4
emphasisitalic
strong, markup.heading.markdown, markup.bold.markdown#c28a8dbold
markup.italic.markdownitalic
meta.link.inline.markdown#4a7eaaunderline
string, markup.fenced_code, markup.inline#8ea3b3
comment, string.quoted.docstring.multi#747b83
constant.language, variable.language.this, variable.other.object, variable.other.class, variable.other.constant, meta.property-name, support, string.other.link.title.markdown#8aaac7
constant.numeric, constant.other.placeholder, constant.character.format.placeholder, meta.property-value, keyword.other.unit, keyword.other.template, entity.name.tag.yaml, entity.other.attribute-name, support.type.property-name.json#c0c0c0
keyword, storage.modifier, storage.type, storage.control.clojure, entity.name.function.clojure, support.function.node, punctuation.separator.key-value, punctuation.definition.template-expression#c28a8f
variable.parameter.function#c49456
entity.name.type, entity.other.inherited-class, meta.function-call, meta.instance.constructor, entity.other.attribute-name, entity.name.function, constant.keyword.clojure#a89dd4
entity.name.tag, string.quoted, string.regexp, string.interpolated, string.template, string.unquoted.plain.out.yaml, keyword.other.template#c4a47e
token.info-token#5a82b0
token.warn-token#a88040
token.error-token#a85050
token.debug-token#7a5a7a
punctuation.definition.arguments, punctuation.definition.dict, punctuation.separator, meta.function-call.arguments#909090
markup.underline.link#c4a47e
beginning.punctuation.definition.list.markdown#c28a8d
punctuation.definition.metadata.markdown#c4a47e
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#8aaac7
Min Darker Oled by caduwinter - VS Code Theme