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#110c17
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#0f0b15
  • editor.findMatchBackground#00474f
  • editor.foreground#b8c6d5
  • editor.selectionBackground#342464
  • editorCursor.background#ff6ff0
  • editorCursor.foreground#b8c6d5
  • editorGroup.border#4a4955
  • editorGutter.background#0f0b15
  • editorLineNumber.activeForeground#af85ea
  • editorLineNumber.foreground#807c9f
  • inlineChatInput.background#100c17
  • inlineChatInput.foreground#b8c6d5
  • inlineChatInput.placeholderForeground#e580e0
  • input.background#100c17
  • input.foreground#b8c6d5
  • input.placeholderForeground#e580e0
  • panel.background#0f0b15
  • sideBar.background#110c17
  • statusBar.background#5f1f5f
  • statusBar.foreground#dedeff
  • statusBar.noFolderBackground#2a2f42
  • statusBarItem.remoteBackground#5f1f5f
  • statusBarItem.remoteForeground#dedeff

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#c0a38a
comment#c57faf
entity.name.tag#807c9f
entity.name.tag#4fbaef
comment#c0a38a
markup.underline.link#bf8a9f
keyword#807c9f
markup.fenced_code, markup.inline.raw
markup.list#807c9f
invalid#ef6560
keyword#b58a52
keyword#af85ea
invalid.deprecated#b58a52
invalid.deprecated
markup.inserted#a0e0a0
markup.inserted#a0e0a0
comment#c0a38a
comment#00a392
comment#c0a38a
comment#af85ea
comment#b58a52
comment#af85ea
keyword#af85ea
gitDecoration.addedResourceForeground#29a444
gitDecoration.untrackedResourceForeground#29a444
gitDecoration.ignoredResourceForeground#807c9f
gitDecoration.modifiedResourceForeground#b58a52
breadcrumb.foreground, tree.tableColumnHeader.foreground#af85ea
explorer.fileForeground#b8c6d5
explorer.directoryForeground#af85ea
comment.documentation#696969
editorSuggestWidget.highlightForeground#af85ea
editorSuggestWidget.selectedBackground
editorSuggestWidget.background
invalid#FF0000
invalid#35afbf
invalid#4fbaef
invalid#4fbaef
invalid#29a444
invalid, invalid.deprecated#b58a52
invalid#ef6560
invalid.deprecated#b58a52
invalid#ef6560
invalid#ef6560
invalid.deprecated#b58a52
invalid#ffa9bf
invalid.deprecated#F3EA98
invalid#FC5C94
entity.name.type#af85ea
variable#6a9fff
entity.name.function#35afbf
constant#d369af
string#df9080
comment.documentation#807c9f
diffEditor.insertedTextBackground#a0e0a0
diffEditor.removedTextBackground#ffbfbf
invalid#ef6560
entity.name.function
diff.insertedTextBackground#a0e0a0
diff.removedTextBackground#ffbfbf
invalid.deprecated#ef6560
invalid.deprecated#b58a52
entity.name.function#b58a52
invalid.deprecated#b58a52
string#df9080
invalid.deprecated#b58a52
invalid#ef6560
invalid.deprecated#b58a52
invalid#ef6560
variable#6a9fff
variable#807c9f
comment#c0a38a
comment#c0a38a
comment.documentation#8aa0df
entity.name.function#b58a52
editor.findMatchBackground#b8c6d5
editor.findMatchHighlightBackground#b8c6d5
editor.findMatchBackground, editor.findMatchHighlightBackground#b8c6d5
string.regexp#3f95f6
string.regexp#d369af
string.regexp#df9080
meta.preprocessor, keyword.control.import#ff6a7a
invalid.deprecated#b58a52
invalid.deprecated#b58a52
constant, constant.language, support.constant#d369af
constant#d369af
storage.type, support.type, entity.name.type#4fbaef
entity.name.type#4fbaef
variable#7a94df
variable, variable.other#6a9fff
variable#6a9fff
entity.name.function#8aa0df
entity.name.function, support.function#35afbf
entity.name.function#35afbf
support.function, support.class, support.type#e580e0
keyword, storage, keyword.control, storage.modifier#af85ea
keyword#af85ea
comment.documentation#c57faf
comment.documentation, comment.block.documentation#8aa0df
comment.documentation#8aa0df
string, string.quoted, string.template#df9080
string#df9080
comment, punctuation.definition.comment#c0a38a
comment#c0a38a
comment, punctuation.definition.comment#c0a38a
comment#c0a38a
invalid#b8c6d5
invalid#ef6560
invalid.illegal#ef6560
editor.wordHighlightStrongBackground#b8c6d5
invalid.deprecated#b58a52
invalid.illegal#ef6560
editorCursor.foreground
editorGutter.background#b8c6d5
editorGroup.border#4a4955
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#807c9f
statusBar.background, statusBar.foreground#dedeff
editorLineNumber.activeForeground#af85ea
editorLineNumber.activeForeground#af85ea
editorLineNumber.foreground#807c9f
invalid.deprecated
editor.selectionHighlightBackground#b8c6d5
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#b8c6d5

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme