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#EFEFEF
  • activityBar.foreground#494B52
  • activityBar.inactiveForeground#9D9D9F
  • activityBarBadge.background#526FFF
  • activityBarBadge.foreground#FFF
  • badge.background#526FFF
  • badge.foreground#FFF
  • button.background#526FFF
  • button.foreground#FFF
  • editor.background#FAFAFA
  • editor.foreground#383A42
  • editor.hoverHighlightBackground#526FFF15
  • editor.lineHighlightBackground#E5E5E6
  • editor.selectionBackground#CDD2E0
  • editor.wordHighlightBackground#526FFF15
  • editorBracketMatch.background#526FFF20
  • editorBracketMatch.border#526FFF
  • editorCursor.foreground#526FFF
  • editorGroupHeader.tabsBackground#EFEFEF
  • editorGutter.addedBackground#50A14F
  • editorGutter.background#FAFAFA
  • editorGutter.deletedBackground#E45649
  • editorGutter.modifiedBackground#C18401
  • editorIndentGuide.background#E5E5E6
  • editorLineNumber.activeForeground#383A42
  • editorLineNumber.foreground#9D9D9F
  • editorRuler.foreground#E5E5E6
  • editorSuggestWidget.foreground#383A42
  • editorSuggestWidget.highlightForeground#526FFF
  • editorSuggestWidget.selectedBackground#D0D5E3
  • focusBorder#526FFF
  • foreground#383A42
  • gitDecoration.addedResourceForeground#50A14F
  • gitDecoration.deletedResourceForeground#E45649
  • gitDecoration.ignoredResourceForeground#9D9D9F
  • gitDecoration.modifiedResourceForeground#526FFF
  • input.background#FFF
  • input.border#CBCBCB
  • input.foreground#383A42
  • list.activeSelectionBackground#D0D5E3
  • list.highlightForeground#526FFF
  • list.hoverBackground#E5E5E6
  • menu.background#FFF
  • menu.foreground#383A42
  • menu.selectionBackground#D0D5E3
  • panel.background#EFEFEF
  • panel.border#E0E0E0
  • panelTitle.activeBorder#526FFF
  • scrollbarSlider.background#CBCBCB80
  • sideBar.background#F2F2F2
  • sideBar.border#E0E0E0
  • sideBar.foreground#494B52
  • statusBar.background#EFEFEF
  • statusBar.border#E0E0E0
  • statusBar.foreground#494B52
  • statusBarItem.remoteBackground#526FFF
  • statusBarItem.remoteForeground#FFF
  • tab.activeBackground#FAFAFA
  • tab.activeBorderTop#526FFF
  • tab.activeForeground#383A42
  • tab.border#E0E0E0
  • tab.inactiveBackground#EFEFEF
  • tab.inactiveForeground#9D9D9F
  • terminal.background#F2F2F2
  • terminal.foreground#383A42
  • titleBar.activeBackground#EFEFEF
  • titleBar.activeForeground#494B52

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment.block, comment.line, punctuation.definition.comment#A0A1A7italic
string, string.quoted, string.quoted.single, string.quoted.double, punctuation.definition.string#50A14F—
constant.character.escape#50A14F—
constant.numeric#986801—
constant.language#986801italic
constant.character, constant.other#986801—
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#A626A4bold
keyword.other.tableextension.al, keyword.other.pageextension.al, keyword.other.reportextension.al, keyword.other.enumextension.al, keyword.other.interfaceextension.al, keyword.other.permissionsetextension.al#A626A4bold italic
entity.name.type.al, entity.name.class.al, entity.name.object.al#50A14Fbold
entity.name.function.al, meta.function.al entity.name.function#4078F2bold
entity.name.function.trigger.al, entity.name.trigger.al, support.function.trigger.al#0184BCitalic
keyword.other.event.al, storage.type.event.al, keyword.other.eventsubscriber.al#0184BCbold italic
entity.name.field.al, variable.other.field.al#0184BC—
support.type.property-name.al, entity.other.attribute-name.al#383A42—
variable.language.rec.al, variable.other.rec.al, variable.language.al#50A14Fbold
support.type.al, storage.type.primitive.al#C18401—
constant.other.enum.al, variable.other.enummember.al#986801—
storage.modifier.al, keyword.other.local.al#A626A4italic
keyword, keyword.control, keyword.other, storage.type, storage.modifier#A626A4—
keyword.operator#383A42—
keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.logical, keyword.operator.comparison, keyword.operator.relational#383A42—
punctuation#A0A1A7—
variable.other#383A42—
variable.language.this#50A14F—
variable.parameter#E45649—
entity.name.function, support.function.any-method, variable.function#4078F2bold
support.function#4078F2—
entity.name.type, entity.name.class, support.class, entity.other.inherited-class#C18401—
entity.other.attribute-name#383A42—
support.type.property-name.json#A626A4—
entity.name.tag.yaml#A626A4—
entity.name.tag#A626A4—
entity.name.namespace, entity.name.module#C18401—
invalid#F87171underline
markup.heading#A626A4bold
markup.underline.link#4078F2—
markup.bold—bold
markup.italic—italic
ALchemy by Yahya Touil - VS Code Theme