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#473828
  • activityBar.border#392D20
  • activityBar.foreground#F0E4CC
  • activityBar.inactiveForeground#9A8A70
  • activityBarBadge.background#A05A1E
  • activityBarBadge.foreground#F4ECD8
  • badge.background#A05A1E
  • badge.foreground#F4ECD8
  • breadcrumb.activeSelectionForeground#90511B
  • breadcrumb.background#F4ECD8
  • breadcrumb.focusForeground#A05A1E
  • breadcrumb.foreground#ABA597
  • button.background#90511B
  • button.foreground#FFFFFF
  • button.hoverBackground#A05A1E
  • button.secondaryBackground#E5D2B7
  • button.secondaryForeground#716453
  • button.secondaryHoverBackground#D7C5AC
  • contrastBorder#00000000
  • diffEditor.insertedLineBackground#6A7A1E15
  • diffEditor.insertedTextBackground#6A7A1E28
  • diffEditor.removedLineBackground#B0401E15
  • diffEditor.removedTextBackground#B0401E28
  • dropdown.background#F7F2E4
  • dropdown.border#CDC6B5
  • dropdown.foreground#544636
  • dropdown.listBackground#F7F2E4
  • editor.background#F4ECD8
  • editor.findMatchBackground#A05A1E55
  • editor.findMatchHighlightBackground#A05A1E28
  • editor.foreground#544636
  • editor.inactiveSelectionBackground#C8A86A30
  • editor.lineHighlightBackground#E8E0CD
  • editor.rangeHighlightBackground#C8A86A22
  • editor.selectionBackground#C8A86A70
  • editor.selectionHighlightBackground#C8A86A40
  • editor.wordHighlightBackground#C8A86A50
  • editor.wordHighlightStrongBackground#C8A86A66
  • editorBracketMatch.background#C8A86A38
  • editorBracketMatch.border#A05A1E
  • editorCodeLens.foreground#ABA597
  • editorCursor.background#F4ECD8
  • editorCursor.foreground#A05A1E
  • editorError.foreground#B0401E
  • editorGroupHeader.tabsBackground#473828
  • editorGroupHeader.tabsBorder#392D20
  • editorGutter.addedBackground#6A7A1E
  • editorGutter.background#EDE5D2
  • editorGutter.deletedBackground#B0401E
  • editorGutter.modifiedBackground#B05A1E
  • editorHint.foreground#A05A1E
  • editorHoverWidget.background#F7F2E4
  • editorHoverWidget.border#CDC6B5
  • editorHoverWidget.foreground#544636
  • editorIndentGuide.activeBackground1#B0AA9C
  • editorIndentGuide.background1#DCD4C2
  • editorInfo.foreground#3A6A98
  • editorLightBulb.foreground#B05A1E
  • editorLineNumber.activeForeground#A05A1E
  • editorLineNumber.foreground#ABA597
  • editorOverviewRuler.border#DCD4C2
  • editorOverviewRuler.errorForeground#B0401E
  • editorOverviewRuler.findMatchForeground#A05A1E
  • editorOverviewRuler.warningForeground#B05A1E
  • editorRuler.foreground#DCD4C2
  • editorSuggestWidget.background#F7F2E4
  • editorSuggestWidget.border#CDC6B5
  • editorSuggestWidget.foreground#544636
  • editorSuggestWidget.highlightForeground#A05A1E
  • editorSuggestWidget.selectedBackground#E5D2B7
  • editorWarning.foreground#B05A1E
  • editorWhitespace.foreground#D2CBBA
  • editorWidget.background#F7F2E4
  • editorWidget.border#CDC6B5
  • editorWidget.foreground#544636
  • focusBorder#A05A1E60
  • gitDecoration.addedResourceForeground#6A7A1E
  • gitDecoration.conflictingResourceForeground#B05A1E
  • gitDecoration.deletedResourceForeground#B0401E
  • gitDecoration.ignoredResourceForeground#ABA597
  • gitDecoration.modifiedResourceForeground#B05A1E
  • gitDecoration.untrackedResourceForeground#65741C
  • input.background#F7F2E4
  • input.border#CDC6B5
  • input.foreground#544636
  • input.placeholderForeground#ABA597
  • inputOption.activeBackground#E5D2B7
  • inputOption.activeBorder#A05A1E
  • inputOption.activeForeground#544636
  • inputValidation.errorBackground#B0401E15
  • inputValidation.errorBorder#B0401E
  • inputValidation.infoBackground#A05A1E18
  • inputValidation.infoBorder#A05A1E
  • inputValidation.warningBackground#B05A1E20
  • inputValidation.warningBorder#B05A1E
  • list.activeSelectionBackground#E5D2B7
  • list.activeSelectionForeground#544636
  • list.errorForeground#B0401E
  • list.focusBackground#E5D2B7
  • list.focusForeground#544636
  • list.highlightForeground#A05A1E
  • list.hoverBackground#F7F2E480
  • list.hoverForeground#544636
  • list.inactiveSelectionBackground#F7F2E4
  • list.inactiveSelectionForeground#716453
  • list.warningForeground#B05A1E
  • menu.background#E9E1CF
  • menu.foreground#544636
  • menu.selectionBackground#E5D2B7
  • menu.selectionForeground#544636
  • menu.separatorBackground#CDC6B5
  • menubar.selectionBackground#F7F2E4
  • menubar.selectionForeground#544636
  • notificationLink.foreground#A05A1E
  • notifications.background#F7F2E4
  • notifications.border#CDC6B5
  • notifications.foreground#544636
  • panel.background#EEE6D3
  • panel.border#392D20
  • panelTitle.activeBorder#A05A1E
  • panelTitle.activeForeground#A05A1E
  • panelTitle.inactiveForeground#9A8A70
  • pickerGroup.border#CDC6B5
  • pickerGroup.foreground#ABA597
  • quickInput.background#F7F2E4
  • quickInput.foreground#544636
  • quickInputHighlight.foreground#A05A1E
  • scrollbar.shadow#0000001A
  • scrollbarSlider.activeBackground#A05A1E50
  • scrollbarSlider.background#B7B1A250
  • scrollbarSlider.hoverBackground#9F998C70
  • settings.checkboxBackground#F7F2E4
  • settings.checkboxBorder#CDC6B5
  • settings.dropdownBackground#F7F2E4
  • settings.dropdownBorder#CDC6B5
  • settings.headerForeground#A05A1E
  • settings.modifiedItemIndicator#A05A1E
  • settings.numberInputBackground#F7F2E4
  • settings.numberInputBorder#CDC6B5
  • settings.textInputBackground#F7F2E4
  • settings.textInputBorder#CDC6B5
  • sideBar.background#EEE6D3
  • sideBar.border#392D20
  • sideBar.foreground#716453
  • sideBarSectionHeader.background#E9E1CF
  • sideBarSectionHeader.border#392D20
  • sideBarSectionHeader.foreground#716453
  • sideBarTitle.foreground#A05A1E
  • statusBar.background#8A5A20
  • statusBar.border#754C1B
  • statusBar.debuggingBackground#B0481C
  • statusBar.debuggingForeground#F4ECD8
  • statusBar.foreground#F8EEDC
  • statusBar.noFolderBackground#473828
  • statusBar.noFolderForeground#F8EEDC
  • statusBarItem.activeBackground#6E481A
  • statusBarItem.errorBackground#B0401E
  • statusBarItem.errorForeground#F4ECD8
  • statusBarItem.hoverBackground#754C1B
  • statusBarItem.remoteBackground#A05A1E
  • statusBarItem.remoteForeground#F4ECD8
  • statusBarItem.warningBackground#B05A1E
  • statusBarItem.warningForeground#F4ECD8
  • tab.activeBackground#F4ECD8
  • tab.activeBorder#A05A1E
  • tab.activeBorderTop#00000000
  • tab.activeForeground#544636
  • tab.border#392D20
  • tab.hoverBackground#E9E1CF
  • tab.hoverForeground#544636
  • tab.inactiveBackground#473828
  • tab.inactiveForeground#9A8A70
  • tab.unfocusedActiveBackground#EEE6D3
  • tab.unfocusedActiveForeground#948877
  • terminal.ansiBlack#6C5F4E
  • terminal.ansiBlue#3A6A98
  • terminal.ansiBrightBlack#8C806F
  • terminal.ansiBrightBlue#345F89
  • terminal.ansiBrightCyan#266E5C
  • terminal.ansiBrightGreen#5F6E1B
  • terminal.ansiBrightMagenta#7C4790
  • terminal.ansiBrightRed#9E3A1B
  • terminal.ansiBrightWhite#544636
  • terminal.ansiBrightYellow#7C5A16
  • terminal.ansiCyan#2A7A66
  • terminal.ansiGreen#6A7A1E
  • terminal.ansiMagenta#8A4FA0
  • terminal.ansiRed#B0401E
  • terminal.ansiWhite#7C705E
  • terminal.ansiYellow#8A6418
  • terminal.background#EEE6D3
  • terminal.foreground#544636
  • terminal.selectionBackground#C8A86A70
  • terminalCursor.foreground#A05A1E
  • titleBar.activeBackground#473828
  • titleBar.activeForeground#F0E4CC
  • titleBar.border#392D20
  • titleBar.inactiveBackground#EEE6D3
  • titleBar.inactiveForeground#9A8A70
  • widget.shadow#0000001A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source, text#544636
