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#21252A
  • activityBarBadge.background#d4306f
  • debugIcon.continueForeground#67E1DD
  • debugIcon.restartForeground#E36E9B
  • debugIcon.startForeground#ABF076
  • debugIcon.stepIntoForeground#F0D060
  • debugIcon.stepOutForeground#F0D060
  • debugIcon.stepOverForeground#67E1DD
  • debugIcon.stopForeground#F26664
  • debugTokenExpression.boolean#82B7FF
  • debugTokenExpression.error#F26664
  • debugTokenExpression.name#CD76FC
  • debugTokenExpression.number#82B7FF
  • debugTokenExpression.string#00DC9E
  • debugTokenExpression.value#CCCCCC
  • debugToolBar.background#21252A
  • diffEditor.insertedTextBackground#1732167b
  • diffEditor.removedTextBackground#5b002366
  • dropdown.background#21252A
  • editor.background#21252A
  • editor.findMatchBackground#8a741e
  • editor.foreground#DDDDDD
  • editor.lineHighlightBackground#2a2f36
  • editor.selectionBackground#304052
  • editor.selectionHighlightBackground#333c47
  • editorGroupHeader.tabsBackground#21252A
  • editorGutter.addedBackground#0d5e31
  • editorGutter.deletedBackground#76162f
  • editorGutter.modifiedBackground#1e5382
  • editorIndentGuide.activeBackground#4a5c72
  • editorIndentGuide.background#2c3744
  • editorLineNumber.activeForeground#FF65A0
  • editorLineNumber.foreground#445468
  • editorWidget.background#21252A
  • input.background#253344
  • menu.background#21252A
  • panel.background#21252A
  • peekViewEditor.background#192029
  • peekViewEditor.matchHighlightBackground#213042
  • sideBar.background#21252A
  • sideBar.border#445468
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#1A1A1A
  • statusBar.debuggingBackground#21252A
  • statusBar.foreground#DDDDDD
  • statusBar.noFolderBackground#21252A
  • tab.activeBorder#FF65A0
  • tab.activeForeground#dadada
  • tab.border#21252A
  • tab.hoverBackground#181f25
  • tab.inactiveBackground#21252A
  • tab.inactiveForeground#4f6279
  • textCodeBlock.background#21252A
  • titleBar.activeBackground#21252A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#DDDDDD
comment, markup.quote.markdown, meta.diff, meta.diff.header#637384
string.quoted.docstring.multi, comment.block.documentation.c, storage.type.class.gtkdoc#42586F
support.type.exception#F26664
#EE3C36
#E36E9B
keyword.control.flow, keyword.control.c, keyword.control.if.cpp, keyword.control.else.cpp, keyword.control.while.cpp, keyword.control.for.cpp, keyword.control.return.cpp, keyword.control.break.cpp, storage.type.class.cpp, storage.type.modifier.access.control.private.cpp, storage.type.modifier.access.control.public.cpp, storage.type.modifier.access.control.protected.cpp, keyword.other.typedef#E20272
meta.function.python, entity.other.inherited-class, storage.type.built-in.primitive.c, storage.type.built-in.primitive.cpp, support.type.python#FF9AD2
keyword.control, storage.type, punctuation.definition.decorator.python, keyword.other.using.directive.cpp, storage.modifier.declaration.python#F53CA8
entity.name.function.python, support.type.property-name.json, meta.function.c, entity.name.namespace.cpp, entity.name.scope-resolution.cpp, entity.name.function.preprocessor#CD76FC
support.function.magic, entity.name.function.definition.special.constructor.cpp, entity.name.function.definition.special.member.destructor.cpp#9966FF
constant.numeric, constant.language, constant.character.escape#82B7FF
storage.type.number, keyword.other.unit.hexadecimal.cpp#0090ff
variable.parameter.function.language, variable.parameter.function-call.python, meta.function.definition.parameters.c#67E1DD
variable.language.special.self, entity.name.type.class, entity.name.type.class.cpp, variable.language.this.cpp, support.type#00C1E8
meta.function-call.generic.python, entity.name.function.decorator.python, entity.name.function.c, entity.name.function.call.cpp, entity.name.function.member.cpp, entity.name.function.definition.cpp#ABF076
string#00DC9E
support.function.builtin, keyword.operator.sizeof.c, keyword.operator.sizeof.cpp#F2DE7D
support.variable.magic#E4B816
punctuation.separator, punctuation.section.function.begin, punctuation.section.class.begin, punctuation.definition.arguments.begin, punctuation.definition.arguments.end, punctuation.section.function.begin, punctuation.section.function.end, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, punctuation.definition.inheritance.begin, punctuation.definition.inheritance.end, punctuation.definition.list.begin, punctuation.definition.list.end, punctuation.section.function.lambda.begin.python, punctuation.terminator.statement.cpp, punctuation.terminator.statement.c, punctuation.section, punctuation.definition.begin.bracket.square.c, punctuation.definition.end.bracket.square.c, punctuation.separator.pointer-access.c#ffa23f
keyword.operator#ff590c
keyword.control.import, keyword.control.directive.include.c, keyword.control.directive.include.cpp#B88E70
#9C6E4C
keyword.operator.logical, keyword.control, storage.type, keyword.control.import, keyword.other.typedefitalic
keyword.codetag.notation.python, storage.type.class.gtkdocunderline
keyword.codetag.notation, entity.name.function.python, entity.name.type.class, support.function.magic, entity.name.function.definition.cppbold
storage.type.format, storage.type.number, entity.name.function.decorator.python, entity.name.function.preprocessor, meta.function.definition.parameters.c, entity.name.type.class.templated, entity.name.function.definition.cpp, storage.type.struct.c, storage.type.built-in.primitive.c, storage.type.union.c