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#F0EBE2
  • activityBar.foreground#ED9366
  • activityBar.inactiveForeground#ABB0B6
  • badge.background#ED9366
  • badge.foreground#000000
  • button.background#ED9366
  • button.foreground#000000
  • button.hoverBackground#FF5500
  • descriptionForeground#8C8C8C
  • diffEditor.insertedLineBackgroundhsla(160, 35%, 40%, 0.14)
  • diffEditor.insertedTextBackgroundhsla(160, 35%, 40%, 0.14)
  • diffEditor.removedLineBackgroundhsla(5, 45%, 55%, 0.14)
  • diffEditor.removedTextBackgroundhsla(5, 45%, 55%, 0.14)
  • dropdown.background#FFFFFF
  • dropdown.border#D2C8BA
  • dropdown.foreground#A37ACC
  • editor.background#F7F4EE
  • editor.findMatchBackground#ED936699
  • editor.findMatchForeground#000000
  • editor.findMatchHighlightBackground#ED936655
  • editor.findRangeHighlightBackground#ED936633
  • editor.foreground#6E7580
  • editor.inactiveSelectionBackground#E6E0D6
  • editor.lineHighlightBackground#EEE8DE
  • editor.selectionBackground#ED936633
  • editor.selectionHighlightBackground#ED936655
  • editor.wordHighlightBackground#ED936640
  • editor.wordHighlightStrongBackground#ED936666
  • editorBracketMatch.background#0095B31A
  • editorBracketMatch.border#0095B3
  • editorCursor.foreground#ED9366
  • editorError.foreground#FF1919
  • editorGutter.added#2F8D6E
  • editorGutter.background#F7F4EE
  • editorGutter.deleted#FF1919
  • editorGutter.modified#0095B3
  • editorIndentGuide.activeBackground#ABB0B6
  • editorIndentGuide.background#DDD7CE
  • editorInfo.foreground#0095B3
  • editorLineNumber.activeForeground#6E7580
  • editorLineNumber.foreground#ABB0B6
  • editorWarning.foreground#FFA352
  • editorWhitespace.foreground#DDD7CE
  • editorWidget.background#FFFDF8
  • editorWidget.border#D2C8BA
  • errorForeground#FF1919
  • focusBorder#ED9366
  • foreground#6E7580
  • gitDecoration.addedResourceForeground#2F8D6E
  • gitDecoration.deletedResourceForeground#FF1919
  • gitDecoration.ignoredResourceForeground#8C8C8C
  • gitDecoration.modifiedResourceForeground#0095B3
  • gitDecoration.untrackedResourceForeground#2F8D6E
  • input.background#FFFFFF
  • input.border#D2C8BA
  • input.foreground#A37ACC
  • list.activeSelectionBackground#E6E0D6
  • list.activeSelectionForeground#4B4B4B
  • list.dropBackground#EEE8DE
  • list.focusBackground#E6E0D6
  • list.focusForeground#4B4B4B
  • list.hoverBackground#EEE8DE
  • list.inactiveSelectionBackground#E6E0D6
  • list.inactiveSelectionForeground#4B4B4B
  • menu.background#F7F4EE
  • menu.foreground#6E7580
  • menu.selectionBackground#E6E0D6
  • menu.selectionForeground#4B4B4B
  • minimap.border#ED9366
  • panel.background#F7F4EE
  • panel.border#D2C8BA
  • progressBar.background#ED9366
  • scrollbarSlider.activeBackground#2F8D6ECC
  • scrollbarSlider.background#2F8D6E80
  • scrollbarSlider.hoverBackground#2F8D6EAA
  • selection.background#ED936633
  • sideBar.background#F7F4EE
  • sideBar.foreground#ABB0B6
  • sideBarSectionHeader.background#E8E2D8
  • sideBarSectionHeader.foreground#ABB0B6
  • statusBar.background#E8E2D8
  • statusBar.debuggingBackground#E8E2D8
  • statusBar.foreground#0095B3
  • statusBar.noFolderBackground#E8E2D8
  • statusBarItem.activeBackground#D2C8BA
  • statusBarItem.hoverBackground#DED6C9
  • tab.activeBackground#F7F4EE
  • tab.activeBorder#0095B3
  • tab.activeForeground#6E7580
  • tab.border#D2C8BA
  • tab.inactiveBackground#EDE7DD
  • tab.inactiveForeground#ABB0B6
  • terminal.background#F7F4EE
  • terminal.foreground#6E7580
  • terminalCursor.background#ED9366
  • terminalCursor.foreground#ED9366
  • titleBar.activeBackground#F0EBE2
  • titleBar.activeForeground#6E7580

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8C8C8Citalic
keyword, keyword.control, keyword.operator, keyword.other, punctuation.definition, punctuation.separator, punctuation.terminator, punctuation.accessor#ED9366
punctuation.section#6E7580
string, string.quoted#B3AA59
constant.numeric, constant.language, constant.other, support.constant#0095B3
entity.name.function#A37ACC
variable.function, support.function, support.macro#ED9366italic
variable.annotation#FFA352italic
variable.language, variable.parameter, variable.member#0095B3italic
storage, storage.type#6E7580italic
storage.modifier, support.type#5E8A63italic
support.class#5E8A63italic
entity.name#5E8A63
entity.name.namespace#A37ACC
entity.other.inherited-class#0095B3italic
invalid, invalid.deprecated#FF1919
entity.name.tag#ED9366
punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag#ABB0B6
entity.other.attribute-name#5E8A63
markup.heading, markup.heading punctuation.definition.heading, markup.heading.1 punctuation.definition.heading#ED9366bold
string.other.link, markup.underline.link#0095B3
markup.boldbold
markup.italicitalic
markup.italic markup.bold, markup.bold markup.italicbold italic
punctuation.definition.thematic-break#ED9366
markup.list.numberOrange.bullet, markup.quote punctuation.definition.blockquote, markup.list punctuation.definition.list_item#0095B3
markup.raw#6E7580
markup.raw.inline#A37ACC
text punctuation.definition.italic, text punctuation.definition.bold#A37ACC
meta.diff, meta.diff.header, markup.deleted, markup.inserted, markup.changed#ED9366
entity.name.tag.yaml#ED9366
source.yaml string.unquoted#5E8A63
source.systemverilog storage.type.module#B3AA59italic
source.systemverilog entity.name.type.module#5E8A63
source.systemverilog meta.module.inst meta.bind.param support.function.port#A37ACCitalic
source.systemverilog support.function.port#ED9366italic
source.systemverilog support.function.system#A37ACC
markup.error.sublime_linter#FF1919
markup.warning.sublime_linter#FFA352
entity.name.filename.sublime_linter#6E7580
entity.name.label.linter-name.sublime_linter#5E8A63
entity.name.class.error-code.sublime_linter#0095B3
invalid.illegal.unclosed-string.json