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.activeBorder#ffedc6
  • activityBar.background#140f0a
  • activityBar.foreground#6e5a48
  • activityBar.inactiveForeground#6e5a48
  • activityBarBadge.background#00bfff
  • activityBarBadge.foreground#140f0a
  • badge.background#00bfff
  • badge.foreground#140f0a
  • breadcrumb.activeSelectionForeground#ffedc6
  • breadcrumb.focusForeground#ffedc6
  • breadcrumb.foreground#e6d4a8
  • breadcrumbPicker.background#241d18
  • button.background#00bfff
  • button.foreground#140f0a
  • button.hoverBackground#00ace6
  • descriptionForeground#e6d4a8
  • diffEditor.insertedLineBackground#26de8120
  • diffEditor.insertedTextBackground#26de8120
  • diffEditor.removedLineBackground#ff475720
  • diffEditor.removedTextBackground#ff475720
  • dropdown.background#241d18
  • dropdown.border#524438
  • dropdown.foreground#ffedc6
  • editor.background#140f0a
  • editor.findMatchBackground#26de8130
  • editor.findMatchHighlightBackground#ffa50250
  • editor.findRangeHighlightBackground#ff6b3530
  • editor.foreground#ffedc6
  • editor.lineHighlightBackground#241d18
  • editor.lineHighlightBorder#00000001
  • editor.selectionBackground#382d26
  • editor.selectionHighlightBackground#382d2680
  • editor.wordHighlightBackground#00bfff60
  • editor.wordHighlightStrongBackground#00bfff60
  • editorBracketHighlight.foreground1#ffb347
  • editorBracketHighlight.foreground2#9b59b6
  • editorBracketHighlight.foreground3#ff6b35
  • editorBracketHighlight.foreground4#00bfff
  • editorBracketHighlight.foreground5#ff9500
  • editorBracketHighlight.foreground6#ffd700
  • editorBracketHighlight.unexpectedBracket.foreground#ff4757
  • editorBracketMatch.background#42362d40
  • editorBracketMatch.border#a0896880
  • editorCursor.foreground#ffedc6
  • editorError.foreground#ff4757
  • editorGroupHeader.tabsBackground#140f0a
  • editorGutter.addedBackground#26de81
  • editorGutter.deletedBackground#ff4757
  • editorGutter.modifiedBackground#ffa502
  • editorHoverWidget.background#241d18
  • editorHoverWidget.border#524438
  • editorHoverWidget.foreground#ffedc6
  • editorInfo.foreground#00bfff
  • editorLineNumber.activeForeground#ffedc6
  • editorLineNumber.foreground#6e5a48
  • editorOverviewRuler.errorForeground#ff4757
  • editorOverviewRuler.infoForeground#00bfff
  • editorOverviewRuler.warningForeground#ffa502
  • editorRuler.foreground#524438
  • editorSuggestWidget.background#241d18
  • editorSuggestWidget.border#524438
  • editorSuggestWidget.selectedBackground#42362d
  • editorWarning.foreground#ffa502
  • editorWhitespace.foreground#524438
  • editorWidget.background#241d18
  • editorWidget.border#524438
  • focusBorder#00bfff60
  • gitDecoration.addedResourceForeground#26de81
  • gitDecoration.conflictingResourceForeground#00bfff
  • gitDecoration.deletedResourceForeground#ff4757
  • gitDecoration.ignoredResourceForeground#7a6548
  • gitDecoration.modifiedResourceForeground#ffa502
  • gitDecoration.untrackedResourceForeground#a08968
  • input.background#241d18
  • input.border#524438
  • input.foreground#ffedc6
  • input.placeholderForeground#a08968
  • inputOption.activeBorder#00bfff
  • inputOption.activeForeground#ffedc6
  • list.activeSelectionBackground#241d18
  • list.activeSelectionForeground#ffedc6
  • list.errorForeground#ff4757
  • list.highlightForeground#00bfff
  • list.hoverBackground#2e251f
  • list.inactiveSelectionBackground#2e251f
  • list.warningForeground#ffa502
  • notificationsErrorIcon.foreground#ff4757
  • notificationsInfoIcon.foreground#00bfff
  • notificationsWarningIcon.foreground#ffa502
  • panel.background#140f0a
  • panel.border#00000000
  • panelTitle.activeForeground#ffedc6
  • panelTitle.inactiveForeground#e6d4a8
  • peekView.border#00bfff
  • peekViewEditor.background#1c1611
  • peekViewResult.background#140f0a
  • peekViewTitle.background#1c1611
  • peekViewTitleDescription.foreground#e6d4a8
  • pickerGroup.foreground#ffedc6
  • problemsErrorIcon.foreground#ff4757
  • problemsInfoIcon.foreground#00bfff
  • problemsWarningIcon.foreground#ffa502
  • quickInput.background#241d18
  • quickInput.foreground#ffedc6
  • quickInputList.focusBackground#42362d
  • quickInputList.focusForeground#ffedc6
  • scrollbar.shadow#00bfff30
  • scrollbarSlider.activeBackground#2e251f30
  • scrollbarSlider.background#42362d40
  • scrollbarSlider.hoverBackground#52443860
  • selection.background#382d26
  • settings.headerForeground#ffedc6
  • settings.modifiedItemIndicator#00bfff
  • sideBar.background#140f0a
  • sideBar.border#52443850
  • sideBar.foreground#ffedc6
  • sideBarSectionHeader.background#140f0a
  • sideBarSectionHeader.foreground#ffedc6
  • sideBarTitle.foreground#ffedc6
  • statusBar.background#1c1611
  • statusBar.debuggingBackground#241d18
  • statusBar.debuggingForeground#ffedc6
  • statusBar.foreground#e6d4a8
  • statusBar.noFolderBackground#1c1611
  • statusBarItem.remoteBackground#00bfff
  • statusBarItem.remoteForeground#140f0a
  • tab.activeBackground#241d18
  • tab.activeBorder#ffedc640
  • tab.activeForeground#ffedc6
  • tab.border#00000000
  • tab.inactiveBackground#140f0a
  • tab.inactiveForeground#e6d4a8
  • terminal.ansiBlack#140f0a
  • terminal.ansiBlue#ff6b35
  • terminal.ansiBrightBlack#6e5a48
  • terminal.ansiBrightBlue#00bfff
  • terminal.ansiBrightCyan#18dcff
  • terminal.ansiBrightGreen#26de81
  • terminal.ansiBrightMagenta#c56cf0
  • terminal.ansiBrightRed#ff4757
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#ffa502
  • terminal.ansiCyan#ffb347
  • terminal.ansiGreen#ff9500
  • terminal.ansiMagenta#9b59b6
  • terminal.ansiRed#ffd700
  • terminal.ansiWhite#ffedc6
  • terminal.ansiYellow#00bfff
  • terminal.background#140f0a
  • terminal.foreground#ffedc6
  • terminalCursor.foreground#ffedc6
  • textLink.activeForeground#00bfff
  • textLink.foreground#00bfff
  • titleBar.activeBackground#140f0a
  • titleBar.activeForeground#ffedc6
  • titleBar.border#00000000
  • titleBar.inactiveBackground#140f0a
  • titleBar.inactiveForeground#e6d4a8

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a08968italic
string, string.quoted, string.template#ff9500
constant.numeric#ffd700
constant.language.boolean#ffd700
constant.language.null, constant.language.undefined#ffd700
keyword, keyword.control#ff6b35
storage, storage.type, storage.modifier#ff6b35
keyword.operator#ff6b35
entity.name.function, support.function#00bfff
entity.name.method#00bfff
entity.name.type, entity.name.class, support.type, support.class#9b59b6
variable, entity.name.variable, variable.other#fff5e0
variable.parameter#ffd700
variable.other.property, support.type.property-name#ffb347
constant, variable.other.constant#ffd700
entity.name.tag#ffd700
entity.other.attribute-name#ffb347
punctuation#ffedc6
variable.language.special.self.python, variable.parameter.function.language.special.self.python#ffd700normal
support.function.magic.python#00bfffnormal
invalid, invalid.illegal#ff4757
constant.other.color#ffedc6
keyword.control, constant.other.color, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution#ff6b35
entity.name.function, variable.function, support.function, keyword.other.special-method#00bfff
meta.block variable.other#ffedc6
support.other.variable, string.other.link#ffedc6
constant.numeric, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other, constant.language.boolean#ffd700
string, constant.other.symbol, constant.other.key, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#ff9500
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#9b59b6
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name, support.type.vendored.property-name.css, source.css.scss entity.name.tag, variable.parameter.keyframe-list.css, meta.property-name.css, variable.parameter.url.scss, meta.property-value.scss, meta.property-value.css#ffedc6
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ff4757
variable.language#e6d4a8
entity.name.method.js#ffedc6
meta.class-method.js entity.name.function.js, variable.function.constructor#ffedc6
entity.other.attribute-name, meta.property-list.scss, meta.attribute-selector.scss, meta.property-value.css, entity.other.keyframe-offset.css, meta.selector.css, entity.name.tag.reference.scss, entity.name.tag.nesting.css, punctuation.separator.key-value.css#ffb347
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#00bfff
entity.other.attribute-name.class, entity.other.attribute-name.id, meta.attribute-selector.scss, variable.parameter.misc.css#00bfff
source.sass keyword.control, meta.attribute-selector.scss#ffedc6
markup.inserted#26de81
markup.deleted#ff4757
markup.changed#ffa502
string.regexp#ffb347
constant.character.escape#e6d4a8
*url*, *link*, *uri*#00bfffunderline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#00bfff
source.js constant.other.object.key.js string.unquoted.label.js#ff4757normal
support.type.property-name.json#00bfff
text.html.markdown, punctuation.definition.list_item.markdown#ffedc6
text.html.markdown markup.inline.raw.markdown#e6d4a8
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#ffedc6
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, markup.heading, markup.inserted.git_gutter#00bfff
markup.italic#ffedc6normal
markup.bold, markup.bold string#ffedc6bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#ffedc6bold
markup.underline#00bfffunderline
markup.quote punctuation.definition.blockquote.markdown#ffedc6
markup.quote#ffedc6
string.other.link.title.markdown#ffedc6
string.other.link.description.title.markdown#e6d4a8
constant.other.reference.link.markdown#00bfff
markup.raw.block#e6d4a8
markup.raw.block.fenced.markdown#ff950030
punctuation.definition.fenced.markdown#ff950030
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#ffedc6
variable.language.fenced.markdown#ffedc6
meta.separator#a08968bold
markup.table#ffedc6
meta.brace, punctuation.definition.block, punctuation.definition.parameters, punctuation.section.function, meta.brackets, punctuation.definition.brackets, punctuation.definition.dictionary, punctuation.definition.array, punctuation.section, punctuation.section.block, punctuation.section.braces, punctuation.section.group, punctuation.section.parameters#6e5a48
meta.function string.quoted.double.ts, meta.function string.quoted.single.ts, meta.function string.quoted.double.js, meta.function string.quoted.single.js, meta.function string.quoted.double.tsx, meta.function string.quoted.single.tsx#ffd700
support.function.builtin.python, support.function.magic.python, support.type.builtin.python#00bfffbold
variable.parameter.function.python#ffd700normal
keyword.control.flow.python, keyword.control.import.python, keyword.control.statement.python, keyword.operator.member.python, keyword.operator.wordlike.python#ff6b35
keyword.operator.logical.python, keyword.operator.arithmetic.python, keyword.operator.assignment.python, keyword.operator.comparison.python, keyword.operator.bitwise.python#ffd700
storage.type.python, storage.type.annotation.python, storage.type.function.python, storage.type.class.python, storage.type.union.python, storage.type.intersection.python, storage.type.optional.python, storage.type.any.python, storage.type.unknown.python, storage.type.none.python#9b59b6bold
variable.parameter.function.language.special.self.python#ffd700
entity.name.type.class.python, entity.name.type.class.python punctuation.definition.class.python#9b59b6
entity.name.function.python, meta.function.python entity.name.function.python#00bfff
variable.other.constant.python, variable.other.enummember.python, variable.other.property.python, variable.other.object.python, variable.other.readwrite.python#00bfff
constant.character.format.placeholder.other.python, constant.character.format.placeholder.other.python punctuation.definition.format.placeholder.python#ffd700
string.quoted.single.python, string.quoted.double.python, string.quoted.triple.single.python, string.quoted.triple.double.python, string.regexp.python, string.quoted.single.python punctuation.definition.string.begin.python, string.quoted.single.python punctuation.definition.string.end.python, string.quoted.double.python punctuation.definition.string.begin.python, string.quoted.double.python punctuation.definition.string.end.python, string.quoted.triple.single.python punctuation.definition.string.begin.python, string.quoted.triple.single.python punctuation.definition.string.end.python, string.quoted.triple.double.python punctuation.definition.string.begin.python, string.quoted.triple.double.python punctuation.definition.string.end.python#ff9500
punctuation.definition.string.begin.python, punctuation.definition.string.end.python, string.quoted.docstring.multi.python#ff9500
constant.language.python#ffd700normal
meta.object-literal.key string.quoted.single.ts, meta.object-literal.key string.quoted.double.ts, meta.object-literal.key string.quoted.single.js, meta.object-literal.key string.quoted.double.js, meta.object-literal.key string.quoted.single.tsx, meta.object-literal.key string.quoted.double.tsx, meta.object.member string.quoted.single.ts, meta.object.member string.quoted.double.ts, meta.object.member string.quoted.single.js, meta.object.member string.quoted.double.js, meta.object.member string.quoted.single.tsx, meta.object.member string.quoted.double.tsx, meta.array.literal string.quoted.single.ts, meta.array.literal string.quoted.double.ts, meta.array.literal string.quoted.single.js, meta.array.literal string.quoted.double.js, meta.array.literal string.quoted.single.tsx, meta.array.literal string.quoted.double.tsx, meta.enum.declaration string.quoted.single.ts, meta.enum.declaration string.quoted.double.ts, meta.enum.declaration string.quoted.single.js, meta.enum.declaration string.quoted.double.js, meta.enum.declaration string.quoted.single.tsx, meta.enum.declaration string.quoted.double.tsx#26de81
meta.tag string.quoted.single.ts, meta.tag string.quoted.double.ts, meta.tag string.quoted.single.js, meta.tag string.quoted.double.js, meta.tag string.quoted.single.tsx, meta.tag string.quoted.double.tsx, meta.attribute string.quoted.single.ts, meta.attribute string.quoted.double.ts, meta.attribute string.quoted.single.js, meta.attribute string.quoted.double.js, meta.attribute string.quoted.single.tsx, meta.attribute string.quoted.double.tsx#ffedc6
meta.import string.quoted.single.ts, meta.import string.quoted.double.ts, meta.import string.quoted.single.js, meta.import string.quoted.double.js, meta.import string.quoted.single.tsx, meta.import string.quoted.double.tsx#ffedc6
string.template.js, string.template.ts#ff9500
string.quoted.single.ansible, string.quoted.double.ansible, string.quoted.single.yaml.ansible, string.quoted.double.yaml.ansible, punctuation.definition.string.begin.ansible, punctuation.definition.string.end.ansible, punctuation.definition.string.begin.yaml.ansible, punctuation.definition.string.end.yaml.ansible#ff9500
string.quoted.double.json, punctuation.definition.string.begin.json, punctuation.definition.string.end.json, string.quoted.double.json punctuation.definition.string.begin, string.quoted.double.json punctuation.definition.string.end, punctuation.support.type.property-name.begin.json.lines, punctuation.support.type.property-name.end.json.lines#ff9500