Skip to main content
Coding Theme

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#B6BBC4
  • activityBar.background#0d151f
  • activityBar.border#1b1b1b
  • activityBar.foreground#B6BBC4
  • activityBarBadge.background#0d151f
  • activityBarBadge.foreground#0e5d81
  • breadcrumb.background#0d151f
  • breadcrumb.focusForeground#0e5d81
  • button.background#0e5d81
  • button.foreground#0d151f
  • commandCenter.activeBackground#131d2b
  • commandCenter.activeBorder#0d151f
  • commandCenter.background#131d2b
  • commandCenter.border#131d2b
  • commandCenter.inactiveBorder#131d2b
  • debugIcon.breakpointForeground#FF4B91
  • dropdown.background#0d151f
  • dropdown.listBackground#0d151f
  • editor.background#0d151f
  • editor.findMatchBackground#1a9b0094
  • editor.findMatchHighlightBackground#009b0050
  • editor.foreground#B6BBC4
  • editor.selectionBackground#131d2b
  • editor.wordHighlightBackground#6969693b
  • editorBracketHighlight.foreground1#84A98C
  • editorBracketHighlight.foreground2#84A98C
  • editorBracketHighlight.foreground3#84A98C
  • editorBracketHighlight.foreground4#84A98C
  • editorBracketHighlight.foreground5#84A98C
  • editorBracketHighlight.foreground6#84A98C
  • editorBracketHighlight.unexpectedBracket.foreground#FE5D9F
  • editorBracketMatch.background#2B2C28
  • editorBracketMatch.border#2B2C28
  • editorCursor.background#0e5d81
  • editorCursor.foreground#B6BBC4
  • editorError.foreground#FE5D9F
  • editorGroupHeader.tabsBackground#0d151f
  • editorIndentGuide.activeBackground1#303030
  • editorIndentGuide.activeBackground2#303030
  • editorIndentGuide.activeBackground3#303030
  • editorIndentGuide.activeBackground4#303030
  • editorIndentGuide.activeBackground5#303030
  • editorIndentGuide.activeBackground6#303030
  • editorIndentGuide.background1#131515
  • editorIndentGuide.background2#131515
  • editorIndentGuide.background3#131515
  • editorIndentGuide.background4#131515
  • editorIndentGuide.background5#131515
  • editorIndentGuide.background6#131515
  • editorLineNumber.activeForeground#0e5d81
  • editorLineNumber.foreground#45474B
  • editorWarning.foreground#FF9130
  • editorWidget.background#0d151f
  • editorWidget.border#1b1b1b
  • editorWidget.foreground#B6BBC4
  • extensionButton.foreground#0d151f
  • extensionButton.prominentBackground#0e5d81
  • extensionButton.separator#0d151f
  • extensionIcon.starForeground#FFD166
  • extensionIcon.verifiedForeground#4CC9F0
  • focusBorder#0d151f
  • input.background#131d2b
  • inputOption.activeBackground#0e5d81
  • inputOption.activeBorder#1b1b1b
  • inputOption.hoverBackground#0e5d81
  • inputValidation.errorForeground#FF4B91
  • inputValidation.infoForeground#4CC9F0
  • inputValidation.warningForeground#FF9130
  • list.activeSelectionBackground#131d2b
  • list.errorForeground#FF4B91
  • list.hoverBackground#131d2b
  • list.inactiveSelectionBackground#131d2b
  • menu.background#0d151f
  • menu.border#2B2C28
  • menu.foreground#eaedf3
  • menu.selectionBackground#0e5d81
  • menu.selectionForeground#0d151f
  • menu.separatorBackground#2B2C28
  • menubar.selectionBackground#0d151f
  • menubar.selectionForeground#f5f5f5
  • minimap.errorHighlight#FF4B91
  • minimapSlider.hoverBackground#131d2ba0
  • notificationCenter.border#1b1b1b
  • notificationCenterHeader.foreground#0e5d81
  • notificationLink.foreground#4361EE
  • notifications.background#0d151f
  • notifications.border#1b1b1b
  • notificationsErrorIcon.foreground#FF4B91
  • notificationsInfoIcon.foreground#4CC9F0
  • notificationsWarningIcon.foreground#FF9130
  • notificationToast.border#1b1b1b
  • panel.background#0d151f
  • panel.border#2B2C28
  • profileBadge.background#0e5d81
  • profileBadge.foreground#B6BBC4
  • quickInput.background#0d151f
  • quickInputList.focusBackground#0e5d81
  • quickInputList.focusForeground#0d151f
  • scrollbarSlider.activeBackground#131d2b
  • scrollbarSlider.background#131d2b
  • scrollbarSlider.hoverBackground#131d2b
  • search.resultsInfoForeground#0e5d81
  • settings.focusedRowBorder#1b1b1b
  • sideBar.background#0d151f
  • sideBar.border#1b1b1b
  • sideBar.foreground#B6BBC4
  • sideBarSectionHeader.background#0d151f
  • sideBarSectionHeader.border#1b1b1b
  • sideBarSectionHeader.foreground#B6BBC4
  • statusBar.background#0d151f
  • statusBar.debuggingBackground#0e5d81
  • statusBar.debuggingForeground#0d151f
  • statusBar.foreground#B6BBC4
  • statusBarItem.errorBackground#0d151f
  • statusBarItem.errorForeground#FF4B91
  • statusBarItem.errorHoverForeground#FF4B91
  • statusBarItem.remoteBackground#0d151f
  • statusBarItem.remoteForeground#0e5d81
  • tab.activeForeground#B6BBC4
  • tab.border#0d151f
  • tab.inactiveBackground#0d151f
  • terminalCursor.foreground#0e5d81
  • titleBar.activeBackground#0d151f
  • titleBar.activeForeground#B6BBC4
  • titleBar.border#0d151f
  • titleBar.inactiveBackground#0d151f
  • titleBar.inactiveForeground#B6BBC4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment.line.number-sign.ini, comment.line.number-sign.ignore, comment.line.number-sign.shell, comment.line.double-slash.c, comment.line.double-slash.cpp, comment.line.double-slash.cs, comment.block.css, comment.line.double-slash.go, punctuation.definition.comment.html, comment.block.html, comment.line.double-slash.java, comment.line.double-slash.js, comment.line.double-slash.php, comment.line.number-sign.python, comment.line.number-sign.r, comment.line.double-slash.rust, comment.line.double-dash.sql, comment.line.double-slash.swift, comment.line.double-slash.ts, comment.line.number-sign.yaml#b803a9
entity.name.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, entity.name.tag.js, punctuation.definition.tag.begin.js, punctuation.definition.tag.end.js#FF6188
entity.other.attribute-name.html#78DCE8italic
constant.character.entity.named.nbsp.html, constant.character.entity.named.emsp.html, constant.character.entity.named.thinsp.html, constant.character.entity.named.ensp.html, constant.character.entity.named.lt.html, constant.character.entity.named.gt.html, constant.character.entity.named.amp.html, constant.character.entity.named.quot.html, constant.character.entity.named.cent.html, constant.character.entity.named.pound.html, constant.character.entity.named.yen.html, constant.character.entity.named.euro.html, constant.character.entity.named.copy.html, constant.character.entity.named.reg.html, constant.character.entity.named.apos.html#01b3b9
string.quoted.double.html, string.quoted.single.html, string.unquoted.html#A9DC76
punctuation.separator.key-value.html#FC9867
text.html.derivative#adabab
constant.character.entity.numeric.decimal.html#A9DC76
keyword.control.at-rule.import.css#FF6188
entity.other.attribute-name.pseudo-class.css, support.function.misc.css, support.function.url.css, entity.other.attribute-name.pseudo-element.css#78DCE8italic
string.quoted.double.css, string.quoted.single.css#A9DC76
variable.argument.css, variable.css#AB9DF2
entity.name.tag.css#FF6188
support.type.property-name.css#FC9867
support.type.property-name.media.css#FF6188
meta.at-rule.media.header.css#A9DC76
entity.other.attribute-name.class.css#FFCD70
entity.other.attribute-name.id.css#AB9DF2
support.constant.property-value.css, meta.property-value.css#A9DC76
support.constant.font-name.css#A9DC76
punctuation.separator.key-value.css, punctuation.terminator.rule.css, keyword.operator.combinator.css#FF6188
keyword.control.at-rule.media.css, keyword.operator.logical.and.media.css, keyword.control.at-rule.keyframes.css, keyword.control.at-rule.css, keyword.control.at-rule.font-face.css, meta.at-rule.header.css, entity.name.tag.wildcard.css#FF6188
support.constant.media.css, variable.parameter.keyframe-list.css, meta.at-rule.header.css#A9DC76
entity.other.keyframe-offset.css#78DCE8
source.css#776B5D
string.quoted.double.js, string.template.js, string.quoted.single.js.jsx#FFCD70
keyword.control.import.js, keyword.control.from.js, keyword.control.export.js, keyword.control.default.js, entity.name.type.instance.jsdoc#FF6188
keyword.operator.new.js#68A691
entity.name.function.js, variable.other.constant.property.js, variable.other.readwrite.alias.js#A9DC76
variable.other.constant.object.js#FC9867
variable.parameter.js, constant.language.boolean.false.js.jsx#A9DC76italic
variable.other.property.js#A9DC76
variable.other.object.property.js#78DCE8
keyword.control.conditional.js#FF6188
storage.type.js, keyword.control.trycatch.js, storage.type.function.js#78DCE8italic
comment.block.documentation.js#0291ce
variable.other.object.js#FC9867
variable.other.constant.js, meta.object-literal.key.js#AB9DF2
keyword.operator.assignment.js, punctuation.terminator.statement.js, keyword.operator.comparison.js, storage.type.function.arrow.js, punctuation.separator.comma.js, punctuation.accessor.js, punctuation.separator.parameter.js, keyword.operator.logical.js, keyword.operator.relational.js#FC9867italic
storage.modifier.async.js, keyword.control.flow.js#FF6188
entity.other.attribute-name.js#78DCE8
meta.jsx.children.js#3a3a3abold
constant.numeric.decimal.js#FFCD70
support.type.object.module.js#64CCC5
constant.language.boolean.true.js, variable.language.this.js#68A691
variable.other.readwrite.js#AB9DF2
source.json meta.structure.dictionary.json support.type.property-name.json#FF6188
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#FC9867
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#FFCD70
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#AB9DF2
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#78DCE8
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#FFCD70
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#FC9867
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#AB9DF2
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#78DCE8
string.quoted.double.json#A9DC76
punctuation.separator.dictionary.pair.json, punctuation.separator.dictionary.key-value.json#78DCE8
constant.language.json, meta.structure.dictionary.value.json#09BC8A
source.ignore#333333
variable.key.dotenv, variable.other.env#FF6188
property.value.dotenv, constant.numeric.env, source.env#A9DC76
keyword.operator.assignment.dotenv, keyword.operator.assignment.env#444444
invalid.deprecated.entity.other.attribute-name.html#F2AE72
heading.1.markdown, heading.2.markdown, heading.3.markdown, heading.4.markdown, heading.5.markdown, heading.6.markdown#A9DC76
punctuation.definition.bold.markdown, markup.bold.markdown#FF6188
punctuation.definition.italic.markdown, markup.italic.markdown#FC9867
string.other.link.title.markdown, markup.underline.link.markdown#78DCE8
punctuation.definition.link.title.begin.markdown, punctuation.definition.link.title.end.markdown, punctuation.definition.link.description.begin.markdown, punctuation.definition.link.description.end.markdown, punctuation.definition.metadata.markdown#272727
string.other.link.description.markdown, markup.underline.link.image.markdown#AB9DF2
punctuation.definition.raw.markdown, markup.inline.raw.string.markdown, punctuation.definition.markdown, markup.fenced_code.block.markdown#FF6188
meta.paragraph.markdown, text.html.markdown#3a3a3abold
punctuation.definition.list.begin.markdown, markup.raw.block.markdown#78DCE8bold
punctuation.definition.quote.begin.markdown#AB9DF2
meta.separator.markdown#28DF99
punctuation.definition.comment.shebang.shell, meta.shebang.shell#AB9DF2
support.function.builtin.shell#FF6188
string.unquoted.argument.shell, string.quoted.double.shell, string.quoted.single.shell#A9DC76
variable.other.assignment.shell, variable.other.normal.shell, punctuation.definition.variable.shell, meta.arithmetic.shell, variable.other.loop.shell, variable.parameter.positional.shell#FC9867
keyword.control.break.shell, keyword.control.continue.shell#06BEE1
keyword.control.shell, entity.name.command.shell, keyword.control.do.shell, keyword.control.then.shell, keyword.control.elif.shell, keyword.control.else.shell#78DCE8
meta.scope.case-pattern.shell#747474bold
punctuation.terminator.case-clause.shell, keyword.operator.pipe.shell, keyword.operator.assignment.shell, keyword.operator.arithmetic.shell#FF6188
meta.parameter-expansion#F2D388
constant.other.option.dash.shell, constant.other.option, keyword.operator.logical.shell, meta.statement.command.name.shell, meta.statement.shell#49493Cbold
entity.name.function.shell#78DCE8
storage.type.function.shell#FC9867italic
keyword.control.import.python#FF6188
source.python#FC9867
keyword.operator.assignment.python, keyword.operator.arithmetic.python, keyword.operator.comparison.python#78DCE8
meta.function-call.generic.python#FFCD70italic
string.quoted.single.python#A9DC76
meta.function-call.arguments.python#AB9DF2
support.function.builtin.python#FFCD70
keyword.control.flow.python#78DCE8
storage.type.function.python#FFCD70
entity.name.function.python#78DCE8
keyword.control.directive.include.c, storage.type.struct.c, keyword.control.c#FF6188
string.quoted.other.lt-gt.include.c#A9DC76
source.c#78DCE8
storage.type.built-in.primitive.c#FC9867
entity.name.function.c#78DCE8
string.quoted.double.c#A9DC76
constant.language.c, constant.numeric.decimal.c#FC9867
meta.function-call.c#AB9DF2
keyword.operator.assignment.c, keyword.operator.comparison.c, keyword.operator.increment.c#FF6188
meta.parens.block.c#FC9867
meta.block.c#FFCD70
source.ini#A9DC76
keyword.other.definition.ini#FF6188
punctuation.separator.key-value.ini#00d2f7
keyword.control.directive.include.cpp, meta.using-namespace.cpp, storage.type.built-in.primitive.cpp, keyword.control.return.cpp#FF6188
string.quoted.other.lt-gt.include.cpp, constant.numeric.decimal.cpp, keyword.operator.arithmetic.cpp#A9DC76
entity.name.function.definition.cpp#78DCE8
string.quoted.double.cpp#A9DC76
keyword.operator.assignment.cpp, keyword.operator.bitwise.shift.cpp#FF6188bold
meta.body.function.definition.cpp#FC9867
keyword.other.using.cs, keyword.other.class.cs, keyword.other.namespace.cs, storage.modifier.cs, variable.other.object.cs, keyword.other.directive.using.cs#FF6188
storage.modifier.virtual.cs, entity.name.type.class.cs#FC9867
storage.type.class.cs, storage.modifier.public.cs, keyword.type.void.cs#FF6188
entity.name.type.namespace.cs, entity.name.function.cs, keyword.other.new.cs, storage.type.namespace.cs#78DCE8
entity.name.type.cs#FC9867
keyword.type.cs, entity.name.variable.parameter.cs, keyword.type.string.cs#FC9867
string.quoted.double.cs#A9DC76
storage.modifier.static.cs, keyword.operator.expression.new.cs#AB9DF2
storage.modifier.sealed.cs, storage.modifier.override.cs#FFCD70
entity.name.variable.local.cs#E48F45
keyword.operator.assignment.cs, punctuation.terminator.statement.cs, punctuation.accessor.cs, punctuation.separator.colon.cs#FF6188
keyword.package.go, keyword.import.go, keyword.type.go, keyword.function.go, variable.other.assignment.go#FF6188
entity.name.package.go, support.function.go#78DCE8
entity.name.import.go, punctuation.definition.string.begin.go, punctuation.definition.string.end.go#A9DC76
entity.name.type.go, keyword.var.go, variable.other.declaration.go#FC9867
keyword.struct.go, entity.name.function.go#FFCD70
string.quoted.double.go, constant.numeric.decimal.go#A9DC76
keyword.operator.assignment.go, punctuation.other.comma.go, punctuation.other.period.go#78DCE8
storage.type.string.go, storage.type.numeric.go#AB9DF2
source.go#FC9867
keyword.other.import.java, storage.modifier.java, storage.type.java#FF6188
storage.modifier.import.java, entity.name.function.java, storage.type.generic.java, keyword.control.new.java#78DCE8
entity.name.type.class.java, storage.type.primitive.java#AB9DF2
storage.type.object.array.java, variable.parameter.java, constant.numeric.decimal.java#FC9867
variable.other.object.java, variable.other.definition.java, meta.method-call.java#FC9867
variable.other.object.property.java#FFCD70
string.quoted.double.java#A9DC76
keyword.operator.arithmetic.java, keyword.operator.assignment.java, punctuation.separator.period.java, punctuation.terminator.java, punctuation.bracket.angle.java#FFCD70
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php, support.function.construct.output.php, storage.type.class.php, storage.modifier.php, variable.language.this.php, support.function.construct.php#FF6188
keyword.control.if.php, keyword.control.else.php, keyword.control.while.php, keyword.control.do.php, keyword.control.break.php, keyword.control.continue.php#78DCE8
keyword.control.import.include.php, storage.type.function.php, keyword.other.new.php, variable.other.property.php, variable.other.global.safer.php#78DCE8
string.quoted.single.php, string.quoted.double.php#A9DC76
entity.name.type.class.php, support.class.php, support.function.constructor.php, support.function.magic.php#FC9867
variable.other.php, constant.numeric.decimal.php, constant.language.php#AB9DF2
entity.name.function.php, support.function.math.php, support.function.array.php, support.function.json.php#FC9867
meta.function-call.php#FFCD70
constant.other.php, keyword.operator.comparison.php, keyword.operator.arithmetic.php, keyword.operator.assignment.php, keyword.operator.key.php, keyword.operator.class.php#FF6188
entity.name.goto-label.php#494949bold
punctuation.terminator.expression.php, punctuation.terminator.statement.php, keyword.operator.string.php, punctuation.separator.delimiter.php#FC9867
support.function.r#FF6188
string.quoted.double.r#A9DC76
variable.other.r, variable.parameter.r, constant.numeric.integer.decimal.r, constant.numeric.float.decimal.r#FC9867
entity.name.function.r, keyword.control.r#78DCE8
keyword.operator.assignment.r, keyword.other.r, source.r#00A896
string.quoted.double.rust#A9DC76
entity.name.function.macro.rust, storage.type.rust, keyword.control.rust, keyword.other.fn.rust#FF6188
variable.other.rust#FC9867
entity.name.function.rust, storage.modifier.mut.rust#78DCE8
constant.numeric.decimal.rust#FC9867
keyword.operator.assignment.equal.rust, keyword.operator.comparison.rust, punctuation.semi.rust, punctuation.comma.rust, keyword.operator.assignment.rust#FF6188
keyword.other.DML.sql, keyword.other.alias.sql, keyword.other.sql, keyword.other.DDL.create.II.sql#FF6188
entity.name.function.sql, support.function.aggregate.sql#AB9DF2
keyword.other.create.sql#78DCE8italic
storage.type.sql#A9DC76
storage.modifier.sql#FFCD70
source.sql#FC9867
storage.type.interface.ts, storage.type.class.ts, storage.type.ts, storage.type.type.ts, storage.type.function.ts, keyword.control.flow.ts, keyword.control.as.ts#FF6188
entity.name.type.interface.ts, entity.name.type.class.ts, entity.name.function.ts, variable.language.this.ts, variable.other.constant.ts, entity.name.type.alias.ts, support.variable.property.ts#78DCE8
variable.object.property.ts, variable.parameter.ts, entity.name.type.ts, variable.other.property.ts, meta.object-literal.key.ts, variable.other.object.ts#FC9867
support.type.primitive.ts, variable.other.readwrite.ts, keyword.operator.new.ts#AB9DF2
string.quoted.double.ts, string.template.ts#A9DC76
constant.numeric.decimal.ts#FC9867
punctuation.terminator.statement.ts, keyword.operator.assignment.ts, keyword.operator.type.annotation.ts, punctuation.separator.comma.ts, punctuation.accessor.ts#FF6188
keyword.other.declaration-specifier.swift, keyword.control.branch.swift, storage.type.function.swift#FF6188
support.function.swift#78DCE8
string.quoted.double.single-line.swift#A9DC76
support.type.swift, support.function.any-method.swift, entity.name.function.swift#AB9DF2
keyword.operator.custom.infix.swift, keyword.operator.ternary.swift, punctuation.separator.argument-label.swift, punctuation.section.embedded.begin.swift, meta.parameter-clause.swift#00A896
constant.numeric.integer.decimal.swift#8AC926
source.swift#FC9867
entity.name.tag.yaml#FF6188
string.quoted.double.yaml, string.quoted.single.yaml, string.unquoted.plain.out.yaml#A9DC76
constant.language.boolean.yaml, constant.numeric.integer.yaml, constant.numeric.float.yaml#AB9DF2
punctuation.definition.block.sequence.item.yaml#78DCE8
punctuation.separator.key-value.mapping.yaml#78DCE8
Moonlight reBump by Irfan Shadik Rishad - VS Code Theme