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.activeBorder#525252
  • activityBar.background#262626
  • activityBar.border#0d0d0d
  • activityBar.foreground#7A7A7A
  • activityBar.inactiveForeground#525252
  • activityBarBadge.background#406098
  • breadcrumb.background#1a1a1a
  • breadcrumb.focusForeground#7A7A7A
  • breadcrumb.foreground#7A7A7A
  • breadcrumbPicker.background#1a1a1a
  • debugToolBar.background#0d0d0d
  • editor.background#191c24
  • editor.foreground#A9A9A9
  • editor.lineHighlightBackground#0d0d0d
  • editor.lineHighlightBorder#0d0d0d
  • editorBracketMatch.border#22b455
  • editorCursor.background#000036
  • editorCursor.foreground#22b455
  • editorGroup.border#0d0d0d
  • editorGroup.emptyBackground#262626
  • editorGroupHeader.border#0d0d0d
  • editorGroupHeader.noTabsBackground#262626
  • editorGroupHeader.tabsBackground#262626
  • editorGutter.commentRangeForeground#31375E
  • editorGutter.foldingControlForeground#ff0000
  • editorIndentGuide.activeBackground#393f51
  • editorIndentGuide.background#242833
  • editorLineNumber.activeForeground#516a81
  • editorLineNumber.foreground#3C4867
  • editorPane.background#1a1a1a
  • focusBorder#7A7A7A
  • list.focusForeground#D2D7D3
  • panel.background#1a1a1a
  • panel.border#0d0d0d
  • panelTitle.activeBorder#7A7A7A
  • sideBar.background#1a1a1a
  • sideBar.border#0d0d0d
  • sideBarSectionHeader.background#1a1a1a
  • sideBarSectionHeader.border#0d0d0d
  • statusBar.background#262626
  • statusBar.border#0d0d0d
  • statusBar.debuggingBackground#0d0d0d
  • statusBar.debuggingForeground#f9690e
  • statusBar.foreground#7A7A7A
  • statusBar.noFolderBackground#262626
  • statusBar.noFolderForeground#7A7A7A
  • statusBarItem.remoteBackground#262626
  • tab.activeBackground#1a1a1a
  • tab.activeForeground#A9A9A9
  • tab.border#0d0d0d
  • tab.inactiveBackground#262626
  • terminal.ansiBlack#191c24
  • terminal.ansiBlue#638BB3
  • terminal.ansiBrightBlack#7A7A7A
  • terminal.ansiBrightBlue#638BB3
  • terminal.ansiBrightCyan#1BA39C
  • terminal.ansiBrightGreen#24A159
  • terminal.ansiBrightMagenta#B381B3
  • terminal.ansiBrightRed#E74C3C
  • terminal.ansiBrightWhite#D2D7D3
  • terminal.ansiBrightYellow#F2A127
  • terminal.ansiCyan#1BA39C
  • terminal.ansiGreen#24A159
  • terminal.ansiMagenta#B381B3
  • terminal.ansiRed#A10502
  • terminal.ansiWhite#939393
  • terminal.ansiYellow#F2A127
  • terminal.foreground#A9A9A9
  • terminal.selectionBackground#22b455
  • terminalCursor.background#000036
  • terminalCursor.foreground#22b455

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#F1F227—
variable.other.readwrite#FF4500—
keyword, storage.type, storage.modifier#ABB7B7—
keyword.control.flow, keyword.control.module, meta.function storage.type.function, keyword.control.export#FC6399—
keyword.control.switch, keyword.control.conditional, keyword.operator.ternary, keyword.operator.logical, keyword.operator.comparison#FF7F50—
keyword.operator.ternary#ABB7B7—
meta.import string.quoted, meta.import string.quoted punctuation, meta.import keyword.control.as, keyword.control.module.reference#A9A9A9—
variable.other.readwrite.alias#E8E8E8—
string, string punctuation, constant.numeric, constant.language, constant.character, constant.escape, keyword.other.unit, keyword.other#AEA8D3—
variable.other.constant.property, meta.object.member variable.other.constant, variable.other.constant#E4F1FE—
meta.function entity.name.function, storage.type.function.arrow, meta.definition.function entity.name.function, meta.function punctuation.definition meta.brace, meta.function meta.brace.curly, meta.arrow meta.parameters punctuation.definition.parameters.begin, meta.arrow meta.parameters punctuation.definition.parameters.end#81CFE0—
variable.parameter, meta.function.parameters, meta.function.parameters variable.other.readwrite, meta.function.parameters keyword.operator.spread, meta.jsx meta.tag meta.embedded.expression meta.arrow meta.parameters, meta.jsx meta.tag meta.embedded.expression meta.arrow meta.parameters punctuation#D2D7D3—
meta.function-call entity.name.function, meta.function-call.with-arguments variable.other.readwrite, meta.function-call.with-arguments entity.name.function#BEBEBE—
variable.other.readwrite, variable.other.object, meta.method-call.with-arguments variable.other.readwrite#F4B350—
meta.type.declaration keyword.operator.assignment, meta.type punctuation, meta.type.annotation, meta.type meta.brace, meta.return.type.arrow keyword.operator, keyword.operator.type#28A228
meta.type storage.type, keyword.control.as, keyword.operator.expression.keyof, meta.field.declaration keyword.operator.optional, meta.type.declaration meta.object.type keyword.operator.optional#2ECC32italic
support.type.primitive, support.type.builtin, meta.type.annotation support.type.builtin, meta.type.annotation meta.type.function, meta.type.annotation meta.type.function punctuation.definition, meta.type.declaration string#65A665italic
meta.interface meta.field.declaration meta.definition.property entity, meta.type.annotation meta.field.declaration meta.definition.property variable, meta.type.annotation meta.field.declaration meta.definition.property entity, meta.type.annotation meta.field.declaration meta.definition.property, meta.type.declaration meta.object.type meta.definition.property variable, meta.type.declaration meta.object.type meta.indexer.declaration variable, meta.type.declaration variable.other.property, meta.object.flowtype variable.other.readwrite#8BB82Ditalic
variable.language.this#66CC99—
meta.class meta.method.declaration meta.definition.method entity.name.function, meta.class meta.method.declaration meta.parameters punctuation, meta.class meta.field.declaration meta.definition.property entity, meta.class meta.field.declaration meta.definition.property variable, variable.other.class#00D46A—
meta.object-literal.key, meta.object-literal.key meta.brace, meta.object-literal.key constant.numeric.decimal, meta.object-literal.key string.quoted, meta.object-literal.key string.quoted punctuation.definition.string, meta.objectliteral punctuation.definition.block, meta.block meta.objectliteral punctuation.definition.block, constant.other.object string#B381B3—
support.type.property-name, support.type.property-name punctuation#ABB7B7—
source.json support.type.property-name, source.json support.type.property-name punctuation#D2D7D3—
source.json string, source.json constant.language#BE90D4—
meta.structure.dictionary#808080—
meta.tag entity.name.tag support.class.component#8BB82D—
meta.tag entity.other.attribute-name#AAA789—
meta.tag.attributes keyword.operator.assignment, meta.tag.attributes punctuation.section.embedded#696969—
text.html.markdown, text.html.markdown punctuation.definition.list#D2D7D3—
text.html.markdown heading#E8E8E8—
text.html.markdown markup.bold.markdown—bold
text.html.markdown markup.italic.markdown—italic
text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code#A9A9A9—
text.html.markdown punctuation, text.html.markdown markup.underline.link#A9A9A9—
text.html.markdown string.other.link#5BC0D7—
source.elixir string, source.elixir string punctuation, source.elixir constant.numeric#3FC380—
source.elixir constant.language.symbol#8BB82D—
source.elixir keyword.operator.assignment, source.elixir keyword.operator.arithmetic, source.elixir keyword.operator#AEA8D3—
source.elixir keyword, source.elixir keyword.control.module, source.elixir keyword.other.special-method#B381B3—
source.elixir entity.name, source.elixir meta.function entity.name.function#FFD700—
source.elixir variable.other.constant#6BB9F0—
source.elixir entity.name.function-call#81CFE0—
source.elixir, source.elixir comment.wildcard, source.elixir comment, source.elixir punctuation.definition.comment#D4D4D4—
source.elixir comment, source.elixir punctuation.definition.comment#E7903C—
source.elixir punctuation, source.elixir comment.unused#939393—
source.elixir variable.other.readwrite, source.elixir variable.other.readwrite punctuation#DADFE1—
B9F36BCF530F3D6B5C9CF39D2E260A99 (Theme) by Shahab Khalvati - VS Code Theme