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#B8C0D8
  • activityBar.background#1D2230
  • activityBar.foreground#C6C8CF
  • activityBar.inactiveForeground#727B8E
  • activityBarBadge.background#B48F5D
  • activityBarBadge.foreground#1D2230
  • badge.background#B48F5D
  • badge.foreground#1D2230
  • button.background#B48F5D
  • button.foreground#1D2230
  • button.hoverBackground#C39E6B
  • button.secondaryBackground#2C3243
  • button.secondaryForeground#C6C8CF
  • checkbox.background#2C3243
  • checkbox.border#3A4258
  • descriptionForeground#AEB5C3
  • dropdown.background#252C3D
  • dropdown.border#3A4258
  • editor.background#1D2230
  • editor.findMatchBackground#8A7B4B88
  • editor.findMatchHighlightBackground#8A7B4B55
  • editor.foreground#C6C8CF
  • editor.inactiveSelectionBackground#4B557044
  • editor.lineHighlightBackground#252B3A
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#5B678666
  • editor.wordHighlightBackground#3A425866
  • editor.wordHighlightStrongBackground#5A638255
  • editorActionList.background#1D2230
  • editorActionList.focusBackground#3A4258
  • editorActionList.focusForeground#E6E9EF
  • editorActionList.foreground#C6C8CF
  • editorBracketHighlight.foreground1#9FB2CF
  • editorBracketHighlight.foreground2#9FC2A3
  • editorBracketHighlight.foreground3#D3BF8A
  • editorBracketHighlight.foreground4#B39AC8
  • editorBracketHighlight.foreground5#8BB7C8
  • editorBracketHighlight.foreground6#BFC4CF
  • editorBracketMatch.background#2C3243
  • editorBracketMatch.border#C6C8CF
  • editorCursor.foreground#E6E9EF
  • editorError.foreground#C27A7A
  • editorGroupHeader.border#2C3243
  • editorGroupHeader.noTabsBackground#1D2230
  • editorGroupHeader.tabsBackground#1D2230
  • editorGutter.addedBackground#8FBF9A
  • editorGutter.background#1D2230
  • editorGutter.deletedBackground#C27A7A
  • editorGutter.modifiedBackground#D3BF8A
  • editorHint.foreground#8B93A4
  • editorHoverWidget.background#1D2230
  • editorHoverWidget.border#3A4258
  • editorHoverWidget.foreground#C6C8CF
  • editorIndentGuide.activeBackground1#4A5470
  • editorIndentGuide.background1#323A4F
  • editorInfo.foreground#8BB7C8
  • editorInlayHint.background#00000000
  • editorInlayHint.foreground#727B8EB3
  • editorLineNumber.activeForeground#D3BF8A
  • editorLineNumber.foreground#727B8E
  • editorRuler.foreground#3A4258
  • editorSuggestWidget.background#1D2230
  • editorSuggestWidget.border#3A4258
  • editorSuggestWidget.foreground#C6C8CF
  • editorSuggestWidget.highlightForeground#9FB2CF
  • editorSuggestWidget.selectedBackground#2C3243
  • editorSuggestWidget.selectedForeground#E6E9EF
  • editorWarning.foreground#D3BF8A
  • editorWidget.background#252C3D
  • focusBorder#9FB2CF
  • input.background#2C3243
  • input.border#3A4258
  • input.foreground#C6C8CF
  • input.placeholderForeground#727B8E
  • list.activeSelectionBackground#3A4258
  • list.activeSelectionForeground#E6E9EF
  • list.focusBackground#3A4258
  • list.focusForeground#E6E9EF
  • list.highlightForeground#9FB2CF
  • list.hoverBackground#262D3E
  • list.hoverForeground#C6C8CF
  • list.inactiveFocusBackground#3A4258
  • list.inactiveSelectionBackground#3A4258
  • list.inactiveSelectionForeground#C6C8CF
  • menu.background#1D2230
  • menu.foreground#C6C8CF
  • menu.selectionBackground#3A4258
  • menu.selectionForeground#E6E9EF
  • panel.background#1D2230
  • panel.border#3A4258
  • peekView.border#3A4258
  • peekViewEditor.background#252C3D
  • peekViewResult.background#1D2230
  • pickerGroup.border#3A4258
  • pickerGroup.foreground#AEB5C3
  • progressBar.background#9FB2CF
  • quickInput.background#1D2230
  • quickInput.foreground#C6C8CF
  • quickInputList.focusBackground#3A4258
  • quickInputList.focusForeground#E6E9EF
  • quickInputList.focusIconForeground#9FB2CF
  • quickInputTitle.background#1D2230
  • scrollbarSlider.activeBackground#4A5470CC
  • scrollbarSlider.background#2C3243B3
  • scrollbarSlider.hoverBackground#4A5470B3
  • sideBar.background#181C28
  • sideBar.border#3A4258
  • sideBar.foreground#C6C8CF
  • sideBarSectionHeader.background#252C3D
  • sideBarSectionHeader.foreground#C6C8CF
  • statusBar.background#1D2230
  • statusBar.debuggingBackground#C27A7A
  • statusBar.debuggingForeground#1D2230
  • statusBar.foreground#AEB5C3
  • statusBarItem.hoverBackground#2C3243
  • statusBarItem.remoteBackground#2C3243
  • statusBarItem.remoteForeground#C6C8CF
  • tab.activeBackground#3A4258
  • tab.activeBorderTop#9FB2CF
  • tab.activeForeground#E6E9EF
  • tab.border#2C3243
  • tab.hoverBackground#2C3243
  • tab.inactiveBackground#252C3D
  • tab.unfocusedActiveBackground#3A4258
  • terminal.ansiBlack#30384A
  • terminal.ansiBlue#87C5E8
  • terminal.ansiBrightBlack#B1BCD0
  • terminal.ansiBrightBlue#A7DBF4
  • terminal.ansiBrightCyan#B3E8F7
  • terminal.ansiBrightGreen#CBEA9F
  • terminal.ansiBrightMagenta#E6C1F6
  • terminal.ansiBrightRed#FF8D9D
  • terminal.ansiBrightWhite#F7FAFF
  • terminal.ansiBrightYellow#F5E7A7
  • terminal.ansiCyan#8FD3EA
  • terminal.ansiGreen#B8D08F
  • terminal.ansiMagenta#D1A6E8
  • terminal.ansiRed#E06D7B
  • terminal.ansiWhite#D8DEE9
  • terminal.ansiYellow#E3D68F
  • terminal.background#161A25
  • terminal.border#3A4258
  • terminal.foreground#C6C8CF
  • terminal.selectionBackground#5B678666
  • terminalCommandDecoration.defaultBackground#8FA9C4
  • terminalCommandDecoration.errorBackground#C56673
  • terminalCommandDecoration.successBackground#A5B48B
  • terminalCursor.background#161A25
  • terminalCursor.foreground#E6E9EF
  • textLink.foreground#9FB2CF
  • titleBar.activeBackground#1D2230
  • titleBar.activeForeground#C6C8CF
  • titleBar.inactiveBackground#1D2230
  • titleBar.inactiveForeground#AEB5C3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#727B8Eitalic
