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#e0e0e0
  • activityBar.foreground#333333
  • activityBar.inactiveForeground#666666
  • editor.background#f9f9f9
  • editor.findMatchBackground#0098dd
  • editor.foreground#383a42
  • editor.selectionBackground#d5d5d5
  • editorCursor.background#0098dd
  • editorCursor.foreground#383a42
  • editorGroup.border#cfcfcf
  • editorGutter.background#f9f9f9
  • editorLineNumber.activeForeground#a0a1a7
  • editorLineNumber.foreground#a0a1a7
  • inlineChatInput.background#dbdbdb
  • inlineChatInput.foreground#24262b
  • inlineChatInput.placeholderForeground#0098dd
  • input.background#dbdbdb
  • input.foreground#24262b
  • input.placeholderForeground#0098dd
  • panel.background#f9f9f9
  • sideBar.background#e0e0e0
  • statusBar.background#e7e7e7
  • statusBar.foreground#383a42
  • statusBar.noFolderBackground#e0e0e0
  • statusBarItem.remoteBackground#e7e7e7
  • statusBarItem.remoteForeground#383a42

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#0098dd
comment#a0a1a7
markup.heading#c5a332
entity.name.tag#7a82da
entity.name.tag#0098dd
comment#a0a1a7
markup.underline.link#0098dd
keyword#a05a48
markup.fenced_code, markup.inline.raw#a05a48
markup.list#d52753
invalid#d52753
keyword#df631c
keyword#c5a332
invalid.deprecated#df631c
invalid.deprecated
markup.inserted#23974a
markup.inserted#1c783b
comment#823ff1
comment#0098dd
comment#df631c
comment#23974a
comment#ce33c0
keyword#33c0ce
gitDecoration.addedResourceForeground#23974a
gitDecoration.untrackedResourceForeground#c5a332
gitDecoration.ignoredResourceForeground#a0a1a7
gitDecoration.renamedResourceForeground#c5a332
gitDecoration.modifiedResourceForeground#823ff1
breadcrumb.foreground, tree.tableColumnHeader.foreground#c5a332
explorer.fileForeground#383a42
explorer.directoryForeground#383a42
comment.documentation#696969
editorSuggestWidget.highlightForeground#0098dd
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#383a42
invalid#FF0000
invalid#23974a
invalid#d52753
invalid#d52753
invalid#23974a
invalid, invalid.deprecated#df631c
invalid#d52753
invalid.deprecated#df631c
invalid#d52753
invalid#d52753
invalid.deprecated#df631c
invalid#d52753
invalid.deprecated#df631c
invalid#d52753
entity.name.type#0098dd
variable#B22222
entity.name.function#00008B
constant#FF1493
string#CD0000
comment.documentation#a0a1a7
diffEditor.insertedTextBackground#23974a
diffEditor.removedTextBackground#d52753
invalid#FF0000
entity.name.function#33c0ce
diff.insertedTextBackground#23974a
diff.removedTextBackground#d52753
meta.diff.header.file#0098dd
meta.diff.header#33c0ce
invalid.deprecated#d52753
invalid.deprecated#df631c
entity.name.function#40B8C5
invalid.deprecated#df631c
string#00008B
invalid.deprecated#df631c
invalid#d52753
invalid.deprecated#df631c
invalid#d52753
variable#23974a
variable#ce33c0
variable#a0a1a7
comment#a0a1a7
comment#383a42
comment.documentation#23974a
editor.findMatchBackground#23974a
editor.findMatchHighlightBackground#f1f1f1
editor.findMatchBackground, editor.findMatchHighlightBackground#f1f1f1
string.regexp#7a82da
string.regexp#7a82da
string.regexp#c5a332
meta.preprocessor, keyword.control.import#7a82da
invalid.deprecated#df631c
invalid.deprecated#df631c
constant, constant.language, support.constant#823ff1
constant#823ff1
storage.type, support.type, entity.name.type#d52753
entity.name.type#d52753
variable#40B8C5
variable, variable.other#40B8C5
variable#40B8C5
entity.name.function#23974a
entity.name.function, support.function#23974a
entity.name.function#23974a
support.function, support.class, support.type#23974a
keyword, storage, keyword.control, storage.modifier#0098dd
keyword#0098dd
comment.documentation#823ff1
comment.documentation, comment.block.documentation#c5a332
comment.documentation#c5a332
string, string.quoted, string.template#c5a332
string#c5a332
comment, punctuation.definition.comment#a0a1a7
comment#a0a1a7
comment, punctuation.definition.comment#a0a1a7
comment#a0a1a7
invalid#f1f1f1
invalid
invalid.illegal#f1f1f1
editor.wordHighlightStrongBackground#d52753
invalid.deprecated#df631c
invalid.illegal#d52753
editorCursor.foreground
editorGutter.background#9ca0a4
editorGroup.border#cfcfcf
editorGroupHeader.tabsBackground#383a42
statusBar.noFolderBackground#968cb3
statusBar.background, statusBar.foreground#383a42
editorLineNumber.activeForeground
editorLineNumber.activeForeground#a0a1a7
editorLineNumber.foreground#a0a1a7
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#f1f1f1

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme