Skip to main content
CodingTheme

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#F2F2F2
  • activityBar.foreground#2E2E2E
  • activityBar.inactiveForeground#A7A7A7
  • breadcrumb.focusForeground#2E2E2E
  • breadcrumb.foreground#757575
  • editor.background#F2F2F2
  • editor.foreground#474747
  • editor.lineHighlightBackground#DCDCDC
  • editor.selectionBackground#BCBCBC
  • editorCursor.background#F2F2F2
  • editorCursor.foreground#2E2E2E
  • editorGroupHeader.tabsBackground#F2F2F2
  • editorInlayHint.background#F2F2F2
  • editorInlayHint.foreground#757575
  • editorInlayHint.parameterBackground#F2F2F2
  • editorInlayHint.parameterForeground#757575
  • editorInlayHint.typeBackground#F2F2F2
  • editorInlayHint.typeForeground#757575
  • editorLineNumber.activeForeground#2E2E2E
  • editorLineNumber.foreground#A7A7A7
  • editorWidget.background#DCDCDC
  • focusBorder#A7A7A7
  • foreground#474747
  • list.activeSelectionBackground#BCBCBC
  • list.focusBackground#BCBCBC
  • list.highlightForeground#2E2E2E
  • rust_analyzer.inlayHints.foreground#757575
  • sideBar.background#F2F2F2
  • statusBar.background#F2F2F2
  • statusBar.debuggingBackground#F2F2F2
  • statusBar.foreground#A7A7A7
  • statusBar.noFolderBackground#F2F2F2
  • tab.activeBackground#DCDCDC
  • tab.activeForeground#2E2E2E
  • tab.inactiveBackground#F2F2F2
  • tab.inactiveForeground#757575
  • terminal.ansiBlack#DCDCDC
  • terminal.ansiBlue#5898B7
  • terminal.ansiBrightBlack#757575
  • terminal.ansiBrightBlue#5D7587
  • terminal.ansiBrightCyan#6F6F89
  • terminal.ansiBrightGreen#6A775E
  • terminal.ansiBrightMagenta#866870
  • terminal.ansiBrightRed#BB7D72
  • terminal.ansiBrightWhite#2E2E2E
  • terminal.ansiBrightYellow#757358
  • terminal.ansiCyan#6F6F89
  • terminal.ansiGreen#667953
  • terminal.ansiMagenta#866870
  • terminal.ansiRed#BB7D72
  • terminal.ansiWhite#474747
  • terminal.ansiYellow#757358
  • terminal.foreground#474747
  • terminalCursor.background#F2F2F2
  • terminalCursor.foreground#2E2E2E
  • titleBar.activeBackground#F2F2F2
  • titleBar.activeForeground#474747
  • titleBar.inactiveBackground#F2F2F2
  • titleBar.inactiveForeground#A7A7A7

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword#5D7587
storage#5D7587
variable.language.self#5D7587
variable.language.this#5D7587
keyword.type.go#5D7587
keyword.control#5898B7
entity.name.type#757358
keyword.type#757358
storage.type.cs#757358
storage.type.java#757358
storage.type.boolean.go#757358
storage.type.byte.go#757358
storage.type.error.go#757358
storage.type.numeric.go#757358
storage.type.rune.go#757358
storage.type.string.go#757358
storage.type.uintptr.go#757358
entity.name.type.interface#5898B7
entity.name.type.type-parameter#5898B7
constant#866870
constant.numeric#AB7DA7
string#667953
entity.name.variable.field#6F6F89
entity.name.variable.property#6F6F89
variable.other.member#6F6F89
variable.other.object.property#6F6F89
variable.other.readwrite.instance#6F6F89
support.type.property-name#6F6F89
entity.name.variable.enum-member#6F6F89
constant.other.enum#6F6F89
variable.other.enummember#6F6F89
entity.name.type.option#6F6F89
entity.name.type.result#6F6F89
entity.name.function.macro#6A775E
entity.name.function.preprocessor#6A775E
constant.other.placeholder#6F6F89
punctuation.definition.interpolation#6F6F89
punctuation.section.embedded#6F6F89
constant.character.escape#6F6F89
comment#2E2E2Eitalic
comment.line.documentation#2E2E2E
comment.block.documentation#2E2E2E
comment.block.javadoc#2E2E2E
entity.name.function.decorator#757575
storage.type.annotation#757575
punctuation.definition.annotation#757575
keyword.operator#474747
markup.deleted#BB7D72
markup.inserted#667953
markup.changed#5898B7
meta.diff#A7A7A7
comment.line.number-sign.git-commit#757575
invalid.deprecated.line-too-long.git-commit#866870
invalid.illegal.line-too-long.git-commit#BB7D72
magit.entity#667953
magit.header#5D7587
magit.subheader#5898B7

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

sema by arzg - VS Code Theme