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#2A2A2A
  • activityBar.foreground#A0A0A0
  • activityBarBadge.background#505050
  • badge.background#505050
  • badge.foreground#D5D5D5
  • button.background#505050
  • debugIcon.breakpointCurrentStackframeForeground#90C0FF
  • debugIcon.breakpointDisabledForeground#A0A0A0
  • debugIcon.breakpointForeground#FF9090
  • debugIcon.breakpointStackframeForeground#90C0FF
  • debugIcon.breakpointUnverifiedForeground#A0A0A0
  • debugIcon.continueForeground#FF9090
  • debugIcon.disconnectForeground#FF9090
  • debugIcon.pauseForeground#FF9090
  • debugIcon.restartForeground#90C0FF
  • debugIcon.startForeground#90C0FF
  • debugIcon.stepBackForeground#FF9090
  • debugIcon.stepIntoForeground#FF9090
  • debugIcon.stepOutForeground#FF9090
  • debugIcon.stepOverForeground#FF9090
  • debugIcon.stopForeground#90C0FF
  • diffEditor.insertedTextBackground#4A7A3A80
  • diffEditor.removedTextBackground#A0404080
  • editor.background#1f1f1f
  • editor.foreground#E5E5E5
  • editor.lineHighlightBorder#404040
  • editorBracketHighlight.foreground1#D5D5D5
  • editorBracketHighlight.foreground2#B0B0B0
  • editorBracketHighlight.foreground3#808080
  • editorBracketHighlight.foreground4#00000000
  • editorBracketHighlight.foreground5#00000000
  • editorGroupHeader.tabsBackground#2A2A2A
  • editorGroupHeader.tabsBorder#2A2A2A
  • editorIndentGuide.activeBackground#505050
  • editorIndentGuide.background#404040
  • editorLineNumber.foreground#909090
  • editorRuler.foreground#404040
  • editorSuggestWidget.background#2A2A2A
  • editorWarning.foreground#FFD060
  • focusBorder#606060
  • foreground#B0B0B0
  • gitDecoration.ignoredResourceForeground#606060
  • input.background#404040
  • input.foreground#E5E5E5
  • inputOption.activeBackground#505050
  • list.activeSelectionBackground#383838
  • list.activeSelectionForeground#F0F0F0
  • list.focusBackground#404040
  • list.highlightForeground#E5E5E5
  • list.hoverBackground#383838
  • list.hoverForeground#C0C0C0
  • list.inactiveSelectionBackground#383838
  • list.inactiveSelectionForeground#F0F0F0
  • minimap.warningHighlight#FFD060
  • panelTitle.activeBorder#1f1f1f
  • panelTitle.activeForeground#F0F0F0
  • panelTitle.inactiveForeground#707070
  • peekView.border#606060
  • peekViewEditor.background#383838
  • pickerGroup.border#505050
  • pickerGroup.foreground#E5E5E5
  • progressBar.background#E5E5E5
  • scrollbar.shadow#1f1f1f
  • sideBar.background#2A2A2A
  • sideBarSectionHeader.background#353535
  • sideBarTitle.foreground#C0C0C0
  • statusBar.background#2A2A2A
  • statusBar.debuggingBackground#2A2A2A
  • statusBar.foreground#A0A0A0
  • statusBar.noFolderBackground#2A2A2A
  • statusBarItem.prominentBackground#505050
  • statusBarItem.remoteBackground#2A2A2A
  • statusBarItem.remoteForeground#A0A0A0
  • symbolIcon.classForeground#FFA040
  • symbolIcon.constructorForeground#C0A0F0
  • symbolIcon.enumeratorForeground#FFA040
  • symbolIcon.enumeratorMemberForeground#90C0FF
  • symbolIcon.eventForeground#FFA040
  • symbolIcon.fieldForeground#90C0FF
  • symbolIcon.functionForeground#C0A0F0
  • symbolIcon.interfaceForeground#90C0FF
  • symbolIcon.methodForeground#C0A0F0
  • symbolIcon.variableForeground#90C0FF
  • tab.activeBorder#1f1f1f
  • tab.activeForeground#F0F0F0
  • tab.border#2A2A2A
  • tab.inactiveBackground#2A2A2A
  • tab.inactiveForeground#909090
  • terminal.ansiBrightBlack#808080
  • textLink.activeForeground#F0F0F0
  • textLink.foreground#D0D0D0
  • titleBar.activeBackground#2A2A2A
  • titleBar.border#2A2A2A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#C0A0F0
support.function, keyword.operator.accessor, meta.group.braces.round.function.arguments, meta.template.expression, markup.fenced_code meta.embedded.block#C0A0F0
emphasisitalic
strong, markup.heading.markdown, markup.bold.markdown#FF9090bold
markup.italic.markdownitalic
meta.link.inline.markdown#4A9AE0underline
string, markup.fenced_code, markup.inline#60D0A0
comment, string.quoted.docstring.multi#808080italic
constant.language, variable.language.this, variable.other.object, variable.other.class, variable.other.constant, meta.property-name, support, string.other.link.title.markdown#A0C8F0
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#FFD060bold
keyword, storage.modifier, storage.type, storage.control.clojure, entity.name.function.clojure, support.function.node, punctuation.separator.key-value, punctuation.definition.template-expression#FF8090
variable.parameter.function#FFA040
entity.name.type, entity.other.inherited-class, meta.function-call, meta.instance.constructor, entity.other.attribute-name, entity.name.function, constant.keyword.clojure#FFD060
entity.name.tag, string.quoted, string.regexp, string.interpolated, string.template, string.unquoted.plain.out.yaml, keyword.other.template#60D0A0
token.info-token#5080D0
token.warn-token#D0A050
token.error-token#D05050
token.debug-token#A060A0
punctuation.definition.arguments, punctuation.definition.dict, punctuation.separator, meta.function-call.arguments#C0C0C0
markup.underline.link#FFB080
beginning.punctuation.definition.list.markdown#FF9090
punctuation.definition.metadata.markdown#FFB080
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#90C0FF
keyword.operator.new
entity.name.type.interface#FFD060
punctuation.definition.string#60D0A0
constant.character.escape#60D0A0
entity.name.function, support.function#70B0F0
meta.import
meta.type
meta.var
constant
variable#D0D0D0
meta.object.member, support.type.property-name#D0D0D0
variable.language#D5D5D5
meta.function
keyword.operator.assignment
storage.type
entity.name.type.enum
entity.name.type.class, support.class#70B0F0
punctuation.accessor#B0B0B0
punctuation.terminator#B0B0B0
punctuation.separator#B0B0B0
meta.interface
meta.function-call
variable.parameter#D0D0D0
meta.class
punctuation.definition.tag#808080
entity.other.attribute-nameitalic
Lego Min Theme by Lego Min Theme - VS Code Theme