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#1E2227
  • activityBar.border#1E2227
  • activityBar.foreground#A0E1E5
  • activityBar.inactiveForeground#A6B1E173
  • diffEditor.diagonalFill#A6B1E140
  • diffEditor.insertedLineBackground#98C37910
  • diffEditor.insertedTextBackground#98C3791A
  • diffEditor.removedLineBackground#E06C7510
  • diffEditor.removedTextBackground#E06C751A
  • editor.background#282C34
  • editor.findMatchBackground#E5C07B80
  • editor.findMatchHighlightBackground#E5C07B30
  • editor.findRangeHighlightBackground#E5C07B1A
  • editor.foreground#DFE0DF
  • editor.inactiveSelectionBackground#3E445180
  • editor.lineHighlightBackground#2F333D
  • editor.selectionBackground#3E4451
  • editor.selectionHighlightBackground#3E4451A0
  • editor.wordHighlightBackground#3E4451A0
  • editor.wordHighlightStrongBackground#A0E1E530
  • editorBracketMatch.background#A0E1E540
  • editorBracketMatch.border#A0E1E5A0
  • editorCursor.foreground#A0E1E5
  • editorGroupHeader.tabsBackground#21252B
  • editorIndentGuide.activeBackground#A6B1E190
  • editorIndentGuide.background#A6B1E140
  • editorLineNumber.activeForeground#DFE0DF
  • editorLineNumber.foreground#A6B1E190
  • editorWhitespace.foreground#A6B1E160
  • focusBorder#A0E1E540
  • foreground#DFE0DF
  • gitDecoration.addedResourceForeground#98C379
  • gitDecoration.conflictingResourceForeground#C77DFF
  • gitDecoration.deletedResourceForeground#E06C75
  • gitDecoration.ignoredResourceForeground#A6B1E1B3
  • gitDecoration.modifiedResourceForeground#A0E1E5
  • gitDecoration.untrackedResourceForeground#56B6C2
  • list.deemphasizedForeground#A6B1E1B3
  • panel.background#282C34
  • sideBar.background#21252B
  • sideBar.border#21252B
  • sideBar.foreground#DFE0DF
  • sideBarSectionHeader.background#21252B
  • statusBar.background#181A1F
  • statusBar.border#181A1F
  • statusBar.debuggingBackground#E5C07B40
  • statusBar.foreground#DFE0DF
  • statusBar.noFolderBackground#181A1F
  • tab.activeBackground#282C34
  • tab.inactiveBackground#21252B
  • terminal.ansiBlack#1E2227
  • terminal.ansiBlue#A0E1E5
  • terminal.ansiBrightBlack#A6B1E1
  • terminal.ansiBrightBlue#A0E1E5
  • terminal.ansiBrightCyan#56B6C2
  • terminal.ansiBrightGreen#98C379
  • terminal.ansiBrightMagenta#C77DFF
  • terminal.ansiBrightRed#E06C75
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#E5C07B
  • terminal.ansiCyan#56B6C2
  • terminal.ansiGreen#98C379
  • terminal.ansiMagenta#C77DFF
  • terminal.ansiRed#E06C75
  • terminal.ansiWhite#DFE0DF
  • terminal.ansiYellow#E5C07B
  • terminal.background#282C34
  • terminal.foreground#DFE0DF
  • widget.shadow#00000080

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#A6B1E1italic
comment.keyword.todo, comment.line.todo#D19A66bold
comment.keyword.fixme, comment.line.fixme#E06C75bold underline
comment.keyword.note, comment.line.note#61AFEFbold
comment.keyword.warning, comment.line.warning#E5C07Bbold
comment.keyword.hack, comment.line.hack#C678DDbold
punctuation, meta.brace, meta.delimiter#ABB2BFD9
keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.logical, keyword.operator.comparison#ABB2BFD9
keyword, storage, storage.type#FFA6C9
keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.trycatch, keyword.control.return#FFA6C9bold
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as#FFA6C9italic
entity.name.function, meta.function-call, support.function#A0E1E5
variable.function, meta.function-call.generic#A0E1E5
entity.name.type, entity.name.class, support.class, entity.name.type.class, entity.name.type.struct, entity.name.type.enum#C77DFF
entity.name.type.interface, entity.name.type.trait#C77DFFitalic
support.type.primitive, support.type.builtin, storage.type.numeric.go, storage.type.boolean.go, storage.type.string.go#56B6C2
variable, variable.other.readwrite, variable.other.object#DFE0DF
variable.parameter, meta.parameter#56B6C2italic
variable.language, variable.parameter.function.language.special.self, variable.parameter.function.language.special.cls#FFA6C9italic
variable.other.property, meta.object-literal.key, support.type.property-name#DFE0DF
string, string.quoted, string.template#B4F8C8
constant.character.escape, constant.other.placeholder#FFA6C9bold
constant.numeric, keyword.other.unit#D19A66
constant.language, constant.language.boolean, constant.language.null, constant.language.undefined#D19A66bold
variable.other.constant, entity.name.constant#E5C07Bbold
entity.name.tag, entity.name.tag.html, entity.name.tag.xml, entity.name.tag.js, entity.name.tag.jsx, entity.name.tag.tsx#FFA6C9
support.class.component, entity.name.tag.custom#C77DFFbold
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.jsx, entity.other.attribute-name.tsx#56B6C2italic
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#ABB2BFD9
support.type.property-name.css, support.type.property-name.scss, support.type.property-name.less#56B6C2
support.constant.property-value.css, meta.property-value.css, support.constant.color#B4F8C8
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#C77DFFbold
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css#C678DDitalic
variable.argument.css, variable.css, variable.scss#DFE0DF
meta.function.decorator.python, entity.name.function.decorator.python#C678DDitalic
support.function.builtin.python#56B6C2
entity.name.type.lifetime.rust, storage.modifier.lifetime.rust#E5C07Bitalic
support.macro.rust, entity.name.function.macro.rust#A0E1E5bold
keyword.other.unsafe.rust#E06C75bold
keyword.package.go, keyword.import.go, entity.name.package.go#FFA6C9italic
support.type.property-name.json, entity.name.tag.yaml#56B6C2
keyword.other.DML.sql, keyword.other.DDL.sql, keyword.other.sql#FFA6C9bold
entity.name.type.model.prisma#C77DFFbold
keyword.other.dockerfile#FFA6C9bold
variable.other.normal.shell, support.function.builtin.shell#56B6C2
markup.heading, entity.name.section.markdown#A0E1E5bold
markup.quote#C77DFFitalic
markup.inline.raw, markup.fenced_code.block#B4F8C8
markup.underline.link, string.other.link#56B6C2underline