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#151515
  • activityBar.foreground#7D7D7D
  • activityBarBadge.background#383838
  • badge.background#383838
  • badge.foreground#C1C1C1
  • button.background#333333
  • debugIcon.breakpointCurrentStackframeForeground#79b8ff
  • debugIcon.breakpointDisabledForeground#848484
  • debugIcon.breakpointForeground#FF7A84
  • debugIcon.breakpointStackframeForeground#79b8ff
  • debugIcon.breakpointUnverifiedForeground#848484
  • debugIcon.continueForeground#FF7A84
  • debugIcon.disconnectForeground#FF7A84
  • debugIcon.pauseForeground#FF7A84
  • debugIcon.restartForeground#79b8ff
  • debugIcon.startForeground#79b8ff
  • debugIcon.stepBackForeground#FF7A84
  • debugIcon.stepIntoForeground#FF7A84
  • debugIcon.stepOutForeground#FF7A84
  • debugIcon.stepOverForeground#FF7A84
  • debugIcon.stopForeground#79b8ff
  • diffEditor.insertedTextBackground#3a632a4b
  • diffEditor.removedTextBackground#88063852
  • editor.background#181818
  • editor.lineHighlightBorder#181818
  • editorBracketHighlight.foreground1#999999
  • editorBracketHighlight.foreground2#999999
  • editorBracketHighlight.foreground3#999999
  • editorGroupHeader.tabsBackground#151515
  • editorGroupHeader.tabsBorder#151515
  • editorIndentGuide.activeBackground#383838
  • editorIndentGuide.background#2A2A2A
  • editorLineNumber.activeForeground#999999
  • editorLineNumber.foreground#333333
  • editorRuler.foreground#2A2A2A
  • editorSuggestWidget.background#151515
  • focusBorder#444444
  • foreground#888888
  • gitDecoration.ignoredResourceForeground#444444
  • gitDecoration.modifiedResourceForeground#7dbc00
  • input.background#2A2A2A
  • input.foreground#E0E0E0
  • inputOption.activeBackground#3a3a3a
  • list.activeSelectionBackground#333333
  • list.activeSelectionForeground#F5F5F5
  • list.focusBackground#292929
  • list.highlightForeground#EAEAEA
  • list.hoverBackground#181818
  • list.hoverForeground#9E9E9E
  • list.inactiveSelectionBackground#333333
  • list.inactiveSelectionForeground#F5F5F5
  • panelTitle.activeBorder#181818
  • panelTitle.activeForeground#FAFAFA
  • panelTitle.inactiveForeground#484848
  • peekView.border#444444
  • peekViewEditor.background#242424
  • pickerGroup.border#363636
  • pickerGroup.foreground#EAEAEA
  • progressBar.background#FAFAFA
  • scrollbar.shadow#181818
  • sideBar.background#151515
  • sideBarSectionHeader.background#181818
  • statusBar.background#151515
  • statusBar.debuggingBackground#151515
  • statusBar.foreground#7E7E7E
  • statusBar.noFolderBackground#151515
  • statusBarItem.prominentBackground#fafafa1a
  • statusBarItem.remoteBackground#15151500
  • statusBarItem.remoteForeground#7E7E7E
  • symbolIcon.classForeground#FF9800
  • symbolIcon.constructorForeground#b392f0
  • symbolIcon.enumeratorForeground#FF9800
  • symbolIcon.enumeratorMemberForeground#79b8ff
  • symbolIcon.eventForeground#FF9800
  • symbolIcon.fieldForeground#79b8ff
  • symbolIcon.functionForeground#b392f0
  • symbolIcon.interfaceForeground#79b8ff
  • symbolIcon.methodForeground#b392f0
  • symbolIcon.variableForeground#79b8ff
  • tab.activeBorder#1e1e1e
  • tab.activeForeground#FAFAFA
  • tab.border#151515
  • tab.inactiveBackground#151515
  • tab.inactiveForeground#666666
  • terminal.ansiBrightBlack#5c5c5c
  • textLink.activeForeground#fafafa
  • textLink.foreground#CCC
  • titleBar.activeBackground#151515
  • titleBar.border#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#b392f0
support.function, keyword.operator.accessor, meta.group.braces.round.function.arguments, meta.template.expression, markup.fenced_code meta.embedded.block#b392f0
emphasisitalic
strong, markup.heading.markdown, markup.bold.markdown#FF7A84bold
markup.italic.markdownitalic
meta.link.inline.markdown#1976D2underline
string, markup.fenced_code, markup.inline#9db1c5
comment, string.quoted.docstring.multi#6b737c
constant.language, variable.language.this, variable.other.class, variable.other.constant, meta.property-name, support, string.other.link.title.markdown#79b8ff
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#f8f8f8
keyword, storage.modifier, storage.type, storage.control.clojure, entity.name.function.clojure, support.function.node, punctuation.definition.template-expression, entity.name.tag, keyword.other.template, markup.underline.link, punctuation.definition.metadata.markdown#a390ff
variable.parameter.function#FF9800
entity.name.type, entity.other.inherited-class, meta.function-call, meta.instance.constructor, entity.other.attribute-name, entity.name.function, constant.keyword.clojure#b392f0
string.quoted, string.regexp, string.interpolated, string.template, string.unquoted.plain.out.yaml#9fef00
token.info-token#316bcd
token.warn-token#cd9731
token.error-token#cd3131
token.debug-token#800080
punctuation.definition.arguments, punctuation.definition.dict, punctuation.separator, meta.function-call.arguments#999999
beginning.punctuation.definition.list.markdown#FF7A84
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#79b8ff
keyword.operator.assignment, keyword.operator.type.annotation, variable.other.constant, variable.other.readwrite, variable.other.object#eeeeee
entity.name.function#ffd700
entity.name.function, entity.other.attribute-name#88bbff
storage.type.function.arrow#eeeeee
punctuation.definition.comment.begin, comment.block#666666
Carlos Alberto Theme by Carlos Alberto da Silva - VS Code Theme