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#e4dfd8
  • activityBar.border#d0c8bd
  • activityBar.foreground#3a342e
  • activityBar.inactiveForeground#9a8f82
  • activityBarBadge.background#2f7a7a
  • activityBarBadge.foreground#ffffff
  • badge.background#2f7a7a
  • badge.foreground#ffffff
  • breadcrumb.background#e4dfd8
  • breadcrumb.focusForeground#c07030
  • breadcrumb.foreground#4a443e
  • button.background#2f7a7a
  • button.foreground#ffffff
  • button.hoverBackground#3f8a8a
  • checkbox.background#ebe7e2
  • checkbox.border#d0c8bd
  • checkbox.foreground#3a342e
  • dropdown.background#ebe7e2
  • dropdown.border#d0c8bd
  • dropdown.foreground#3a342e
  • editor.background#f4f1ec
  • editor.findMatchBackground#d8d0b8
  • editor.findMatchHighlightBackground#d8c8b8
  • editor.foreground#3a342e
  • editor.inactiveSelectionBackground#e0d9d0
  • editor.lineHighlightBackground#e9e4dd
  • editor.lineHighlightBorder#d0c8bd
  • editor.selectionBackground#d8d2c8
  • editorBracketMatch.background#e0d9d0
  • editorBracketMatch.border#2f7a7a
  • editorCursor.foreground#a07030
  • editorHoverWidget.background#e4dfd8
  • editorHoverWidget.border#2f7a7a
  • editorHoverWidget.foreground#3a342e
  • editorIndentGuide.activeBackground#b8b0a5
  • editorIndentGuide.background#d8d2c8
  • editorLineNumber.activeForeground#6b5f52
  • editorLineNumber.foreground#b0a79c
  • editorSuggestWidget.background#ebe7e2
  • editorSuggestWidget.border#d0c8bd
  • editorSuggestWidget.foreground#3a342e
  • editorSuggestWidget.highlightForeground#c07030
  • editorSuggestWidget.selectedBackground#d8d2c8
  • editorWhitespace.foreground#d8d2c8
  • editorWidget.background#ebe7e2
  • editorWidget.border#d0c8bd
  • editorWidget.foreground#3a342e
  • focusBorder#2f7a7a80
  • foreground#3a342e
  • gitDecoration.addedResourceForeground#3c8a5a
  • gitDecoration.conflictingResourceForeground#8a5fc4
  • gitDecoration.deletedResourceForeground#d05050
  • gitDecoration.ignoredResourceForeground#8a7f72
  • gitDecoration.modifiedResourceForeground#c07030
  • gitDecoration.stageDeletedResourceForeground#d05050
  • gitDecoration.stageModifiedResourceForeground#c07030
  • gitDecoration.submoduleResourceForeground#2f7a7a
  • gitDecoration.untrackedResourceForeground#3a6fd0
  • input.background#ebe7e2
  • input.border#d0c8bd
  • input.foreground#3a342e
  • input.placeholderForeground#8a7f72
  • inputOption.activeBackground#2f7a7a40
  • inputOption.activeForeground#c07030
  • list.activeSelectionBackground#d2ddd9
  • list.activeSelectionForeground#c07030
  • list.focusBackground#d2ddd9
  • list.focusForeground#c07030
  • list.hoverBackground#e9e4dd
  • list.inactiveSelectionBackground#e6e0d6
  • menu.background#ebe7e2
  • menu.border#d0c8bd
  • menu.foreground#3a342e
  • menu.selectionBackground#d8d2c8
  • menu.selectionForeground#c07030
  • menubar.selectionBackground#d8d2c8
  • menubar.selectionForeground#c07030
  • panel.background#f4f1ec
  • panel.border#d0c8bd
  • panelTitle.activeBorder#2f7a7a
  • panelTitle.activeForeground#3a342e
  • panelTitle.inactiveForeground#8a7f72
  • progressBar.background#2f7a7a
  • scrollbarSlider.activeBackground#2f7a7a
  • scrollbarSlider.background#c8c0b5
  • scrollbarSlider.hoverBackground#b8b0a5
  • selection.background#d8d2c8
  • sideBar.background#ebe7e2
  • sideBar.border#d0c8bd
  • sideBar.foreground#4a443e
  • sideBarSectionHeader.background#e4dfd8
  • sideBarSectionHeader.border#d0c8bd
  • sideBarSectionHeader.foreground#3a342e
  • sideBarTitle.foreground#3a342e
  • statusBar.background#ded8cf
  • statusBar.border#d0c8bd
  • statusBar.debuggingBackground#5a6a6a
  • statusBar.foreground#4a443e
  • statusBar.noFolderBackground#6a5a5a
  • statusBarItem.remoteBackground#2f7a7a
  • tab.activeBackground#f4f1ec
  • tab.activeBorder#2f7a7a
  • tab.activeBorderTop#c07030
  • tab.activeForeground#c07030
  • tab.border#d0c8bd
  • tab.hoverBackground#e9e4dd
  • tab.hoverForeground#3a342e
  • tab.inactiveBackground#ebe7e2
  • tab.inactiveForeground#8a7f72
  • terminal.ansiBlack#3a342e
  • terminal.ansiBlue#3a6fd0
  • terminal.ansiBrightBlack#8a7f72
  • terminal.ansiBrightBlue#5a80d0
  • terminal.ansiBrightCyan#3f8a8a
  • terminal.ansiBrightGreen#5a9a6a
  • terminal.ansiBrightMagenta#a070d0
  • terminal.ansiBrightRed#d87070
  • terminal.ansiBrightWhite#5a5248
  • terminal.ansiBrightYellow#d08040
  • terminal.ansiCyan#2f7a7a
  • terminal.ansiGreen#3c8a5a
  • terminal.ansiMagenta#8a5fc4
  • terminal.ansiRed#d05050
  • terminal.ansiWhite#6b5f52
  • terminal.ansiYellow#c07030
  • terminal.background#f4f1ec
  • terminal.foreground#3a342e
  • terminal.selectionBackground#d8d2c8
  • terminalCursor.foreground#a07030
  • titleBar.activeBackground#e4dfd8
  • titleBar.activeForeground#3a342e
  • titleBar.border#d0c8bd
  • titleBar.inactiveBackground#ebe7e2
  • titleBar.inactiveForeground#8a7f72
  • widget.shadow#00000020

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6f9a85italic
string, string.template, string.quoted#c07030
punctuation.definition.string.begin, punctuation.definition.string.end#a86028
punctuation.definition.string.template.begin, punctuation.definition.string.template.end#c07030
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#2f7a7a
constant.other.placeholder, string.quoted.other.placeholder#8a5fc4
constant.character.escape, constant.character.escape.sequence#d05070
constant.numeric, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal, constant.numeric.float#7a4fb0
constant.language, support.constant, variable.other.constant, constant.character#7a4fb0
punctuation.definition.directive, punctuation.definition.preprocessor, keyword.control.directive.pound#a05040
keyword.control.directive, keyword.control.preprocessor, meta.preprocessor#b06030bold
entity.name.function.preprocessor, meta.preprocessor.macro, variable.other.preprocessor, entity.name.constant.preprocessor#b06030bold
string.quoted.other.lt-gt.include, string.quoted.double.include, string.quoted.include#a86028
constant.other.color.rgb-value, punctuation.definition.constant.color#d05070
keyword.control, keyword.other, storage.modifier#2f7a7a
storage.type, storage.type.class, storage.type.struct, storage.type.enum, storage.type.typedef, storage.type.union#2f8a6a
entity.name.type, entity.name.type.class, entity.name.type.struct, entity.name.type.enum, entity.name.type.union, support.type#2f8a6a
support.type.primitive, storage.type.primitive, storage.type.builtin, storage.type.basic#3c8a5aitalic
storage.modifier, storage.type.qualifier#2f7a7a
keyword.operator.pointer, keyword.operator.reference, storage.modifier.pointer, punctuation.definition.pointer#a07030bold
keyword.operator.dereference#a07030bold
keyword.operator.address-of#a07030bold
keyword.operator.new, keyword.operator.delete, keyword.operator.expression.instanceof, keyword.operator.expression.typeof#2f7a7a
entity.name.function, support.function, meta.function-call, meta.function#3a6fd0
variable.parameter, variable.parameter.function, meta.parameter#6b5f52
entity.name.class, support.class, entity.other.inherited-class, entity.name.type.class#d05050
variable, variable.other.readwrite, variable.other#6b5f52
meta.object-literal.key, variable.object.property, support.variable.property#6b5f52
variable.language, variable.parameter.function.language.special, variable.language.this, variable.language.super#d05050italic
keyword.operator, punctuation.separator.key-value#8a7f72
keyword.operator.logical, keyword.operator.comparison, keyword.operator.relational#8a7f72
keyword.operator.arithmetic#8a7f72
keyword.operator.assignment, keyword.operator.assignment.compound#8a7f72
punctuation.definition.arguments, punctuation.definition.parameters, punctuation.separator.delimiter, punctuation.terminator, punctuation.section.block, punctuation.curlybrace, punctuation.roundbrace, punctuation.squarebrace, punctuation.separator, meta.brace#9a9084
entity.name.tag, meta.tag, punctuation.definition.tag#6b5f52
entity.other.attribute-name, meta.attribute#7a6a5a
entity.other.attribute-name.id#3a6fd0
support.type.property-name, meta.property-name#6b5f52
support.constant.property-value, support.constant.color#c07030
keyword.other.unit#7a4fb0
entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element#2f8a6a
entity.name.lifetime, storage.modifier.lifetime#8a5fc4
entity.name.function.macro, meta.macro.rules#b06030bold
meta.attribute.rust, punctuation.brackets.attribute#7a4fb0
storage.type.haskell, entity.name.type.haskell#2f8a6a
entity.name.function.haskell#3a6fd0
keyword.control.directive.asm, storage.modifier.asm#b06030bold
keyword.operator.mnemonic, support.function.asm#2f7a7a
variable.language.register, support.constant.register#7a4fb0
entity.name.label, entity.name.function.label#d05050
keyword.control.zig, storage.modifier.zig#2f7a7a
support.function.builtin.zig#3a6fd0
entity.name.type.error.zig#d05050
keyword.control.nim, storage.type.nim#2f7a7a
meta.pragma.nim, keyword.other.pragma.nim#7a4fb0
storage.type.nim, entity.name.type.nim#2f8a6a
markup.heading, entity.name.section#d05050bold
markup.underline.link, string.other.link#3a6fd0
markup.bold#6b5f52bold
markup.italic#6b5f52italic
markup.raw, markup.inline.raw#c07030
markup.quote#6f9a85italic
punctuation.definition.list#b06030
markup.inserted.diff, meta.diff.header.to-file#3c8a5a
markup.deleted.diff, meta.diff.header.from-file#d05050
markup.changed.diff#c07030
Goliath Theme by sibunut - VS Code Theme