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#150a13
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#130911
  • editor.findMatchBackground#304477
  • editor.foreground#d0d0d0
  • editor.selectionBackground#3f2f40
  • editorCursor.background#f0af7f
  • editorCursor.foreground#d0d0d0
  • editorGroup.border#4d4a4b
  • editorGutter.background#130911
  • editorLineNumber.activeForeground#4fbaef
  • editorLineNumber.foreground#857f8f
  • inlineChatInput.background#150a12
  • inlineChatInput.foreground#d0d0d0
  • inlineChatInput.placeholderForeground#4fbaef
  • input.background#150a12
  • input.foreground#d0d0d0
  • input.placeholderForeground#4fbaef
  • panel.background#130911
  • sideBar.background#150a13
  • statusBar.background#583435
  • statusBar.foreground#ffe5f0
  • statusBar.noFolderBackground#372d32
  • statusBarItem.remoteBackground#583435
  • statusBarItem.remoteForeground#ffe5f0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#857f8f
comment#cf9f8f
entity.name.tag#857f8f
entity.name.tag#00a692
comment#857f8f
markup.underline.link#89afef
keyword#857f8f
markup.fenced_code, markup.inline.raw
markup.list#857f8f
invalid#ff7355
keyword#bf9032
keyword#6aad0f
invalid.deprecated#bf9032
invalid.deprecated
markup.inserted#a0e0a0
markup.inserted#a0e0a0
comment#857f8f
comment#6aad0f
comment#857f8f
comment#4fbaef
comment#d1843f
comment#4fbaef
keyword#6aad0f
gitDecoration.addedResourceForeground#0faa26
gitDecoration.untrackedResourceForeground#0faa26
gitDecoration.ignoredResourceForeground#857f8f
gitDecoration.modifiedResourceForeground#bf9032
breadcrumb.foreground, tree.tableColumnHeader.foreground#4fbaef
explorer.fileForeground#d0d0d0
explorer.directoryForeground#4fbaef
comment.documentation#696969
editorSuggestWidget.highlightForeground#4fbaef
editorSuggestWidget.selectedBackground
editorSuggestWidget.background
invalid#FF0000
invalid#af85ff
invalid#00a692
invalid#00a692
invalid#0faa26
invalid, invalid.deprecated#bf9032
invalid#ff7355
invalid.deprecated#bf9032
invalid#ff7355
invalid#ff7355
invalid.deprecated#bf9032
invalid#ffa9bf
invalid.deprecated#F3EA98
invalid#FC5C94
entity.name.type#6aad0f
variable#6a9fff
entity.name.function#af85ff
constant#1dbfcf
string#df8a5a
comment.documentation#857f8f
diffEditor.insertedTextBackground#a0e0a0
diffEditor.removedTextBackground#ffbfbf
invalid#ff7355
entity.name.function
diff.insertedTextBackground#a0e0a0
diff.removedTextBackground#ffbfbf
invalid.deprecated#ff7355
invalid.deprecated#bf9032
entity.name.function#bf9032
invalid.deprecated#bf9032
string#df8a5a
invalid.deprecated#bf9032
invalid#ff7355
invalid.deprecated#bf9032
invalid#ff7355
variable#6a9fff
variable#857f8f
comment#857f8f
comment#857f8f
comment.documentation#cf9f8f
entity.name.function#bf9032
editor.findMatchBackground#d0d0d0
editor.findMatchHighlightBackground#d0d0d0
editor.findMatchBackground, editor.findMatchHighlightBackground#d0d0d0
string.regexp#ef6360
string.regexp#d369af
string.regexp#df8a5a
meta.preprocessor, keyword.control.import#ef6360
invalid.deprecated#bf9032
invalid.deprecated#bf9032
constant, constant.language, support.constant#1dbfcf
constant#1dbfcf
storage.type, support.type, entity.name.type#00a692
entity.name.type#00a692
variable#7a94df
variable, variable.other#6a9fff
variable#6a9fff
entity.name.function#c58faf
entity.name.function, support.function#af85ff
entity.name.function#af85ff
support.function, support.class, support.type#3f95f6
keyword, storage, keyword.control, storage.modifier#6aad0f
keyword#6aad0f
comment.documentation#c58faf
comment.documentation, comment.block.documentation#cf9f8f
comment.documentation#cf9f8f
string, string.quoted, string.template#df8a5a
string#df8a5a
comment, punctuation.definition.comment#857f8f
comment#857f8f
comment, punctuation.definition.comment#857f8f
comment#857f8f
invalid#d0d0d0
invalid#ff7355
invalid.illegal#ff7355
editor.wordHighlightStrongBackground#d0d0d0
invalid.deprecated#bf9032
invalid.illegal#ff7355
editorCursor.foreground
editorGutter.background#d0d0d0
editorGroup.border#4d4a4b
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#857f8f
statusBar.background, statusBar.foreground#ffe5f0
editorLineNumber.activeForeground#4fbaef
editorLineNumber.activeForeground#4fbaef
editorLineNumber.foreground#857f8f
invalid.deprecated
editor.selectionHighlightBackground#d0d0d0
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#d0d0d0

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme