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#2f2e2b
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#2b2a27
  • editor.findMatchBackground#ff5d38
  • editor.foreground#ede0ce
  • editor.selectionBackground#403f3e
  • editorCursor.background#ff5d38
  • editorCursor.foreground#ede0ce
  • editorGroup.border#403f3c
  • editorGutter.background#2b2a27
  • editorLineNumber.activeForeground#9ca0a4
  • editorLineNumber.foreground#3f444a
  • inlineChatInput.background#2e2d2a
  • inlineChatInput.foreground#ffffed
  • inlineChatInput.placeholderForeground#ff5d38
  • input.background#2e2d2a
  • input.foreground#ffffed
  • input.placeholderForeground#ff5d38
  • panel.background#2b2a27
  • sideBar.background#2f2e2b
  • statusBar.background#1b1b1a
  • statusBar.foreground#ede0ce
  • statusBar.noFolderBackground#262523
  • statusBarItem.remoteBackground#1b1b1a
  • statusBarItem.remoteForeground#ede0ce

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#26a6a6
comment#5B6268
markup.heading#ff5d38
entity.name.tag#5B6268
entity.name.tag#26a6a6
comment#5B6268
markup.underline.link#c678dd
keyword#f8f8f0
markup.fenced_code, markup.inline.raw
markup.list#ff5d38
invalid#ff5d38
keyword#bcd42a
keyword#bcd42a
invalid.deprecated#bcd42a
invalid.deprecated
markup.inserted#98be65
markup.inserted#799850
comment#a9a1e1
comment#26a6a6
comment#cb4b16
comment#98be65
comment#c678dd
keyword#46D9FF
gitDecoration.addedResourceForeground#98be65
gitDecoration.untrackedResourceForeground#83898d
gitDecoration.ignoredResourceForeground#5B6268
gitDecoration.renamedResourceForeground#83898d
gitDecoration.modifiedResourceForeground#a9a1e1
breadcrumb.foreground, tree.tableColumnHeader.foreground#bcd42a
explorer.fileForeground#ede0ce
explorer.directoryForeground#ede0ce
comment.documentation#696969
editorSuggestWidget.highlightForeground#ff5d38
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#ede0ce
invalid#FF0000
invalid#bcd42a
invalid#f8f8f0
invalid#f8f8f0
invalid#98be65
invalid, invalid.deprecated#bcd42a
invalid#ff5d38
invalid.deprecated#bcd42a
invalid#ff5d38
invalid#ff5d38
invalid.deprecated#bcd42a
invalid#ff5d38
invalid.deprecated#bcd42a
invalid#ff5d38
entity.name.type#26a6a6
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#5B6268
diffEditor.insertedTextBackground#98be65
diffEditor.removedTextBackground#ff5d38
invalid#FF0000
entity.name.function#46D9FF
diff.insertedTextBackground#98be65
diff.removedTextBackground#ff5d38
meta.diff.header.file#51afef
meta.diff.header#46D9FF
invalid.deprecated#ff5d38
invalid.deprecated#bcd42a
entity.name.function#f8f8f0
invalid.deprecated#bcd42a
string#FFFFE0
invalid.deprecated#bcd42a
invalid#ff5d38
invalid.deprecated#bcd42a
invalid#ff5d38
variable#98be65
variable#c678dd
variable#3f444a
comment#3f444a
comment#ede0ce
comment.documentation#98be65
editor.findMatchBackground#98be65
editor.findMatchHighlightBackground#DFDFDF
editor.findMatchBackground, editor.findMatchHighlightBackground#DFDFDF
string.regexp#ff5d38
string.regexp#ff5d38
string.regexp#bcd42a
meta.preprocessor, keyword.control.import#ff5d38
invalid.deprecated#bcd42a
invalid.deprecated#bcd42a
constant, constant.language, support.constant#ff5d38
constant#ff5d38
storage.type, support.type, entity.name.type#f8f8f0
entity.name.type#f8f8f0
variable#f8f8f0
variable, variable.other#f8f8f0
variable#f8f8f0
entity.name.function#bcd42a
entity.name.function, support.function#bcd42a
entity.name.function#bcd42a
support.function, support.class, support.type#ff5d38
keyword, storage, keyword.control, storage.modifier#26a6a6
keyword#26a6a6
comment.documentation#ff5d38
comment.documentation, comment.block.documentation#83898d
comment.documentation#83898d
string, string.quoted, string.template#bcd42a
string#bcd42a
comment, punctuation.definition.comment#5B6268
comment#5B6268
comment, punctuation.definition.comment#5B6268
comment#5B6268
invalid#2b2a27
invalid
invalid.illegal#2b2a27
editor.wordHighlightStrongBackground#ff5d38
invalid.deprecated#bcd42a
invalid.illegal#ff5d38
editorCursor.foreground
editorGutter.background#3f444a
editorGroup.border#403f3c
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#545668
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#9ca0a4
editorLineNumber.foreground#3f444a
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#2b2a27

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme