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#010F32
  • activityBar.border#FFCEE312
  • activityBar.foreground#FFCEE3
  • activityBar.inactiveForeground#FFCEE399
  • activityBarBadge.background#FF85BB
  • activityBarBadge.foreground#011238
  • button.background#FF85BB
  • button.foreground#011238
  • button.hoverBackground#FF85BBCC
  • descriptionForeground#FFCEE3CC
  • dropdown.background#011238
  • dropdown.border#FFCEE320
  • dropdown.foreground#FFCEE3
  • editor.background#011238
  • editor.findMatchBackground#FFD16640
  • editor.findMatchHighlightBackground#FFD16626
  • editor.findRangeHighlightBackground#FFD1661F
  • editor.foreground#FFCEE3
  • editor.inactiveSelectionBackground#FF85BB3A
  • editor.lineHighlightBackground#FFFFFF0B
  • editor.selectionBackground#FF85BB55
  • editor.selectionHighlightBackground#FF85BB24
  • editor.selectionHighlightBorder#FF85BB
  • editor.symbolHighlightBackground#C7B6FF24
  • editor.symbolHighlightBorder#C7B6FFE6
  • editor.wordHighlightBackground#FF85BB1F
  • editor.wordHighlightBorder#7AD7FFCC
  • editor.wordHighlightStrongBackground#FF85BB2B
  • editor.wordHighlightStrongBorder#FFD166CC
  • editor.wordHighlightTextBackground#7AD7FF26
  • editor.wordHighlightTextBorder#7AD7FFE6
  • editorBracketHighlight.foreground1#FF85BB
  • editorBracketHighlight.foreground2#7AD7FF
  • editorBracketHighlight.foreground3#FFD166
  • editorBracketHighlight.foreground4#A6FFCB
  • editorBracketHighlight.foreground5#C7B6FF
  • editorBracketHighlight.foreground6#FF5C7A
  • editorBracketMatch.background#FF85BB66
  • editorBracketMatch.border#FF85BBFF
  • editorBracketPairGuide.activeBackground1#FF85BBCC
  • editorBracketPairGuide.activeBackground2#7AD7FFCC
  • editorBracketPairGuide.activeBackground3#FFD166CC
  • editorBracketPairGuide.activeBackground4#A6FFCBCC
  • editorBracketPairGuide.activeBackground5#C7B6FFCC
  • editorBracketPairGuide.activeBackground6#FF5C7ACC
  • editorBracketPairGuide.background1#FF85BB2B
  • editorBracketPairGuide.background2#7AD7FF2B
  • editorBracketPairGuide.background3#FFD1662B
  • editorBracketPairGuide.background4#A6FFCB2B
  • editorBracketPairGuide.background5#C7B6FF2B
  • editorBracketPairGuide.background6#FF5C7A2B
  • editorCursor.background#011238
  • editorCursor.foreground#FF85BB
  • editorError.foreground#FF5C7A
  • editorGroup.border#FFCEE312
  • editorGroupHeader.tabsBackground#010F32
  • editorGutter.addedBackground#3DFFB033
  • editorGutter.background#011238
  • editorGutter.deletedBackground#FF5C7A33
  • editorGutter.modifiedBackground#FFD16633
  • editorIndentGuide.activeBackground#FFCEE340
  • editorIndentGuide.background#FFCEE320
  • editorInfo.foreground#7AD7FF
  • editorLineNumber.activeForeground#FFCEE3
  • editorLineNumber.foreground#FFCEE366
  • editorRuler.foreground#FFCEE320
  • editorWarning.foreground#FFD166
  • editorWhitespace.foreground#FFCEE31F
  • errorForeground#FF5C7A
  • focusBorder#FF85BB
  • foreground#FFCEE3
  • input.background#011238
  • input.border#FFCEE320
  • input.foreground#FFCEE3
  • input.placeholderForeground#FFCEE399
  • list.activeSelectionBackground#FF85BB2B
  • list.activeSelectionForeground#FFCEE3
  • list.focusBackground#FF85BB2B
  • list.focusForeground#FFCEE3
  • list.hoverBackground#FF85BB1A
  • list.hoverForeground#FFCEE3
  • list.inactiveSelectionBackground#FF85BB1F
  • list.inactiveSelectionForeground#FFCEE3
  • minimap.selectionHighlight#FF85BB88
  • notificationCenterHeader.background#010F32
  • notifications.background#010F32
  • notifications.border#FFCEE312
  • notifications.foreground#FFCEE3
  • panel.background#010F32
  • panel.border#FFCEE312
  • peekView.border#FF85BB66
  • peekViewEditor.background#011238
  • peekViewResult.background#010F32
  • peekViewTitle.background#010F32
  • scrollbarSlider.activeBackground#FFCEE333
  • scrollbarSlider.background#FFCEE31A
  • scrollbarSlider.hoverBackground#FFCEE326
  • sideBar.background#010F32
  • sideBar.border#FFCEE312
  • sideBar.foreground#FFCEE3
  • sideBarSectionHeader.background#010F32
  • sideBarSectionHeader.foreground#FFCEE3
  • statusBar.background#010F32
  • statusBar.border#FFCEE312
  • statusBar.foreground#FFCEE3
  • statusBarItem.hoverBackground#FF85BB1F
  • tab.activeBackground#011238
  • tab.activeForeground#FFCEE3
  • tab.border#FFCEE312
  • tab.hoverBackground#011238
  • tab.inactiveBackground#010F32
  • tab.inactiveForeground#FFCEE399
  • terminal.background#011238
  • terminal.foreground#FFCEE3
  • terminal.selectionBackground#FF85BB55
  • terminalCursor.foreground#FF85BB
  • titleBar.activeBackground#010F32
  • titleBar.activeForeground#FFCEE3
  • titleBar.inactiveBackground#010F32
  • titleBar.inactiveForeground#FFCEE399

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#FFCEE366italic
entity.name.tag, entity.name.tag.html, entity.name.tag.xml, meta.tag entity.name.tag#FF85BB
punctuation.definition.tag, meta.tag punctuation.definition.tag, punctuation.separator.key-value.html, punctuation.separator.key-value#FF85BB
entity.other.attribute-name, entity.other.attribute-name.html, meta.attribute-name, meta.tag entity.other.attribute-name#FFD166
string.quoted.double.html, string.quoted.single.html, meta.attribute-with-value string.quoted, meta.tag string.quoted#7AF7E3
punctuation.definition.string.begin.html, punctuation.definition.string.end.html, meta.tag punctuation.definition.string#FF85BB
text.html.basic, meta.tag.inline.any.html, text.html.derivative#FFCEE3
string, punctuation.definition.string#7AD7FF
keyword, storage.type, storage.modifier#FF85BB
constant.numeric, constant.language, constant.character, constant.other#FFD166
entity.name.function, support.function, meta.function-call, variable.function#A6FFCB
entity.name.type, support.type, entity.name.class#C7B6FF
variable, identifier#FFCEE3
variable.parameter#FFCEE3CC
punctuation, meta.brace, meta.delimiter#FFCEE3B3
invalid, invalid.illegal#011238