keyword, storage, keyword.control#D3BF8A—
string, string.quoted, string.regexp#8FBF9A—
constant, constant.numeric, constant.language#B7A1D9—
entity.name.function, support.function, meta.function-call#8FB7D6—
entity.name.type, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, storage.type, entity.name.type.rust, support.type.rust, entity.name.type.parameter.rust#B48F5D—
support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, entity.name.type.class#B48F5D—
entity.name.variant.rust, entity.name.enum.variant.rust, entity.name.type.variant, entity.name.type.variant.rust, entity.name.constant.rust, meta.enum.rust entity.name.type.rust, variable.other.enummember, support.constant.enum, constant.other.enum#D9DEE8—
entity.name.type.lifetime.rust#E69875—
punctuation.brackets.angle, punctuation.brackets.angle.rust, punctuation.brackets.square, punctuation.brackets.square.rust, punctuation.section.braces.begin, punctuation.section.braces.end, punctuation.section.block.begin, punctuation.section.block.end, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, keyword.operator.arrow.rust, keyword.operator.fat-arrow.rust, storage.type.function.arrow.rust, punctuation.definition.generic.begin.rust, punctuation.definition.generic.end.rust#BEAF84—
variable, variable.parameter#C6C8CF—
punctuation.definition.variable.php, meta.variable.php punctuation.definition.variable.php, source.php punctuation.definition.variable#B48F5D—
variable.language.this, variable.language.this.php, variable.language.self#B39AC8—
punctuation, punctuation.definition#AEB5C3—
keyword.operator, keyword.operator.arrow, keyword.operator.arrow.rust, keyword.operator.fat-arrow, keyword.operator.fat-arrow.rust, storage.type.function.arrow, storage.type.function.arrow.rust, punctuation.brackets.angle, punctuation.brackets.angle.rust, punctuation.brackets.square, punctuation.brackets.square.rust, punctuation.section.braces.begin, punctuation.section.braces.end, punctuation.section.block.begin, punctuation.section.block.end, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, punctuation.separator.key-value, punctuation.separator.key-value.rust, punctuation.definition.generic.begin.rust, punctuation.definition.generic.end.rust#BEAF84—
markup.heading, markup.heading.markdown#D3BF8Abold
entity.name.tag, meta.tag#8FB7D6—
entity.other.attribute-name#D3BF8A—
support.macro.rust, entity.name.function.macro.rust, entity.name.function.macro.dark-ever.rust#B7A1D9—
entity.name.function.decorator, meta.decorator, punctuation.decorator, storage.type.annotation, storage.type.annotation.java, entity.name.type.annotation, entity.name.type.annotation.java, meta.annotation, meta.annotation.java#B39AC8—
meta.enum.rust entity.name.type.rust, meta.enum.rust entity.name.type, meta.enum.rust meta.block.rust entity.name.type.rust, meta.enum.rust meta.block.rust entity.name.type, meta.enum.rust meta.group.rust entity.name.type.rust, meta.enum.rust meta.group.rust entity.name.type, meta.block.rust meta.enum.rust entity.name.type.rust, meta.block.rust meta.enum.rust entity.name.type, entity.name.type.variant, entity.name.type.variant.rust, entity.name.type.enum.variant, entity.name.type.enum.variant.rust, meta.enum.rust variable.other.readwrite, meta.enum.rust variable.other#D9DEE8—
keyword.declaration.enum.rust storage.type.rust, keyword.declaration.struct.rust storage.type.rust#D3BF8A—
entity.name.namespace.rust#B48F5D—
invalid, invalid.illegal#C27A7A—