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#050B05
  • activityBar.foreground#00FF41
  • activityBar.inactiveForeground#4D6E4D
  • activityBarBadge.background#00FF41
  • activityBarBadge.foreground#050B05
  • badge.background#1A351A
  • badge.foreground#D6F0D6
  • button.background#00FF41CC
  • button.foreground#050B05
  • button.hoverBackground#00FF41
  • button.secondaryBackground#122212
  • button.secondaryForeground#D6F0D6
  • button.secondaryHoverBackground#1A301A
  • diffEditor.insertedTextBackground#00FF4133
  • diffEditor.removedTextBackground#FF335533
  • dropdown.background#0C160C
  • dropdown.border#1A3A1A
  • dropdown.foreground#D6F0D6
  • editor.background#080E08
  • editor.findMatchBackground#00FF4166
  • editor.findMatchHighlightBackground#FFB86C33
  • editor.foreground#D6F0D6
  • editor.lineHighlightBackground#0F1C0F
  • editor.selectionBackground#1A4A1A88
  • editor.selectionHighlightBackground#00FF4122
  • editor.wordHighlightBackground#00000000
  • editor.wordHighlightStrongBackground#00000000
  • editor.wordHighlightTextBackground#00000000
  • editorBracketHighlight.foreground1#00FF41
  • editorBracketHighlight.foreground2#FFB86C
  • editorBracketHighlight.foreground3#FF79C6
  • editorBracketHighlight.foreground4#7AD0FF
  • editorBracketHighlight.foreground5#39FF88
  • editorBracketHighlight.foreground6#FF6B8B
  • editorBracketHighlight.unexpectedBracket.foreground#FF3355
  • editorCursor.foreground#7FFF00
  • editorError.foreground#FF3355
  • editorGroup.border#1A3A1A
  • editorGroupHeader.tabsBackground#0C160C
  • editorGroupHeader.tabsBorder#1A3A1A
  • editorHoverWidget.background#0C160C
  • editorHoverWidget.border#00FF4166
  • editorIndentGuide.activeBackground1#00FF41AA
  • editorIndentGuide.background1#1A351A
  • editorInfo.foreground#7AD0FF
  • editorLineNumber.activeForeground#00FF41
  • editorLineNumber.foreground#3D6E3D
  • editorRuler.foreground#1A3A1A
  • editorSuggestWidget.background#0C160C
  • editorSuggestWidget.border#1A3A1A
  • editorSuggestWidget.foreground#D6F0D6
  • editorSuggestWidget.selectedBackground#1A301A
  • editorWarning.foreground#FFB86C
  • editorWhitespace.foreground#1A351A
  • editorWidget.background#0C160C
  • editorWidget.border#1A3A1A
  • focusBorder#00FF41
  • foreground#D6F0D6
  • gitDecoration.addedResourceForeground#00FF41
  • gitDecoration.conflictingResourceForeground#FFB86C
  • gitDecoration.deletedResourceForeground#FF3355
  • gitDecoration.ignoredResourceForeground#3D6E3D
  • gitDecoration.modifiedResourceForeground#7AD0FF
  • gitDecoration.stageDeletedResourceForeground#FF3355BF
  • gitDecoration.stageModifiedResourceForeground#7AD0FFBF
  • gitDecoration.submoduleResourceForeground#FFB86C
  • gitDecoration.untrackedResourceForeground#00FF41
  • input.background#122212
  • input.border#1A3A1A
  • input.foreground#D6F0D6
  • list.activeSelectionBackground#1A3A1A
  • list.activeSelectionForeground#D6F0D6
  • list.focusBackground#1A4A1A
  • list.focusForeground#D6F0D6
  • list.highlightForeground#00FF41
  • list.hoverBackground#122212
  • list.inactiveSelectionBackground#122212
  • list.inactiveSelectionForeground#D6F0D6
  • menu.background#0C160C
  • menu.foreground#D6F0D6
  • menu.selectionBackground#1A301A
  • menu.selectionForeground#D6F0D6
  • panel.background#0C160C
  • panel.border#1A3A1A
  • panelTitle.activeForeground#00FF41
  • panelTitle.inactiveForeground#4D6E4D
  • peekView.border#00FF41
  • peekViewEditor.background#0A120A
  • peekViewResult.background#0C160C
  • scrollbarSlider.activeBackground#3A8A3A88
  • scrollbarSlider.background#1A4A1A80
  • scrollbarSlider.hoverBackground#2A6A2A88
  • sideBar.background#0A120A
  • sideBar.border#1A3A1A
  • sideBar.foreground#D6F0D6
  • sideBarSectionHeader.background#122212
  • sideBarSectionHeader.foreground#00FF41
  • sideBarTitle.foreground#D6F0D6
  • statusBar.background#00AA2A
  • statusBar.debuggingBackground#00FF41
  • statusBar.debuggingForeground#050B05
  • statusBar.foreground#050B05
  • statusBar.noFolderBackground#0C160C
  • statusBar.noFolderForeground#D6F0D6
  • statusBarItem.hoverBackground#1A301A
  • statusBarItem.hoverForeground#D6F0D6
  • tab.activeBackground#080E08
  • tab.activeBorderTop#00FF41
  • tab.activeForeground#D6F0D6
  • tab.border#1A3A1A
  • tab.hoverBackground#122212
  • tab.inactiveBackground#0C160C
  • tab.inactiveForeground#4D6E4D
  • terminal.ansiBlack#050B05
  • terminal.ansiBlue#7AD0FF
  • terminal.ansiBrightBlack#3D6E3D
  • terminal.ansiBrightBlue#A8E0FF
  • terminal.ansiBrightCyan#88FFD5
  • terminal.ansiBrightGreen#39FF88
  • terminal.ansiBrightMagenta#FFA8E0
  • terminal.ansiBrightRed#FF6B8B
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#FFD080
  • terminal.ansiCyan#55FFBB
  • terminal.ansiGreen#00FF41
  • terminal.ansiMagenta#FF79C6
  • terminal.ansiRed#FF3355
  • terminal.ansiWhite#D6F0D6
  • terminal.ansiYellow#FFB86C
  • terminalCursor.foreground#7FFF00
  • titleBar.activeBackground#0A150A
  • titleBar.activeForeground#D6F0D6
  • titleBar.inactiveBackground#050B05
  • titleBar.inactiveForeground#4D6E4D

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment markup.link, comment, punctuation.definition.comment, unused.comment, wildcard.comment, comment.line.number-sign.python, punctuation.definition.comment.python#3D6E3Ditalic
text, source#D6F0D6—
emphasis—italic
strong—bold
invalid#FF3355italic
invalid.deprecated—underline italic
invalid.illegal#E6457Bunderline italic
variable.language.self, entity.type.enum, variable.other.object.property, entity.name.type.enum#FF9243—
entity.name.type#5AFF8Abold
keyword.operator.accessor, entity.name.tag.class.jsx, JSXNested#7AD0FFitalic
keyword.other.unit#00FF41—
keyword.other.special-method, entity.name.other.preprocessor.macro, variable.other.event#FFB86C—
constant.character#55FFBB—
constant.character.escape#FF79C6—
entity.name.label, entity.name.namespace#A8FFC8—
keyword.control.export.js, keyword.control.import.js, keyword.control.export.jsx, keyword.control.import.jsx, keyword.control.export.ts, keyword.control.import.ts, keyword.control.export.tsx, keyword.control.import.tsx, keyword.control.from.python, keyword.control.import.python#66FFA8—
variable, entity.name.variable, variable.other.readwrite.js, variable.other.readwrite.jsx, variable.other.readwrite.ts, variable.other.readwrite.tsx, variable.other.readwrite.python#A8FFC8italic
variable.parameter, variable.parameter.function.js, variable.parameter.function.jsx, variable.parameter.function.ts, variable.parameter.function.tsx, variable.parameter.function.python, variable.parameter.function.language.python, meta.function.parameters.python variable.parameter#FF8AE0italic
entity.name.type.type-parameter#55FFBB
variable.other.object, string.quoted.template variable.other.readwrite, variable.language.arguments#FFFFFFitalic
support.type, support.type.builtin.python, support.type.python, support.type.primitive.ts, support.type.primitive.tsx#55FFBBitalic
entity.name.section, entity.name.type.module, support.type.primitive, variable.other.enummember#FF79C6
keyword.control.default, keyword.control.export, keyword.control.from, keyword.control.import, keyword.control.module, support.type.object.module#FF9EE7—
meta.protocol-list.objc, meta.return-type.objc, meta.return-type, source.go storage.type, source.groovy storage.type, source.java storage.type, source.powershell entity.other.attribute-name#38B3FF—
entity.name.type.class, support.class, variable.other.class, entity.name.class#7AD0FF—
storage.class.std.rust, storage.type.annotation.groovy, storage.type.annotation.java, storage.type.attribute.swift, storage.type.boolean.go, storage.type.byte.go, storage.type.c, storage.type.core.rust, storage.type.cs, storage.type.cs, storage.type.error.go, storage.type.generic.cs, storage.type.generic.groovy, storage.type.generic.java, storage.type.groovy, storage.type.groovy, storage.type.haskell, storage.type.java, storage.type.modifier.cs, storage.type.numeric.go, storage.type.objc, storage.type.object.array.groovy, storage.type.object.array.java, storage.type.ocaml, storage.type.parameters.groovy, storage.type.php, storage.type.primitive.array.groovy, storage.type.primitive.array.java, storage.type.primitive.groovy, storage.type.primitive.java, storage.type.rune.go, storage.type.string.go, storage.type.struct, storage.type.token.java, storage.type.uintptr.go, storage.type.variable.cs, variable.css, variable.scss, entity.other.inherited-class, entity.name.scope-resolution, entity.other.attribute, keyword.primitive-datatypes.swift, keyword.type.cs, storage.type.function.python, storage.type.class.python, storage.type.primitive.ts, storage.type.primitive.tsx, storage.type.interface.ts, storage.type.type.ts#55FFBBitalic
entity.name.function.accessor, entity.name.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal, meta.method-call.java meta.method, meta.method.groovy, keyword.operator.function.infix, keyword.control.require, meta.function-call.python, support.function.builtin.python, support.function.magic.python, entity.name.function.decorator.python#39FF14—
entity.name.function.member, support.function, entity.name.function.method, entity.name.function.method.ts, entity.name.function.method.tsx#66FFA8
keyword.operator#00FF41
support.type.vendored.property-name, variable.other.less, source.coffee.embedded, variable.other.constant.property, keyword.constant.numeric, variable.other.constant.property.js, variable.other.constant.property.jsx, variable.other.constant.property.ts, variable.other.constant.property.tsx#FF79C6
support.type.property-name, variable.other.property, support.type.property-name.svelte, support.type.property-name.postcss, variable.other.property.js, variable.other.property.jsx, variable.other.property.ts, variable.other.property.tsx#7AD0FF
string, meta.embedded.assembly, string.tag, string.value#FFB86C—
meta.implementation storage.type.objc, meta.interface-or-protocol storage.type.objc, source.groovy storage.type.def, storage.type.accessor, storage.type.class.jsdoc, storage.type.property, storage#55FFBBitalic
storage.modifier, storage.type.modifier, entity.name.operator, keyword.control.module.reference, keyword.operator.alignas, keyword.operator.alignof, keyword.operator.cast, keyword.operator.delete, keyword.operator.expression, keyword.operator.in, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.noexcept, keyword.operator.of, keyword.operator.sizeof, keyword.operator.typeid, keyword.operator.typeof, keyword.operator.void, keyword.operator.readonly, keyword.operator.wordlike, keyword.other.operator, source.cpp keyword.operator.new, storage.type.extends, storage.control, keyword.storage, keyword.constant.storage, punctuation.flowtype, meta.object.flowtype, keyword.operator.new, keyword.control.new, storage, keyword.operator.member, keyword.control.directive, keyword.control, punctuation.definition.keyword, keyword.other.important, keyword.other.new, keyword.other, entity.name.type.keyword, entity.name.type.namespace, keyword.other.using, keyword.other.namespace, keyword.control.conditional.python, keyword.control.flow.python, keyword.control.repeat.python, keyword.control.exception.python, keyword.control.svelte, keyword.control.if.svelte, keyword.control.each.svelte, keyword.control.await.svelte, keyword.control.key.svelte, keyword.operator.expression.in.python, keyword.operator.expression.is.python, keyword.operator.expression.not.python#55FFBBitalic
storage.type, storage.type.js, storage.type.function.arrow.ts, storage.type.function.ts, storage.type.interface.ts, storage.type.type.ts#4FE0E0italic bold
variable.other.constant, support.function.magic, variable.other.predefined, constant, constant.variable, constant.language, support.constant, constant.language.boolean.python, constant.language.none.python, constant.language.ellipsis.python#A78BFAbold
constant.numeric, keyword.operator.plus.exponent, keyword.operator.minus.exponent#FF79C6
keyword.expressions-and-types.swift, variable.language, variable.language punctuation.definition.variable.php, variable.other.readwrite.instance.ruby, variable.parameter.function.language.special, variable.language.special.self.python, variable.language.special.cls.python#4FE0E0—
punctuation.section.embedded, meta.string-contents.quoted.double punctuation.definition.variable, punctuation.definition.interpolation.begin, punctuation.definition.interpolation.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.coffee, punctuation.section.embedded.end, punctuation.section.embedded.end source.php, punctuation.section.embedded.end source.ruby, punctuation.definition.variable.makefile#FF79C6—
keyword.operator.decorator, punctuation.decorator, entity.name.class.decorator, variable.other.readwrite.decorator, punctuation.definition.decorator.python, meta.function.decorator.python#FFB86C—
constant.other.color, constant.other.symbol, punctuation.definition.block.tag, punctuation.accessor, punctuation.definition.typeparameters, punctuation.separator, support.class.component#1eff78bold italic
meta.attribute.href.html, punctuation.definition.tag.jsx, punctuation.definition.tag.tsx#fff9fa—
support.type.object.console#2FDE73—
support.type.object.dom#4FE0E0—
variable.interpolation#E6457B—
meta.definition.variable.name#FF9EE7—
meta.object-literal.key, variable.language.this#C0FFD8—
JSXAttrs, JSXNested, support.type.property-name.css, support.type.property-name.scss#15e2e6—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom#2FDE73—
comment keyword.codetag.notation, comment.block.documentation keyword, comment.block.documentation storage.type.class#4FE0E0—
comment.block.documentation entity.name.type punctuation.definition.bracket, comment.block.documentation entity.name.type#2FDE73italic
comment.block.documentation variable#A8FFC8italic
punctuation.separator.parameter, punctuation.terminator.statement, meta.array-binding-pattern-variable, keyword.operator.other.powershell, keyword.other.statement-separator.powershell, meta.brace.curly, meta.brace.round, meta.brace.square, punctuation.definition.arguments.begin, punctuation.definition.arguments.end, punctuation.definition.entity.begin, punctuation.definition.entity.end, punctuation.definition.tag, punctuation.definition.type.begin, punctuation.definition.type.end, punctuation.section.scope.begin, punctuation.section.scope.end, storage.type.generic.java, string.template meta.brace, string.template punctuation.accessor, punctuation.definition.tag.svelte, punctuation.section.embedded.begin.svelte, punctuation.section.embedded.end.svelte#D6F0D6—
punctuation.definition.entity, string.unquoted.heredoc punctuation.definition.string, punctuation.separator.annotation, punctuation.colon.graphql, punctuation.definition.entity.other.inherited-class, punctuation.function.swift, meta.object-binding-pattern-variable punctuation.destructuring, entity.other.attribute-name.placeholder punctuation, constant.other.symbol.hashkey punctuation.definition.constant.ruby, entity.other.attribute-name.pseudo-class punctuation, punctuation.separator.dictionary.key-value, punctuation.separator.hash, punctuation.separator.inheritance, punctuation.separator.key-value.mapping.yaml, punctuation.separator.namespace, punctuation.separator.pointer-access, punctuation.separator.slice#55FFBB—
meta.embedded, source.groovy.embedded#D3D1EB—
entity.name.tag#00FF41—
entity.other.attribute-name#ff3b58—
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class, entity.other.attribute-name.class, entity.other.attribute-name.class.mixin, entity.other.attribute-name.parent-selector, entity.other.attribute-name.attribute, meta.group.double.toml, meta.group.toml, support.other.chomping-indicator.yaml, entity.other.attribute-name.id#7AD0FF—
support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color#50B6FF—
support.constant.property-value#D3D1EB—
punctuation.separator.key-value#4FE0E0—
punctuation.definition.constant#FF9EE7—
meta.property-list punctuation.separator.key-value#D3D1EB—
meta.selector#4FE0E0—
header#BA95B3—
constant.other.object.key string.unquoted, punctuation.quasi.element, keyword.other.definition, variable.language.prototype, variable.other.jsdoc#F84364—
punctuation.definition.block.scalar.folded.yaml, punctuation.definition.block.scalar.literal.yaml, punctuation.definition.block.sequence.item.yaml#AB80FF—
meta.preprocessor, entity.name.function.preprocessor#E6E667—
meta.preprocessor.string#50B6FF—
meta.preprocessor.numeric#ff76dd—
meta.structure.dictionary.key.python#D74BBE—
meta.diff.header#4FE0E0—
meta.decorator variable.other.readwrite, meta.decorator variable.other.property, meta.decorator variable.other.object#d3d3d3—
entity.name.function.target.makefile, entity.name.section.toml, variable.other.key.toml#D74BBE—
constant.other.date, constant.other.timestamp#4FE0E0—
meta.indexer.mapped type.declaration entity.name.type, meta.type.parameters entity.name.type#D3D1EB—
punctuation.support.type.property-name.begin, punctuation.support.type.property-name.end#D74BBE—
string.quoted.docstring.multi, string.quoted.docstring.multi.python punctuation.definition.string.begin, string.quoted.docstring.multi.python punctuation.definition.string.end, string.quoted.docstring.multi.python constant.character.escape, string.quoted.docstring.single.python, string.quoted.docstring.single.python punctuation.definition.string.begin, string.quoted.docstring.single.python punctuation.definition.string.end#66CCBB—
source.shell variable.other#2FDE73—
meta.scope.prerequisites.makefile#50B6FF—
support.function.git-rebase#FF9EE7—
constant.sha.git-rebase#FF9EE7—
markup.underline—underline
punctuation.definition.bold.markdown, markup.bold#f9f9f9e5
markup.italic#2FDE73italic
beginning.punctuation.definition.list.markdown, entity.name.section.markdown, markup.heading.setext, markup.heading, punctuation.definition.heading.markdown, punctuation.definition.list.begin.markdown, text.html.markdown invalid.deprecated, text.html.markdown punctuation.definition.tag#FFB86C—
markup.heading punctuation.definition.heading#E6E667—
markup.error, markup.deleted#fa5170—
markup.fenced_code.block.markdown, markup.inline.raw.markdown, markup.inline.raw.string.markdown, markup.inline.raw, markup.inserted, markup.raw.block.markdown, markup.raw, punctuation.definition.markdown, punctuation.definition.raw.markdown#2FDE73—
constant.other.reference.link.markdown, string.other.link.description.markdown, string.other.link.title.markdown#FF9EE7—
markup.changed, punctuation.definition.constant.begin.markdown, punctuation.definition.constant.end.markdown, punctuation.definition.constant.markdown, punctuation.definition.metadata.markdown, punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, string.other.link.description.title.markdown, text.html.markdown string.quoted#AB80FF—
beginning.punctuation.definition.quote.markdown, markup.link, markup.quote.markdown, markup.quote, markup.underline.link.image.markdown, markup.underline.link.markdown, meta.attribute.href.html string.quoted.double.html, meta.attribute.href.html string.quoted.single.html, punctuation.definition.link.restructuredtext#34fde6—
string.regexp, constant.regexp, keyword.operator.or.regexp#39FF14—
constant.character.escape.backslash.regexp, meta.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, support.other.parenthesis.regexp#4FE0E0—
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp, punctuation.definition.group.regexp, punctuation.definition.group.capture.regexp, keyword.control.anchor.regexp#AB80FF—
keyword.operator.quantifier.regexp#E6E667—
keyword.operator.negation.regexp, constant.character.regexp, punctuation.definition.range.regexp#FF9EE7—
keyword.control.new, keyword.operator.new—bold italic
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—
entity.name.tag, entity.name.tag.class.js, entity.name.tag.class.jsx, entity.name.tag.svelte, entity.name.tag.script.svelte, entity.name.tag.style.svelte#00FF41—
storage.type.accessor, entity.name.tag.class, entity.name.tag.id, support.class.component.svelte, entity.name.tag.component.svelte#39FF14
entity.other.attribute-name, entity.other.attribute-name.svelte, entity.other.attribute-name.event.svelte, entity.other.attribute-name.bind.svelte, entity.other.attribute-name.transition.svelte, entity.other.attribute-name.animation.svelte, entity.other.attribute-name.action.svelte, entity.other.attribute-name.directive.svelte#7AD0FFitalic
SeeSharp Theme by Armant Goldswain - VS Code Theme