comment, punctuation.definition.comment, comment.block, comment.line#A09070italic
comment.block.documentation, comment.line.double-slash.documentation#908265italic
keyword, keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.import, keyword.control.export, keyword.control.return, keyword.control.trycatch, keyword.control.exception, keyword.other.using, keyword.other.import, keyword.operator.new, keyword.operator.delete, keyword.operator.typeof, keyword.operator.void, keyword.operator.instanceof, keyword.operator.in, keyword.operator.of#8A4FA0bold
storage.type, storage.modifier#8A4FA0bold
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, entity.name.enum#3A6A98bold
support.class, support.type, meta.type.annotation, meta.type.parameters, entity.other.inherited-class#3A6A98
keyword.type, support.type.primitive, storage.type.primitive, storage.type.numeric, storage.type.string, storage.type.boolean, storage.type.object, storage.type.void, storage.type.cs#3A6A98
entity.name.function, entity.name.method, entity.name.member#B05A1Ebold
meta.function-call entity.name.function, meta.method-call entity.name.function, support.function, support.function.builtin#B05A1E
variable.parameter#8B5228italic
variable, variable.other, variable.other.readwrite, variable.other.object, variable.other.object.property#544636
variable.language#8A4FA0italic
variable.other.property, variable.other.member, support.variable.property#35628C
string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.template, string.interpolated#6A7A1E
constant.character.escape, constant.character.entity#8A6418bold
punctuation.definition.template-expression, punctuation.section.embedded#B05A1Ebold
constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary#A0402A
constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, constant.language.none#A0402Abold
constant.other#8A6418
keyword.operator, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.bitwise, keyword.operator.ternary, keyword.operator.spread, keyword.operator.optional, keyword.operator.nullish, keyword.operator.arrow#8A7A60
punctuation, punctuation.separator, punctuation.terminator, punctuation.accessor, punctuation.definition.block, punctuation.definition.parameters, meta.brace, meta.delimiter#9D8F76
string.regexp, constant.other.character-class.regexp, constant.character.regexp, keyword.operator.quantifier.regexp, keyword.operator.or.regexp, punctuation.definition.group.regexp, punctuation.definition.character-class.regexp#2A7A66
meta.decorator, punctuation.decorator, entity.name.function.decorator, storage.type.annotation#8A6418italic
entity.name.type.attribute.cs, support.type.attribute#8A6418
entity.name.tag, entity.name.tag.xml, entity.name.tag.html, meta.tag.xml entity.name.tag#3A6A98bold
entity.other.attribute-name, entity.other.attribute-name.xml, entity.other.attribute-name.html#8A6418
string.quoted.double.html, string.quoted.single.html, string.quoted.double.xml, string.quoted.single.xml#6A7A1E
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end, meta.tag punctuation#8A7A60
string.unquoted.cdata.xml#6A7A1Eitalic
meta.tag.sgml.doctype, meta.tag.preprocessor.xml#A09070italic
entity.name.tag.namespace.xml#8A4FA0
entity.name.tag.css#3A6A98
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#8A4FA0
support.type.property-name.css, support.type.property-name.scss, support.type.property-name.less#8A6418
support.constant.property-value.css, meta.property-value.css#6A7A1E
keyword.other.unit.css#A0402A
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css#2A7A66
support.type.property-name.json#8A6418bold
string.quoted.double.json#6A7A1E
constant.numeric.json#A0402A
constant.language.json#A0402Abold
markup.heading, entity.name.section.markdown, punctuation.definition.heading.markdown#8A4FA0bold
markup.bold, punctuation.definition.bold.markdown#B05A1Ebold
markup.italic, punctuation.definition.italic.markdown#3A6A98italic
markup.inline.raw, markup.fenced_code.block#2A7A66
markup.underline.link, string.other.link#2A7A66underline
punctuation.definition.list.begin.markdown#B05A1E
markup.quote, punctuation.definition.quote.begin.markdown#A09070italic
invalid, invalid.illegal#F4ECD8
invalid.deprecated#A0402Astrikethrough
Lime Grove by Pipe Pipe Code - VS Code Theme