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#F0F0F0
  • activityBar.foreground#1293D8
  • editor.background#F7F7F7
  • editor.findMatchBackground#FFBC5D
  • editor.findMatchHighlightBackground#FFE9A6
  • editor.foreground#000
  • editor.lineHighlightBackground#F0F0F0
  • editor.selectionBackground#BFDBFE
  • editor.selectionHighlightBackground#E0E0E0
  • editorCursor.foreground#1293D8
  • editorGroupHeader.tabsBackground#F0F0F0
  • editorLineNumber.foreground#9DA39A
  • panel.background#F0F0F0
  • sideBar.background#F0F0F0
  • statusBar.background#DDDDDD
  • statusBar.debuggingBackground#FFBC5D
  • statusBar.debuggingForeground#000
  • statusBar.foreground#474747
  • statusBar.noFolderBackground#7A3E9D
  • statusBar.noFolderForeground#fff
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#325CC0
  • terminal.ansiBrightBlack#777777
  • terminal.ansiBrightBlue#1293D8
  • terminal.ansiBrightCyan#00AACB
  • terminal.ansiBrightGreen#60CB00
  • terminal.ansiBrightMagenta#E64CE6
  • terminal.ansiBrightRed#F05050
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#FFBC5D
  • terminal.ansiCyan#0083B2
  • terminal.ansiGreen#448C27
  • terminal.ansiMagenta#7A3E9D
  • terminal.ansiRed#AA3731
  • terminal.ansiWhite#BBBBBB
  • terminal.ansiYellow#CB9000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#b3b1ad
comment#6A737Ditalic
constant.unit#000E16
string, punctuation.definition.string, constant.other.symbol#2aa198
string.regexp, constant.character, constant.other#2aa198
constant.numeric#2aa198
constant.language#2aa198
variable#000E16
variable.member#000E16
variable.language#268bd2italic
storage, constant.type-constructor#b58900
keyword#859900
meta.declaration.module keyword.other#859900
keyword.operator, keyword.other, keyword.pipe, keyword.unused, punctuation#000E16
punctuation.separator, punctuation.terminator#000E16
punctuation.section#000E16
punctuation.accessor#000E16
source.java storage.type, source.haskell storage.type, source.c storage.type#b58900
entity.other.inherited-class#b58900
storage.type.function#000E16
source.java storage.type.primitive#b58900
meta.function.type-declaration#1293D8
entity.name.function.top_level, source.js entity.name.function, source.ts entity.name.function, source.tsx entity.name.function, source.jsx entity.name.function#1293D8
variable.parameter, meta.parameter#000E16
variable.function, variable.annotation, meta.function-call.generic, support.function.go#000E16
meta.function.type-declaration meta.module.name#b58900
support.function, support.macro#000E16
entity.name.import, entity.name.package#2aa198
entity.name.type#b58900
entity.name.record.field#000E16
entity.name.tag, meta.tag.sgml#1293D8
punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag#777
entity.other.attribute-name#2aa198
support.constant#2aa198italic
support.type, source.go storage.type#b58900
support.class#1293D8
meta.decorator variable.other, meta.decorator punctuation.decorator, storage.type.annotation#b58900
invalid#CD3131
meta.diff, meta.diff.header#c594c5
source.ruby variable.other.readwrite#1293D8
source.css entity.name.tag, source.sass entity.name.tag, source.scss entity.name.tag, source.less entity.name.tag, source.stylus entity.name.tag#1293D8
source.css support.type, source.sass support.type, source.scss support.type, source.less support.type, source.stylus support.type#000E16
support.type.property-name#000E16normal
constant.numeric.line-number.find-in-files - match#000E16
constant.numeric.line-number.match#268bd2
entity.name.filename.find-in-files#2aa198
message.error#CD3131
markup.heading, markup.heading entity.name#2aa198bold
markup.underline.link, string.other.link#268bd2
markup.italic#f07178italic
markup.bold#f07178bold
markup.italic markup.bold, markup.bold markup.italicbold italic
markup.raw
markup.raw.inline
meta.separator#000E16bold
markup.quote#2aa198italic
markup.list punctuation.definition.list.begin#1293D8
markup.inserted#2aa198
markup.changed#1293D8
markup.deleted#d96c75
markup.strike#e6b673
markup.table#1293D8
text.html.markdown markup.inline.raw#FF66BB
text.html.markdown meta.dummy.line-break#626a73
punctuation.definition.markdown#626a73

Shiki preview

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

Loading...

Azure Color Theme - Coding Theme