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#000000
  • activityBar.foreground#C8D6E5
  • activityBar.inactiveForeground#66768A
  • activityBarBadge.background#5F8DFF
  • activityBarBadge.foreground#000000
  • badge.background#5F8DFF
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#91AFFF
  • breadcrumb.focusForeground#DDE0E4
  • breadcrumb.foreground#66768A
  • breadcrumbPicker.background#17181A
  • button.background#5F82D8
  • button.foreground#000000
  • button.hoverBackground#7698EE
  • commandCenter.activeBackground#7698EE2E
  • commandCenter.activeForeground#DDE0E4
  • commandCenter.background#0E0F11
  • commandCenter.border#24272B
  • commandCenter.foreground#A4B2C2
  • debugIcon.breakpointCurrentStackframeForeground#EBCB72
  • debugIcon.breakpointDisabledForeground#4D5D72
  • debugIcon.breakpointForeground#FF7082
  • debugIcon.disconnectForeground#FF7082
  • debugIcon.pauseForeground#EBCB72
  • debugIcon.restartForeground#58C7D8
  • debugIcon.startForeground#8496AA
  • debugIcon.stopForeground#FF7082
  • debugToolBar.background#17181A
  • debugToolBar.border#24272B
  • descriptionForeground#66768A
  • diffEditor.border#24272B
  • diffEditor.diagonalFill#17181A
  • diffEditor.insertedLineBackground#80AD871F
  • diffEditor.insertedTextBackground#80AD8730
  • diffEditor.removedLineBackground#D555611F
  • diffEditor.removedTextBackground#D5556130
  • diffEditorGutter.insertedLineBackground#8496AA
  • diffEditorGutter.removedLineBackground#FF7082
  • disabledForeground#4D5D72
  • dropdown.background#17181A
  • dropdown.border#24272B
  • dropdown.foreground#C8D6E5
  • editor.background#000000
  • editor.focusedStackFrameHighlightBackground#7698EE2E
  • editor.foreground#C8D6E5
  • editor.inactiveSelectionBackground#7698EE2E
  • editor.lineHighlightBackground#7698EE1A
  • editor.selectionBackground#7698EE47
  • editor.stackFrameHighlightBackground#A18BD433
  • editorBracketHighlight.foreground1#7698EE
  • editorBracketHighlight.foreground2#68B8C3
  • editorBracketHighlight.foreground3#A18BD4
  • editorBracketHighlight.foreground4#5F82D8
  • editorBracketHighlight.foreground5#4D9DA9
  • editorBracketHighlight.foreground6#8772BC
  • editorBracketHighlight.unexpectedBracket.foreground#FF7082
  • editorBracketMatch.background#7698EE2E
  • editorBracketMatch.border#5F8DFF
  • editorCursor.foreground#5F8DFF
  • editorError.border#00000000
  • editorError.foreground#FF7082
  • editorGhostText.foreground#4D5D72
  • editorGroup.border#17181A
  • editorGroupHeader.noTabsBackground#000000
  • editorGroupHeader.tabsBackground#000000
  • editorGutter.addedBackground#8496AA
  • editorGutter.deletedBackground#FF7082
  • editorGutter.modifiedBackground#5F8DFF
  • editorHint.border#00000000
  • editorHint.foreground#66768A
  • editorHoverWidget.background#17181A
  • editorHoverWidget.border#24272B
  • editorInfo.border#00000000
  • editorInfo.foreground#58C7D8
  • editorInlayHint.background#0E0F11
  • editorInlayHint.foreground#66768A
  • editorInlayHint.parameterForeground#66768A
  • editorInlayHint.typeForeground#58C7D8
  • editorLineNumber.activeForeground#A4B2C2
  • editorLineNumber.foreground#4D5D72
  • editorStickyScroll.background#000000
  • editorStickyScroll.border#17181A
  • editorStickyScrollHover.background#7698EE1A
  • editorSuggestWidget.background#17181A
  • editorSuggestWidget.border#24272B
  • editorSuggestWidget.foreground#C8D6E5
  • editorSuggestWidget.highlightForeground#91AFFF
  • editorSuggestWidget.selectedBackground#7698EE2E
  • editorWarning.border#00000000
  • editorWarning.foreground#EBCB72
  • editorWidget.background#17181A
  • editorWidget.border#24272B
  • errorForeground#FF7082
  • focusBorder#91AFFF
  • foreground#A4B2C2
  • gitDecoration.addedResourceForeground#8496AA
  • gitDecoration.conflictingResourceForeground#EBCB72
  • gitDecoration.deletedResourceForeground#FF7082
  • gitDecoration.ignoredResourceForeground#4D5D72
  • gitDecoration.modifiedResourceForeground#5F8DFF
  • icon.foreground#A4B2C2
  • input.background#0E0F11
  • input.border#24272B
  • input.foreground#C8D6E5
  • input.placeholderForeground#66768A
  • inputOption.activeBackground#7698EE2E
  • inputOption.activeBorder#5F8DFF
  • list.activeSelectionBackground#7698EE2E
  • list.activeSelectionForeground#DDE0E4
  • list.focusBackground#7698EE2E
  • list.focusForeground#DDE0E4
  • list.hoverBackground#7698EE1A
  • list.hoverForeground#DDE0E4
  • list.inactiveSelectionBackground#7698EE1A
  • list.inactiveSelectionForeground#C8D6E5
  • menu.background#17181A
  • menu.foreground#C8D6E5
  • menu.selectionBackground#7698EE2E
  • menu.selectionForeground#DDE0E4
  • menu.separatorBackground#24272B
  • merge.border#EBCB72
  • merge.commonContentBackground#CDA65E24
  • merge.commonHeaderBackground#CDA65E24
  • merge.currentContentBackground#7698EE2E
  • merge.currentHeaderBackground#7698EE1F
  • merge.incomingContentBackground#80AD8730
  • merge.incomingHeaderBackground#80AD871F
  • minimap.errorHighlight#D55561AA
  • minimap.findMatchHighlight#7698EE47
  • minimap.infoHighlight#68B8C3AA
  • minimap.selectionHighlight#7698EE40
  • minimap.warningHighlight#D7C66AAA
  • minimapGutter.addedBackground#8496AA
  • minimapGutter.deletedBackground#FF7082
  • minimapGutter.modifiedBackground#5F8DFF
  • notebook.cellBorderColor#17181A
  • notebook.cellEditorBackground#0E0F11
  • notebook.cellStatusBarItemHoverBackground#7698EE1A
  • notebook.editorBackground#000000
  • notebook.focusedCellBorder#5F8DFF
  • notebook.inactiveFocusedCellBorder#17181A
  • notebook.outputContainerBackgroundColor#0B0C0E
  • notebook.selectedCellBorder#24272B
  • notebookScrollbarSlider.activeBackground#7698EE80
  • notebookScrollbarSlider.background#68717C55
  • notebookScrollbarSlider.hoverBackground#858E9970
  • notificationCenter.border#24272B
  • notificationCenterHeader.background#17181A
  • notificationCenterHeader.foreground#DDE0E4
  • notificationLink.foreground#91AFFF
  • notifications.background#17181A
  • notifications.border#24272B
  • notifications.foreground#C8D6E5
  • panel.background#0B0C0E
  • panel.border#24272B
  • peekView.border#5F8DFF
  • peekViewEditor.background#000000
  • peekViewEditor.matchHighlightBackground#7698EE47
  • peekViewResult.background#0B0C0E
  • peekViewResult.fileForeground#DDE0E4
  • peekViewResult.lineForeground#66768A
  • peekViewResult.matchHighlightBackground#7698EE2E
  • peekViewResult.selectionBackground#7698EE2E
  • peekViewResult.selectionForeground#DDE0E4
  • peekViewTitle.background#17181A
  • peekViewTitleDescription.foreground#66768A
  • peekViewTitleLabel.foreground#DDE0E4
  • pickerGroup.border#24272B
  • pickerGroup.foreground#58C7D8
  • problemsErrorIcon.foreground#FF7082
  • problemsInfoIcon.foreground#58C7D8
  • problemsWarningIcon.foreground#EBCB72
  • quickInput.background#17181A
  • quickInput.foreground#C8D6E5
  • quickInputList.focusBackground#7698EE2E
  • quickInputList.focusForeground#DDE0E4
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#7698EE80
  • scrollbarSlider.background#68717C55
  • scrollbarSlider.hoverBackground#858E9970
  • selection.background#7698EE47
  • sideBar.background#0B0C0E
  • sideBar.border#24272B
  • sideBar.foreground#A4B2C2
  • sideBarSectionHeader.background#0E0F11
  • sideBarSectionHeader.border#17181A
  • sideBarSectionHeader.foreground#A4B2C2
  • statusBar.background#0B0C0E
  • statusBar.debuggingBackground#B184FF
  • statusBar.foreground#A4B2C2
  • statusBarItem.errorBackground#FF7082
  • statusBarItem.remoteBackground#58C7D8
  • statusBarItem.warningBackground#EBCB72
  • tab.activeBackground#000000
  • tab.activeBorderTop#5F8DFF
  • tab.activeForeground#DDE0E4
  • tab.border#17181A
  • tab.inactiveBackground#000000
  • tab.inactiveForeground#66768A
  • tab.unfocusedActiveForeground#A4B2C2
  • terminal.ansiBlack#121315
  • terminal.ansiBlue#7698EE
  • terminal.ansiBrightBlack#68717C
  • terminal.ansiBrightBlue#91AFF4
  • terminal.ansiBrightCyan#89CDD5
  • terminal.ansiBrightGreen#96C2BB
  • terminal.ansiBrightMagenta#BAA7E2
  • terminal.ansiBrightRed#E06B75
  • terminal.ansiBrightWhite#F0F1F3
  • terminal.ansiBrightYellow#F0DE7A
  • terminal.ansiCyan#68B8C3
  • terminal.ansiGreen#78AAA3
  • terminal.ansiMagenta#A18BD4
  • terminal.ansiRed#D55561
  • terminal.ansiWhite#C2C7CE
  • terminal.ansiYellow#D7C66A
  • terminal.background#0B0C0E
  • terminal.border#24272B
  • terminal.foreground#C8D6E5
  • terminal.selectionBackground#7698EE47
  • terminalCursor.background#0B0C0E
  • terminalCursor.foreground#91AFFF
  • testing.coverCountBadgeBackground#7698EE2E
  • testing.coverCountBadgeForeground#DDE0E4
  • testing.coveredBackground#80AD8724
  • testing.iconErrored#FF7082
  • testing.iconFailed#FF7082
  • testing.iconPassed#8496AA
  • testing.iconQueued#EBCB72
  • testing.iconSkipped#66768A
  • testing.iconUnset#66768A
  • testing.runAction#5F8DFF
  • testing.uncoveredBackground#D5556129
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#C8D6E5
  • titleBar.inactiveBackground#000000
  • titleBar.inactiveForeground#66768A
  • widget.border#24272B
  • widget.shadow#000000
  • window.activeBorder#17181A
  • window.inactiveBorder#17181A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
support.type.primitive.ts, support.type.primitive.tsx#58C7D8
variable.language.special.self.python, variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python#B184FF
storage.type.interface.ts, storage.type.interface.tsx#5F8DFF
entity.name.type.interface.ts, entity.name.type.interface.tsx#BAA7E2
support.type.builtin.ts, support.type.builtin.tsx, support.type.object.module.ts, support.type.object.module.tsx#A4B2C2
support.type.primitive.ts, support.type.primitive.tsx, storage.type.ts, storage.type.tsx#89CDD5
variable.other.property.ts, variable.other.property.tsx, meta.object-literal.key.ts, meta.object-literal.key.tsx#58C7D8
entity.name.function.magic.python#BAA7E2
support.function.builtin.python, support.type.python, support.variable.python#58C7D8
support.type.exception.python, entity.name.type.exception.python#FF7082
meta.function.decorator.python, entity.name.function.decorator.python, punctuation.definition.decorator.python#EBCB72
keyword.other.package.java, keyword.control.import.java#5F8DFF
storage.type.class.java, storage.type.interface.java, storage.type.enum.java, storage.type.record.java#91AFFF
storage.type.primitive.java#89CDD5
storage.type.annotation.java, meta.declaration.annotation.java, entity.name.type.annotation.java#EBCB72
entity.name.function.constructor.java, meta.method.identifier.java#BAA7E2
variable.other.constant.java, constant.other.java#EBCB72
storage.type.primitive.java, storage.type.java#89CDD5
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as#5F8DFF
entity.name.module, support.module, string.quoted.module#A4B2C2
entity.name.function.constructor, meta.function.constructor, support.class#BAA7E2
support.class, support.type, support.variable, support.constant#58C7D8
string.regexp, string.regexp.js, string.regexp.ts#B184FF
variable.other.env, variable.other.assignment.env, entity.name.variable.env#5F8DFF
string.unquoted.env, string.quoted.double.env, string.quoted.single.env#8496AA
entity.name.tag.yaml, meta.mapping.key.yaml string.unquoted.plain.out.yaml, meta.mapping.key.yaml string.unquoted.plain.in.yaml#5F8DFF
meta.mapping.value.yaml string.unquoted.plain.out.yaml, meta.mapping.value.yaml string.unquoted.plain.in.yaml, meta.block.mapping.value.yaml string.unquoted.plain.out.yaml#8496AA
entity.name.type.anchor.yaml, variable.other.anchor.yaml#B184FF
variable.other.alias.yaml#58C7D8
constant.language.yaml, constant.numeric.yaml#EBCB72
support.type.property-name.json#5F8DFF
meta.structure.dictionary.value.json string.quoted.double.json, meta.structure.array.json string.quoted.double.json#8496AA
constant.language.json#EBCB72
punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, punctuation.separator.dictionary.key-value.json, punctuation.separator.dictionary.pair.json#66768A
markup.heading, entity.name.section, markup.heading.markdown#91AFFFbold
punctuation.definition.heading, punctuation.definition.heading.markdown#91AFFFbold
markup.bold, markup.bold.markdown#DDE0E4bold
markup.italic, markup.italic.markdown#B184FFitalic
markup.inline.raw, markup.inline.raw.string.markdown#58C7D8
markup.fenced_code.block, markup.raw.block#58C7D8
markup.quote, markup.quote.markdown#66768Aitalic
punctuation.definition.list, punctuation.definition.list.begin.markdown, punctuation.definition.list.begin#91AFFF
markup.underline.link, string.other.link, meta.link.inline#89CDD5
entity.name.tag.css#5F8DFF
entity.other.attribute-name.class.css#5F8DFF
entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css#B184FF
support.type.property-name.css, meta.property-name.css#58C7D8
support.constant.property-value.css, support.constant.font-name.css, support.constant.color.css, constant.other.color.rgb-value.css#A4B2C2
comment, punctuation.definition.comment#4D5D72italic
comment.block.documentation, comment.line.documentation#66768Aitalic
keyword, storage.modifier, storage.type.function#5F8DFF
meta.package.java storage.modifier.package.java#A4B2C2
meta.import.java storage.modifier.import.java#A4B2C2
keyword.control, keyword.control.conditional, keyword.control.loop, keyword.control.exception, keyword.control.import, keyword.control.return#91AFFF
keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.logical, keyword.operator.comparison, keyword.operator.accessor#58C7D8
storage.type.interface.ts, storage.type.class.ts, storage.type.enum.ts, storage.type.type.ts, storage.type.namespace.ts, storage.type.interface.tsx, storage.type.class.tsx#91AFFF
entity.name.type.interface.ts, entity.name.type.class.ts, entity.name.type.alias.ts, entity.name.type.enum.ts, entity.name.type.interface.tsx, entity.name.type.class.tsx#89CDD5
storage.type.struct.rust, storage.type.enum.rust, storage.type.trait.rust, storage.type.type.rust, storage.type.union.rust#91AFFF
entity.name.type.struct.rust, entity.name.type.enum.rust, entity.name.type.trait.rust, entity.name.type.rust, support.type.rust, storage.type.numeric.rust, storage.type.primitive.rust#89CDD5
entity.name.function.rust, meta.function.call.rust entity.name.function.rust#BAA7E2
entity.name.function.macro.rust, support.macro.rust, meta.macro.rust#BAA7E2
entity.name.type.lifetime.rust, storage.modifier.lifetime.rust, variable.other.lifetime.rust#EBCB72
entity.name.namespace.rust, entity.name.module.rust, meta.use.rust entity.name.namespace.rust#A4B2C2
variable.other.constant.rust, constant.other.rust#EBCB72
meta.preprocessor.c, keyword.control.directive.c, keyword.control.import.c, punctuation.definition.directive.c#5F8DFF
storage.type.c, storage.type.built-in.c, support.type.c#89CDD5
entity.name.function.c, meta.function.c entity.name.function.c#BAA7E2
constant.other.c, variable.other.constant.c#EBCB72
entity.name.label.c#B184FF
string.quoted.other.lt-gt.include.c, string.quoted.double.include.c#A4B2C2
entity.name.type, entity.name.class, entity.name.interface, entity.name.struct, entity.name.enum, support.type#89CDD5
storage.type.class, storage.type.interface, storage.type.struct, storage.type.enum, storage.type.trait, storage.type.union, storage.type.record#91AFFF
entity.name.namespace, entity.name.module, support.module#58C7D8
entity.name.function, support.function, variable.function, meta.function-call entity.name.function#BAA7E2
entity.name.function.member, meta.method-call entity.name.function, support.function.method#B184FF
variable, meta.definition.variable#C8D6E5
variable.parameter#A4B2C2
variable.other.property, support.type.property-name, meta.object-literal.key#58C7D8
string#8496AA
constant.numeric#96C2BB
constant.language.boolean#EBCB72
constant.language.null#68717C
meta.decorator, storage.type.annotation#EBCB72
punctuation.separator, punctuation.terminator, punctuation.accessor, punctuation.definition.parameters, punctuation.definition.typeparameters#66768A
entity.name.tag, entity.name.tag.html, entity.name.tag.xml#89CDD5
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.xml#5F8DFF
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#66768A
punctuation.definition.template-expression, punctuation.section.embedded.begin, punctuation.section.embedded.end#91AFFF
invalid, invalid.illegal#FF7082
Eliejesresce K2 Themes by Archimango - VS Code Theme