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#F0EEEA
  • activityBar.border#CEC9C0
  • activityBar.foreground#AD791F
  • activityBarBadge.background#AD791F
  • activityBarBadge.foreground#FDFDFC
  • badge.background#AD791F
  • badge.foreground#FDFDFC
  • button.background#AD791F
  • button.foreground#FDFDFC
  • button.hoverBackground#AD791F
  • dropdown.background#FDFDFC
  • dropdown.border#CEC9C0
  • dropdown.foreground#000000
  • editor.background#FDFDFC
  • editor.foreground#000000
  • editor.lineHighlightBackground#F0EEEACC
  • editor.selectionBackground#DEE7ED66
  • editorBracketMatch.background#DEE7ED55
  • editorBracketMatch.border#AD791F
  • editorCursor.foreground#AD791F
  • editorGroupHeader.tabsBackground#F0EEEA
  • editorIndentGuide.activeBackground#CEC9C0
  • editorIndentGuide.background#CEC9C088
  • editorLineNumber.activeForeground#345779
  • editorLineNumber.foreground#000000AA
  • editorWhitespace.foreground#CEC9C066
  • focusBorder#CEC9C0
  • foreground#000000
  • gitDecoration.deletedResourceForeground#A82F24
  • gitDecoration.modifiedResourceForeground#B37A19
  • gitDecoration.untrackedResourceForeground#376C4D
  • input.background#FDFDFC
  • input.border#CEC9C0
  • input.foreground#000000
  • inputOption.activeBorder#AD791F
  • list.activeSelectionBackground#DEE7ED
  • list.activeSelectionForeground#000000
  • list.focusOutline#AD791F
  • list.hoverBackground#FDFDFC
  • list.inactiveSelectionBackground#DEE7ED
  • minimap.selectionHighlight#DEE7EDAA
  • panel.background#F0EEEA
  • panel.border#CEC9C0
  • peekView.border#CEC9C0
  • peekViewEditor.background#FDFDFC
  • peekViewTitle.background#F0EEEA
  • scrollbarSlider.activeBackground#AD791FAA
  • scrollbarSlider.background#CEC9C066
  • scrollbarSlider.hoverBackground#CEC9C099
  • sideBar.background#F8F6F2
  • sideBar.border#CEC9C0
  • sideBar.foreground#000000
  • sideBarTitle.foreground#000000
  • statusBar.background#F0EEEA
  • statusBar.border#CEC9C0
  • statusBar.foreground#000000
  • tab.activeBackground#FDFDFC
  • tab.activeForeground#000000
  • tab.border#CEC9C0
  • tab.inactiveBackground#DEE7ED
  • tab.inactiveForeground#345779
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#345779
  • terminal.ansiCyan#000000
  • terminal.ansiGreen#345779
  • terminal.ansiMagenta#AD791F
  • terminal.ansiRed#AD791F
  • terminal.ansiWhite#000000
  • terminal.ansiYellow#DEE7ED
  • terminal.background#FDFDFC
  • terminal.foreground#000000
  • titleBar.activeBackground#F0EEEA
  • titleBar.activeForeground#000000
  • titleBar.inactiveBackground#F8F6F2
  • titleBar.inactiveForeground#000000
  • widget.shadow#7E756755

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, comment.block.documentation#7E7567italic
string, constant.other.symbol, string.regexp, string.template#345779
constant.character.escape#AD791F
constant.numeric#AD791F
constant.language.boolean, constant.language.null, constant.language.undefined#AD791F
constant, entity.name.constant, support.constant#AD791F
keyword, storage.type, storage.modifier, storage.type.function#AD791F
keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.return, keyword.control.import, keyword.control.export#AD791F
keyword.operator, keyword.operator.expression, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.assignment#7E7567
storage.type.class, storage.type.interface, storage.type.enum#AD791F
punctuation, punctuation.separator, punctuation.terminator, punctuation.accessor, punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.array, punctuation.section#7E7567
entity.name.type, support.type, support.class, entity.name.type.class, entity.name.type.interface, entity.name.type.enum#345779
support.type.builtin, entity.name.type.primitive#345779
entity.name.function, meta.definition.function entity.name.function, entity.name.function.definition#28333E
meta.function-call entity.name.function, meta.function-call support.function, support.function, entity.name.function.member#AD791F
variable.parameter, variable.parameter.function#28333E
variable.other.property, variable.other.object.property, variable.object.property, support.type.property-name, meta.object-literal.key, meta.field.declaration variable.object.property#345779
variable, meta.definition.variable, variable.other.readwrite#28333E
entity.name.tag, entity.name.tag.template, entity.name.tag.style, entity.name.tag.script, entity.name.tag.css, entity.name.tag.custom.css#AD791F
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#7E7567
entity.other.attribute-name, entity.other.attribute-name.html#345779
support.class.component, entity.name.tag.template.value#AD791F
support.type.property-name.css, meta.property-name.css, support.type.vendored.property-name.css#376C4D
entity.other.attribute-name.class.css, entity.other.attribute-name.class#AD791F
entity.other.attribute-name.id.css, entity.other.attribute-name.id#AD791F
support.constant.property-value.css, meta.property-value.css, constant.other.color.rgb-value.css#345779
markup.heading#AD791Fbold
markup.boldbold
markup.italicitalic
markup.quote#28333E
markup.inline.raw, markup.fenced_code#345779
invalid, invalid.illegal#C22929