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#070A12
  • activityBar.border#070A12
  • activityBar.foreground#3A86FF
  • activityBar.inactiveForeground#979DAC73
  • diffEditor.diagonalFill#979DAC40
  • diffEditor.insertedLineBackground#98C37910
  • diffEditor.insertedTextBackground#98C3791A
  • diffEditor.removedLineBackground#E06C7510
  • diffEditor.removedTextBackground#E06C751A
  • editor.background#0F1423
  • editor.findMatchBackground#E5C07B80
  • editor.findMatchHighlightBackground#E5C07B30
  • editor.findRangeHighlightBackground#E5C07B1A
  • editor.foreground#FDFCDC
  • editor.inactiveSelectionBackground#212A4580
  • editor.lineHighlightBackground#161D33
  • editor.selectionBackground#212A45
  • editor.selectionHighlightBackground#212A45A0
  • editor.wordHighlightBackground#212A45A0
  • editor.wordHighlightStrongBackground#3A86FF30
  • editorBracketMatch.background#3A86FF40
  • editorBracketMatch.border#3A86FFA0
  • editorCursor.foreground#3A86FF
  • editorGroupHeader.tabsBackground#0A0D17
  • editorIndentGuide.activeBackground#979DAC90
  • editorIndentGuide.background#979DAC40
  • editorLineNumber.activeForeground#FDFCDC
  • editorLineNumber.foreground#979DAC90
  • editorWhitespace.foreground#979DAC60
  • focusBorder#3A86FF40
  • foreground#FDFCDC
  • gitDecoration.addedResourceForeground#98C379
  • gitDecoration.conflictingResourceForeground#0A9396
  • gitDecoration.deletedResourceForeground#E06C75
  • gitDecoration.ignoredResourceForeground#979DACB3
  • gitDecoration.modifiedResourceForeground#3A86FF
  • gitDecoration.untrackedResourceForeground#56B6C2
  • list.deemphasizedForeground#979DACB3
  • panel.background#0F1423
  • sideBar.background#0A0D17
  • sideBar.border#0A0D17
  • sideBar.foreground#FDFCDC
  • sideBarSectionHeader.background#0A0D17
  • statusBar.background#05070D
  • statusBar.border#05070D
  • statusBar.debuggingBackground#E5C07B40
  • statusBar.foreground#FDFCDC
  • statusBar.noFolderBackground#05070D
  • tab.activeBackground#0F1423
  • tab.inactiveBackground#0A0D17
  • terminal.ansiBlack#070A12
  • terminal.ansiBlue#3A86FF
  • terminal.ansiBrightBlack#979DAC
  • terminal.ansiBrightBlue#3A86FF
  • terminal.ansiBrightCyan#56B6C2
  • terminal.ansiBrightGreen#98C379
  • terminal.ansiBrightMagenta#0A9396
  • terminal.ansiBrightRed#E06C75
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#E5C07B
  • terminal.ansiCyan#56B6C2
  • terminal.ansiGreen#98C379
  • terminal.ansiMagenta#0A9396
  • terminal.ansiRed#E06C75
  • terminal.ansiWhite#FDFCDC
  • terminal.ansiYellow#E5C07B
  • terminal.background#0F1423
  • terminal.foreground#FDFCDC
  • widget.shadow#00000080

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#979DACitalic
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#FF4D5D
keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.trycatch, keyword.control.return#FF4D5Dbold
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as#FF4D5Ditalic
entity.name.function, meta.function-call, support.function#3A86FF
variable.function, meta.function-call.generic#3A86FF
entity.name.type, entity.name.class, support.class, entity.name.type.class, entity.name.type.struct, entity.name.type.enum#0A9396
entity.name.type.interface, entity.name.type.trait#0A9396italic
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#FDFCDC
variable.parameter, meta.parameter#56B6C2italic
variable.language, variable.parameter.function.language.special.self, variable.parameter.function.language.special.cls#FF4D5Ditalic
variable.other.property, meta.object-literal.key, support.type.property-name#FDFCDC
string, string.quoted, string.template#EE9B00
constant.character.escape, constant.other.placeholder#FF4D5Dbold
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#FF4D5D
support.class.component, entity.name.tag.custom#0A9396bold
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#EE9B00
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#0A9396bold
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css#C678DDitalic
variable.argument.css, variable.css, variable.scss#FDFCDC
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#3A86FFbold
keyword.other.unsafe.rust#E06C75bold
keyword.package.go, keyword.import.go, entity.name.package.go#FF4D5Ditalic
support.type.property-name.json, entity.name.tag.yaml#56B6C2
keyword.other.DML.sql, keyword.other.DDL.sql, keyword.other.sql#FF4D5Dbold
entity.name.type.model.prisma#0A9396bold
keyword.other.dockerfile#FF4D5Dbold
variable.other.normal.shell, support.function.builtin.shell#56B6C2
markup.heading, entity.name.section.markdown#3A86FFbold
markup.quote#0A9396italic
markup.inline.raw, markup.fenced_code.block#EE9B00
markup.underline.link, string.other.link#56B6C2underline