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#FAFCFF
  • activityBar.border#00000015
  • activityBar.foreground#255A93
  • activityBar.inactiveForeground#0d142160
  • activityBarBadge.background#255A93
  • activityBarBadge.foreground#FAFCFF
  • button.background#255A93
  • button.foreground#FAFCFF
  • button.hoverBackground#255A93dd
  • editor.background#FAFCFF
  • editor.foreground#0d1421
  • editor.inactiveSelectionBackground#2141832580
  • editor.lineHighlightBackground#F4F7FA50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#21418325
  • editorCursor.foreground#255A93
  • editorGroupHeader.tabsBackground#F4F7FAaa
  • editorLineNumber.activeForeground#255A93
  • editorLineNumber.foreground#d9dee680
  • focusBorder#255A93
  • foreground#0d1421
  • input.background#F4F7FA
  • input.border#00000015
  • input.foreground#0d1421
  • input.placeholderForeground#0d142160
  • list.activeSelectionBackground#255A9330
  • list.activeSelectionForeground#0d1421
  • list.highlightForeground#255A93
  • list.hoverBackground#F4F7FA40
  • list.hoverForeground#0d1421
  • list.inactiveSelectionBackground#255A9315
  • list.inactiveSelectionForeground#0d1421
  • selection.background#21418325
  • sideBar.background#F4F7FA
  • sideBar.border#00000015
  • sideBar.foreground#0d1421
  • sideBarSectionHeader.background#F4F7FA80
  • sideBarSectionHeader.foreground#0d1421
  • sideBarTitle.foreground#255A93
  • statusBar.background#FAFCFF
  • statusBar.border#00000015
  • statusBar.foreground#0d1421
  • statusBar.noFolderBackground#FAFCFF
  • tab.activeBackground#FAFCFF
  • tab.activeBorderTop#255A93
  • tab.activeForeground#0d1421
  • tab.border#00000015
  • tab.inactiveBackground#FAFCFF60
  • tab.inactiveForeground#0d142180
  • terminal.ansiBlack#0d1421
  • terminal.ansiBlue#214183
  • terminal.ansiCyan#295CA3
  • terminal.ansiGreen#255A93
  • terminal.ansiMagenta#193E76
  • terminal.ansiRed#193E76
  • terminal.ansiWhite#0d1421
  • terminal.ansiYellow#295CA3
  • terminal.background#FAFCFF
  • terminal.foreground#0d1421
  • titleBar.activeBackground#FAFCFF
  • titleBar.activeForeground#0d1421
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FAFCFF
  • titleBar.inactiveForeground#0d142160
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#d9dee6italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#214183bold
storage.type, storage.modifier#214183italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#255A93
string, punctuation.definition.string, string.template, meta.template.expression#295CA3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#193E76
variable, variable.other.readwrite, variable.other.object#0d1421
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0d1421
variable.parameter, meta.parameter#0d1421dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0d142180
keyword.operator#0d1421
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#295CA3bold
entity.other.inherited-class#255A93
entity.name.tag, punctuation.definition.tag#214183
entity.other.attribute-name#255A93
meta.diff, meta.diff.header#d9dee6
markup.deleted#193E76
markup.inserted#255A93
markup.changed#295CA3
markup.heading, markup.heading.setext, punctuation.definition.heading#255A93bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#295CA3
string.other.link.title, string.other.link.description#255A93
markup.underline.link#d9dee6underline
punctuation.definition.list#214183
markup.quote, punctuation.definition.quote#d9dee6italic
Morphous Theme by Ameyanagi - VS Code Theme