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#2c3039
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#282c34
  • editor.findMatchBackground#10b1fe
  • editor.foreground#abb2bf
  • editor.selectionBackground#444549
  • editorCursor.background#10b1fe
  • editorCursor.foreground#abb2bf
  • editorGroup.border#292d36
  • editorGutter.background#282c34
  • editorLineNumber.activeForeground#abb2bf
  • editorLineNumber.foreground#7a808b
  • inlineChatInput.background#2b3038
  • inlineChatInput.foreground#ffffff
  • inlineChatInput.placeholderForeground#10b1fe
  • input.background#2b3038
  • input.foreground#ffffff
  • input.placeholderForeground#10b1fe
  • panel.background#282c34
  • sideBar.background#2c3039
  • statusBar.background#1f2125
  • statusBar.foreground#abb2bf
  • statusBar.noFolderBackground#23252A
  • statusBarItem.remoteBackground#1f2125
  • statusBarItem.remoteForeground#abb2bf

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#10b1fe
comment#7a808b
markup.heading#f9c859
entity.name.tag#ff6480
entity.name.tag#10b1fe
comment#7a808b
markup.underline.link#10b1fe
keyword#ce9887
markup.fenced_code, markup.inline.raw#ce9887
markup.list#ff6480
invalid#ff6480
keyword#f9c859
keyword#f9c859
invalid.deprecated#f9c859
invalid.deprecated
markup.inserted#3fc56b
markup.inserted#329d55
comment#9f7efe
comment#10b1fe
comment#ff936a
comment#3fc56b
comment#ff78f8
keyword#78F8FF
gitDecoration.addedResourceForeground#3fc56b
gitDecoration.untrackedResourceForeground#f9c859
gitDecoration.ignoredResourceForeground#7a808b
gitDecoration.renamedResourceForeground#f9c859
gitDecoration.modifiedResourceForeground#9f7efe
breadcrumb.foreground, tree.tableColumnHeader.foreground#f9c859
explorer.fileForeground#abb2bf
explorer.directoryForeground#abb2bf
comment.documentation#696969
editorSuggestWidget.highlightForeground#10b1fe
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#abb2bf
invalid#FF0000
invalid#3fc56b
invalid#ff6480
invalid#ff6480
invalid#3fc56b
invalid, invalid.deprecated#f9c859
invalid#ff6480
invalid.deprecated#f9c859
invalid#ff6480
invalid#ff6480
invalid.deprecated#f9c859
invalid#ff6480
invalid.deprecated#f9c859
invalid#ff6480
entity.name.type#10b1fe
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#7a808b
diffEditor.insertedTextBackground#3fc56b
diffEditor.removedTextBackground#ff6480
invalid#FF0000
entity.name.function#78F8FF
diff.insertedTextBackground#3fc56b
diff.removedTextBackground#ff6480
meta.diff.header.file#10b1fe
meta.diff.header#78F8FF
invalid.deprecated#ff6480
invalid.deprecated#f9c859
entity.name.function#8bcdef
invalid.deprecated#f9c859
string#FFFFE0
invalid.deprecated#f9c859
invalid#ff6480
invalid.deprecated#f9c859
invalid#ff6480
variable#3fc56b
variable#ff78f8
variable#636d83
comment#636d83
comment#abb2bf
comment.documentation#3fc56b
editor.findMatchBackground#3fc56b
editor.findMatchHighlightBackground#b5bbc9
editor.findMatchBackground, editor.findMatchHighlightBackground#b5bbc9
string.regexp#7a82da
string.regexp#7a82da
string.regexp#f9c859
meta.preprocessor, keyword.control.import#7a82da
invalid.deprecated#f9c859
invalid.deprecated#f9c859
constant, constant.language, support.constant#9f7efe
constant#9f7efe
storage.type, support.type, entity.name.type#ff6480
entity.name.type#ff6480
variable#8bcdef
variable, variable.other#8bcdef
variable#8bcdef
entity.name.function#3fc56b
entity.name.function, support.function#3fc56b
entity.name.function#3fc56b
support.function, support.class, support.type#3fc56b
keyword, storage, keyword.control, storage.modifier#10b1fe
keyword#10b1fe
comment.documentation#9f7efe
comment.documentation, comment.block.documentation#f9c859
comment.documentation#f9c859
string, string.quoted, string.template#f9c859
string#f9c859
comment, punctuation.definition.comment#7a808b
comment#7a808b
comment, punctuation.definition.comment#7a808b
comment#7a808b
invalid#1e222a
invalid
invalid.illegal#1e222a
editor.wordHighlightStrongBackground#ff6480
invalid.deprecated#f9c859
invalid.illegal#ff6480
editorCursor.foreground
editorGutter.background#595e68
editorGroup.border#292d36
editorGroupHeader.tabsBackground#abb2bf
statusBar.noFolderBackground#7a808b
statusBar.background, statusBar.foreground#abb2bf
editorLineNumber.activeForeground
editorLineNumber.activeForeground#abb2bf
editorLineNumber.foreground#7a808b
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#1e222a

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Emacs Themes Ported - Coding Theme