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#1a1a1a
  • activityBar.foreground#ff4d29
  • editor.background#1f1f1f
  • editor.foreground#e0e0e0
  • editor.lineHighlightBackground#262626
  • editor.selectionBackground#444444
  • editorBracketHighlight.foreground1#fabd2f
  • editorBracketHighlight.foreground2#8fb28f
  • editorBracketHighlight.foreground3#d3869b
  • editorBracketHighlight.foreground4#83a598
  • editorBracketHighlight.foreground5#ff4d29
  • editorBracketHighlight.foreground6#f2e5bc
  • editorBracketHighlight.unexpectedBracket.foreground#ff0000
  • editorCursor.foreground#ff4d29
  • editorError.foreground#ff4d29
  • editorHint.foreground#8fb28f
  • editorInfo.foreground#83a598
  • editorLineNumber.activeForeground#ff4d29
  • editorRuler.foreground#333333
  • editorWarning.foreground#fabd2f
  • gitDecoration.deletedResourceForeground#ff4d29
  • gitDecoration.ignoredResourceForeground#666666
  • gitDecoration.modifiedResourceForeground#fabd2f
  • gitDecoration.untrackedResourceForeground#98971a
  • problemsErrorIcon.foreground#ff4d29
  • problemsWarningIcon.foreground#fabd2f
  • scrollbarSlider.activeBackground#ff4d2980
  • scrollbarSlider.background#44444450
  • scrollbarSlider.hoverBackground#66666680
  • sideBar.background#1a1a1a
  • statusBar.background#262626
  • statusBar.border#333333
  • statusBar.foreground#ff4d29
  • tab.activeBackground#1f1f1f
  • tab.activeForeground#ff4d29
  • tab.border#333333
  • tab.inactiveBackground#1a1a1a
  • terminal.ansiBlack#262626
  • terminal.ansiBlue#83a598
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightGreen#b5bd68
  • terminal.ansiBrightRed#f74c00
  • terminal.ansiBrightYellow#f2e5bc
  • terminal.ansiCyan#8ec07c
  • terminal.ansiGreen#98971a
  • terminal.ansiMagenta#d3869b
  • terminal.ansiRed#ff4d29
  • terminal.ansiWhite#e0e0e0
  • terminal.ansiYellow#fabd2f
  • terminal.background#1f1f1f
  • terminal.foreground#e0e0e0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword, storage.type, storage.modifier, keyword.control#ff4d29
entity.name.function, support.function, variable.function#f2e5bc
string, constant.character#98971a
entity.name.type, support.type, support.class#fabd2f
constant.numeric, constant.language, support.constant#d3869b
comment, punctuation.definition.comment#666666italic
entity.name.function.macro, support.function.macro#8fb28fbold
storage.modifier.lifetime, entity.name.type.lifetime#d3869bitalic
entity.name.section.toml, support.type.property-name.table.toml, meta.tag.toml#fabd2fbold
variable.key.toml, support.type.property-name.toml, keyword.key.toml#83a598
punctuation.definition.table.toml, punctuation.separator.key-value.toml#666666
markup.heading, punctuation.definition.heading.markdown#fabd2fbold
markup.bold, punctuation.definition.bold.markdown#ff4d29bold
markup.italic, punctuation.definition.italic.markdown#d3869bitalic
markup.quote, markup.list, punctuation.definition.list.begin.markdown#98971a
markup.underline.link, string.other.link.title.markdown#83a598underline
markup.inline.raw.string.markdown, markup.fenced_code.block.markdown#f2e5bc
entity.name.tag, meta.tag.sgml#fabd2f
punctuation.definition.tag#666666
entity.other.attribute-name#83a598italic