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#2c2f38
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#282b33
  • editor.findMatchBackground#819cd6
  • editor.foreground#c6c6c6
  • editor.selectionBackground#41454b
  • editorCursor.background#819cd6
  • editorCursor.foreground#c6c6c6
  • editorGroup.border#141519
  • editorGutter.background#282b33
  • editorLineNumber.activeForeground#c6c6c6
  • editorLineNumber.foreground#515462
  • inlineChatInput.background#2b2e37
  • inlineChatInput.foreground#ffffff
  • inlineChatInput.placeholderForeground#819cd6
  • input.background#2b2e37
  • input.foreground#ffffff
  • input.placeholderForeground#819cd6
  • panel.background#282b33
  • sideBar.background#2c2f38
  • statusBar.background#24262d
  • statusBar.foreground#dadada
  • statusBar.noFolderBackground#282b33
  • statusBarItem.remoteBackground#24262d
  • statusBarItem.remoteForeground#dadada

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#819cd6
comment#6e7899
markup.heading#e1c1ee
entity.name.tag#888395
entity.name.tag#819cd6
comment#6e7899
markup.underline.link#7ebebd
keyword#b0a2e7
markup.fenced_code, markup.inline.raw
markup.list#e1c1ee
invalid#e1c1ee
keyword#cfcf9c
keyword#5b94ab
invalid.deprecated#cfcf9c
invalid.deprecated
markup.inserted#5b94ab
markup.inserted#487688
comment#b0a2e7
comment#819cd6
comment#a6c1e0
comment#5b94ab
comment#a6c1e0
keyword#7289bc
gitDecoration.addedResourceForeground#5b94ab
gitDecoration.untrackedResourceForeground#9299b2
gitDecoration.ignoredResourceForeground#6e7899
gitDecoration.renamedResourceForeground#9299b2
gitDecoration.modifiedResourceForeground#b0a2e7
breadcrumb.foreground, tree.tableColumnHeader.foreground#5b94ab
explorer.fileForeground#c6c6c6
explorer.directoryForeground#c6c6c6
comment.documentation#696969
editorSuggestWidget.highlightForeground#819cd6
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#c6c6c6
invalid#FF0000
invalid#7ebebd
invalid#b0a2e7
invalid#b0a2e7
invalid#5b94ab
invalid, invalid.deprecated#cfcf9c
invalid#e1c1ee
invalid.deprecated#cfcf9c
invalid#e1c1ee
invalid#e1c1ee
invalid.deprecated#cfcf9c
invalid#e1c1ee
invalid.deprecated#cfcf9c
invalid#e1c1ee
entity.name.type#819cd6
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#6e7899
diffEditor.insertedTextBackground#5b94ab
diffEditor.removedTextBackground#e1c1ee
invalid#FF0000
entity.name.function#7289bc
diff.insertedTextBackground#5b94ab
diff.removedTextBackground#e1c1ee
meta.diff.header.file#819cd6
meta.diff.header#7289bc
invalid.deprecated#e1c1ee
invalid.deprecated#cfcf9c
entity.name.function#a6c1e0
invalid.deprecated#cfcf9c
string#FFFFE0
invalid.deprecated#cfcf9c
invalid#e1c1ee
invalid.deprecated#cfcf9c
invalid#e1c1ee
variable#5b94ab
variable#a6c1e0
variable#515462
comment#515462
comment#c6c6c6
comment.documentation#5b94ab
editor.findMatchBackground#5b94ab
editor.findMatchHighlightBackground#eceff4
editor.findMatchBackground, editor.findMatchHighlightBackground#eceff4
string.regexp#819cd6
string.regexp#819cd6
string.regexp#5b94ab
meta.preprocessor, keyword.control.import#819cd6
invalid.deprecated#cfcf9c
invalid.deprecated#cfcf9c
constant, constant.language, support.constant#a6c1e0
constant#a6c1e0
storage.type, support.type, entity.name.type#b0a2e7
entity.name.type#b0a2e7
variable#a6c1e0
variable, variable.other#a6c1e0
variable#a6c1e0
entity.name.function#7ebebd
entity.name.function, support.function#7ebebd
entity.name.function#7ebebd
support.function, support.class, support.type#7ebebd
keyword, storage, keyword.control, storage.modifier#819cd6
keyword#819cd6
comment.documentation#a6c1e0
comment.documentation, comment.block.documentation#9299b2
comment.documentation#9299b2
string, string.quoted, string.template#5b94ab
string#5b94ab
comment, punctuation.definition.comment#6e7899
comment#6e7899
comment, punctuation.definition.comment#6e7899
comment#6e7899
invalid#222228
invalid
invalid.illegal#e1c1ee
editor.wordHighlightStrongBackground#7ebebd
invalid.deprecated#cfcf9c
invalid.illegal#e1c1ee
editorCursor.foreground
editorGutter.background#515462
editorGroup.border#141519
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#888395
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#c6c6c6
editorLineNumber.foreground#515462
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#222228

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme