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#16161E
  • activityBar.border#101014
  • activityBar.foreground#C0CAF5
  • activityBar.inactiveForeground#3B4261
  • activityBarBadge.background#E0AF68
  • activityBarBadge.foreground#16161E
  • badge.background#E0AF68
  • badge.foreground#16161E
  • button.background#E0AF68
  • button.foreground#16161E
  • diffEditor.insertedTextBackground#9ECE6A15
  • diffEditor.removedTextBackground#F7768E15
  • editor.background#1A1B26
  • editor.findMatchBackground#E0AF6840
  • editor.foreground#C0CAF5
  • editor.hoverHighlightBackground#E0AF6822
  • editor.lineHighlightBackground#1F213222
  • editor.selectionBackground#364A82
  • editor.wordHighlightBackground#7AA2F720
  • editorBracketMatch.background#E0AF6825
  • editorBracketMatch.border#E0AF68
  • editorCursor.foreground#E0AF68
  • editorGroupHeader.tabsBackground#16161E
  • editorGutter.addedBackground#9ECE6A
  • editorGutter.background#1A1B26
  • editorGutter.deletedBackground#F7768E
  • editorGutter.modifiedBackground#E0AF68
  • editorIndentGuide.background#1F213288
  • editorLineNumber.activeForeground#737AA2
  • editorLineNumber.foreground#3B4261
  • editorLink.activeForeground#7AA2F7
  • editorRuler.foreground#1F2132
  • editorSuggestWidget.foreground#C0CAF5
  • editorSuggestWidget.highlightForeground#E0AF68
  • editorSuggestWidget.selectedBackground#283457
  • focusBorder#E0AF68
  • foreground#A9B1D6
  • gitDecoration.addedResourceForeground#9ECE6A
  • gitDecoration.deletedResourceForeground#F7768E
  • gitDecoration.ignoredResourceForeground#3B4261
  • gitDecoration.modifiedResourceForeground#7AA2F7
  • input.background#101014
  • input.border#3B4261
  • input.foreground#C0CAF5
  • list.activeSelectionBackground#283457
  • list.activeSelectionForeground#C0CAF5
  • list.highlightForeground#E0AF68
  • list.hoverBackground#1F2132
  • menu.background#16161E
  • menu.border#101014
  • menu.foreground#A9B1D6
  • menu.selectionBackground#283457
  • panel.background#16161E
  • panel.border#101014
  • panelTitle.activeBorder#E0AF68
  • panelTitle.activeForeground#C0CAF5
  • peekViewEditor.background#101014
  • peekViewResult.background#16161E
  • peekViewTitle.background#101014
  • scrollbarSlider.background#3B426180
  • sideBar.background#16161E
  • sideBar.border#101014
  • sideBar.foreground#A9B1D6
  • sideBarSectionHeader.background#16161E
  • sideBarSectionHeader.border#101014
  • sideBarTitle.foreground#3B4261
  • statusBar.background#16161E
  • statusBar.border#101014
  • statusBar.foreground#A9B1D6
  • statusBarItem.remoteBackground#E0AF68
  • statusBarItem.remoteForeground#16161E
  • tab.activeBackground#1A1B26
  • tab.activeBorderTop#E0AF68
  • tab.activeForeground#C0CAF5
  • tab.border#101014
  • tab.inactiveBackground#16161E
  • tab.inactiveForeground#3B4261
  • terminal.ansiBlack#1D202F
  • terminal.ansiBlue#7AA2F7
  • terminal.ansiBrightBlack#414868
  • terminal.ansiBrightWhite#C0CAF5
  • terminal.ansiCyan#7DCFFF
  • terminal.ansiGreen#9ECE6A
  • terminal.ansiMagenta#BB9AF7
  • terminal.ansiRed#F7768E
  • terminal.ansiWhite#A9B1D6
  • terminal.ansiYellow#E0AF68
  • terminal.background#16161E
  • terminal.foreground#A9B1D6
  • terminal.selectionBackground#364A82
  • titleBar.activeBackground#16161E
  • titleBar.activeForeground#A9B1D6
  • titleBar.border#101014
  • widget.shadow#00000060

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment.block, comment.line, punctuation.definition.comment#414868italic
string, string.quoted, string.quoted.single, string.quoted.double, punctuation.definition.string#9ECE6A—
constant.character.escape#9ECE6A—
constant.numeric#E0AF68—
constant.language#E0AF68italic
constant.character, constant.other#E0AF68—
keyword.other.table.al, keyword.other.page.al, keyword.other.codeunit.al, keyword.other.report.al, keyword.other.xmlport.al, keyword.other.enum.al, keyword.other.interface.al, keyword.other.permissionset.al, keyword.other.object.al, storage.type.object.al, keyword.other.query.al, keyword.other.controladdin.al, keyword.other.entitlement.al, keyword.other.profile.al, keyword.other.requestpage.al#BB9AF7bold
keyword.other.tableextension.al, keyword.other.pageextension.al, keyword.other.reportextension.al, keyword.other.enumextension.al, keyword.other.interfaceextension.al, keyword.other.permissionsetextension.al#BB9AF7bold italic
entity.name.type.al, entity.name.class.al, entity.name.object.al#9ECE6Abold
entity.name.function.al, meta.function.al entity.name.function#7AA2F7bold
entity.name.function.trigger.al, entity.name.trigger.al, support.function.trigger.al#7DCFFFitalic
keyword.other.event.al, storage.type.event.al, keyword.other.eventsubscriber.al#7DCFFFbold italic
entity.name.field.al, variable.other.field.al#73DACA—
support.type.property-name.al, entity.other.attribute-name.al#A9B1D6—
variable.language.rec.al, variable.other.rec.al, variable.language.al#9ECE6Abold
support.type.al, storage.type.primitive.al#FF9E64—
constant.other.enum.al, variable.other.enummember.al#E0AF68—
storage.modifier.al, keyword.other.local.al#BB9AF7italic
keyword, keyword.control, keyword.other, storage.type, storage.modifier#BB9AF7—
keyword.operator#89DDFF—
keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.logical, keyword.operator.comparison, keyword.operator.relational#89DDFF—
punctuation#3B4261—
variable.other#C0CAF5—
variable.language.this#9ECE6A—
variable.parameter#F7768E—
entity.name.function, support.function.any-method, variable.function#7AA2F7bold
support.function#7AA2F7—
entity.name.type, entity.name.class, support.class, entity.other.inherited-class#FF9E64—
entity.other.attribute-name#A9B1D6—
support.type.property-name.json#BB9AF7—
entity.name.tag.yaml#BB9AF7—
entity.name.tag#BB9AF7—
entity.name.namespace, entity.name.module#FF9E64—
invalid#F87171underline
markup.heading#BB9AF7bold
markup.underline.link#7AA2F7—
markup.bold—bold
markup.italic—italic
ALchemy by Yahya Touil - VS Code Theme