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#0a0a0a
  • activityBar.border#191919
  • activityBar.dropBackground#6666667f
  • activityBar.foreground#4c4c4c
  • activityBarBadge.background#f5f5f5
  • activityBarBadge.foreground#000000
  • button.background#f5f5f5
  • button.foreground#0a0a0a
  • button.hoverBackground#ffffff
  • diffEditor.insertedTextBackground#00290e36
  • diffEditor.removedTextBackground#33010136
  • editor.background#0a0a0a
  • editor.findMatchBackground#9999997f
  • editor.findMatchBorder#4c4c4c
  • editor.findMatchHighlightBackground#4c4c4c7f
  • editor.findMatchHighlightBorder#ffffff00
  • editor.findRangeHighlightBackground#4c4c4c7f
  • editor.findRangeHighlightBorder#ffffff00
  • editor.foreground#ffffff
  • editor.hoverHighlightBackground#3333337f
  • editor.inactiveSelectionBackground#4c4c4c7f
  • editor.lineHighlightBackground#33333325
  • editor.lineHighlightBorder#ffffff00
  • editor.rangeHighlightBackground#3333337f
  • editor.rangeHighlightBorder#ffffff00
  • editor.selectionBackground#333333
  • editor.selectionForeground#ffffff
  • editor.selectionHighlightBackground#4c4c4c7f
  • editor.selectionHighlightBorder#ffffff00
  • editor.wordHighlightBackground#3333337f
  • editor.wordHighlightBorder#ffffff00
  • editor.wordHighlightStrongBackground#4c4c4c7f
  • editor.wordHighlightStrongBorder#4c4c4c
  • editorBracketMatch.background#fc02bd2f
  • editorBracketMatch.border#ffffff4b
  • editorCodeLens.foreground#333333
  • editorCursor.background#000000
  • editorCursor.foreground#ffffff
  • editorError.foreground#ff0000ab
  • editorGroup.border#191919
  • editorGroup.dropBackground#4c4c4c7f
  • editorGroup.emptyBackground#0a0a0a
  • editorGroup.focusedEmptyBorder#191919
  • editorGroupHeader.noTabsBackground#0a0a0a
  • editorGroupHeader.tabsBackground#0a0a0a
  • editorGroupHeader.tabsBorder#191919
  • editorGutter.addedBackground#ffffff
  • editorGutter.deletedBackground#ffffff
  • editorGutter.modifiedBackground#ffffff
  • editorHint.foreground#00ffaaab
  • editorIndentGuide.activeBackground#333333
  • editorIndentGuide.background#191919
  • editorInfo.foreground#00ff00ab
  • editorLineNumber.activeForeground#f5f5f5
  • editorLineNumber.foreground#333333
  • editorLink.activeForeground#ffffff
  • editorOverviewRuler.border#000000
  • editorRuler.foreground#333333
  • editorWarning.foreground#ffaa0055
  • editorWhitespace.foreground#333333
  • focusBorder#191919
  • foreground#ffffff
  • gitDecoration.addedResourceForeground#b2b2b2
  • gitDecoration.conflictingResourceForeground#e5e5e5
  • gitDecoration.deletedResourceForeground#666666
  • gitDecoration.ignoredResourceForeground#4c4c4c
  • gitDecoration.modifiedResourceForeground#b2b2b2
  • gitDecoration.submoduleResourceForeground#b2b2b2
  • gitDecoration.untrackedResourceForeground#4c4c4c
  • list.activeSelectionBackground#191919
  • list.activeSelectionForeground#ffffff
  • list.dropBackground#191919
  • list.focusBackground#191919
  • list.focusForeground#ffffff
  • list.hoverBackground#191919
  • list.hoverForeground#ffffff
  • list.inactiveFocusBackground#191919
  • list.inactiveSelectionBackground#191919
  • list.inactiveSelectionForeground#ffffff
  • menu.selectionBackground#333333
  • menu.selectionForeground#ffffff
  • menubar.selectionBackground#333333
  • menubar.selectionForeground#ffffff
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#ff00002d
  • scrollbarSlider.background#c0bebe48
  • scrollbarSlider.hoverBackground#ff00002d
  • settings.checkboxBackground#0a0a0a
  • settings.checkboxBorder#ffffff00
  • settings.checkboxForeground#ffffff
  • settings.dropdownBackground#333333
  • settings.dropdownBorder#ffffff00
  • settings.dropdownForeground#ffffff
  • settings.dropdownListBorder#ffffff00
  • settings.headerForeground#ffffff
  • settings.modifiedItemIndicator#ffffff
  • settings.numberInputBackground#0a0a0a
  • settings.numberInputBorder#ffffff00
  • settings.numberInputForeground#ffffff
  • settings.textInputBackground#0a0a0a
  • settings.textInputBorder#ffffff00
  • settings.textInputForeground#ffffff
  • sideBar.background#0a0a0a
  • sideBar.border#000000
  • sideBar.dropBackground#6666667f
  • sideBar.foreground#b2b2b2
  • sideBarSectionHeader.background#333333
  • sideBarSectionHeader.foreground#f5f5f5
  • sideBarTitle.foreground#cccccc
  • statusBar.background#000000
  • statusBar.border#191919
  • statusBar.debuggingBackground#f5f5f5
  • statusBar.debuggingBorder#191919
  • statusBar.debuggingForeground#000000
  • statusBar.foreground#ffffff
  • statusBar.noFolderBackground#000000
  • statusBar.noFolderBorder#191919
  • statusBar.noFolderForeground#f5f5f5
  • statusBarItem.activeBackground#ffffff
  • statusBarItem.hoverBackground#ffffff52
  • statusBarItem.prominentBackground#999999
  • statusBarItem.prominentHoverBackground#7f7f7f
  • tab.activeBackground#58585860
  • tab.activeBorder#0a0a0a
  • tab.activeBorderTop#0a0a0a
  • tab.activeForeground#ffffff
  • tab.border#0a0a0a
  • tab.hoverBackground#0a0a0a
  • tab.hoverBorder#333333
  • tab.inactiveBackground#0a0a0a
  • tab.inactiveForeground#cacaca
  • tab.unfocusedActiveBorder#0a0a0a
  • tab.unfocusedActiveBorderTop#0a0a0a
  • tab.unfocusedActiveForeground#7f7f7f
  • tab.unfocusedHoverBackground#000000
  • tab.unfocusedHoverBorder#0a0a0a
  • tab.unfocusedInactiveForeground#4c4c4c
  • terminal.background#0a0a0a
  • terminal.foreground#ffffff
  • titleBar.activeBackground#0a0a0a
  • titleBar.activeForeground#ffffff
  • titleBar.border#0a0a0a
  • titleBar.inactiveBackground#0a0a0a
  • titleBar.inactiveForeground#999999

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
emphasisitalic
strongbold
comment.block.documentation, comment.block, comment.line, comment#4c4c4citalic bold
entity.name.class, entity.name.enum, entity.name.interface, entity.name.section, entity.name.struct, entity.name.tag, entity.name.trait, entity.name.type, entity.name.union, entity.other#ffffff88bold
keyword.control.conditional, keyword.control.import, keyword.controlitalic bold
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6
comment.block.documentation, comment.block, comment.line, comment, meta.toc-list, punctuation.definition.comment, string.quoted.docstring#4c4c4citalic
entity.name.class, entity.name.enum, entity.name.interface, entity.name.section, entity.name.struct, entity.name.tag, entity.name.trait, entity.name.type, entity.name.union, entity.other#ffffffbold
keyword.control.conditional, keyword.control.import, keyword.control, keyword.function.go, keyword.import.go, keyword.package.go, keyword.var.gobold italic
markup.italicitalic
markup.inline.raw#cccccc
markup.underline#4c4c4c
meta.link, meta.paragraph, punctuation.definition#7f7f7f
punctuation.definition.string.begin, punctuation.definition.string.end, string.quoted.double, string.quoted.other, string.quoted.single, string.quoted.triple, string.regexp, string.unquoted#fcf5acb9
support.type.property-name.css, support.type.vendored.property-name.css#999999
storage.modifier, storage.type#ffffffbold italic
source.diff meta.diff.range.context#8FBCBB
token.debug-token#b48ead
token.error-token#bf616a7e
token.info-token#88c0d0
token.warn-token#ebcb8b
source.diff meta.diff.header.from-file#8FBCBB
source.diff punctuation.definition.from-file#8FBCBB
source.diff punctuation.definition.range#8FBCBB
source.diff punctuation.definition.separator#81A1C1
constant.numeric.integer.decimal.rust, constant.numeric.float.rust, constant.numeric.integer.hexadecimal.rust, constant.numeric.integer.octal.rust, constant.numeric.integer.binary.rust#4da4c783
support.function.log.rust, support.function.builtin.rust#ad6666c7
source.rust#ffffffb4
entity.name.function.rust#ffffff
support.constant.core.rust#e8f7959a
storage.type.rust#4c618b
storage.type.core.rust#b8b18dbe
storage.class.std.rust#947b93
storage.modifier.const.rust#95f7d9
storage.modifier.mut.rust#d4a2a2
variable.language.rust#b2c09f
keyword.control.rust#a9ccc1
support.function.core.rust#abbbcf
keyword.other.rust#424d4d
keyword.other.where.rust#ff6e6ec0
keyword.important.rust#7ebebe
keyword.operator.bracket.rust#5f8db8
keyword.operator.misc.rust#6161615e
keyword.operator.comparison.rust#5d7cbb
keyword.operator.sigil.rust#008f6ditalic
keyword.operator.assignment.rust#666585
keyword.operator.arithmetic.rust#645ff1b6
support.function.std.rust#ddaaaaaabold
entity.name.function.macro.rust#ddaaaaaabold
meta.type_params.rust#e9defdc7
meta.attribute.rust#b97777italic
keyword.other.fn.rust#374768italic
support.type.core.rust#a0fcff
entity.name.type.rust#b8b18d
storage.modifier.visibility.rust#2b3752
string.quoted.double.rust, string.quoted.single.rust, string.quoted.double.raw.rust#fcf5acb9italic
constant.language.boolean.rust#707780
keyword.orlsperator.comparison.rust#7968db
museun by museun - VS Code Theme