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.activeBorder#A084CA
  • activityBar.background#161b22
  • activityBar.foreground#FFF7F0
  • activityBar.inactiveForeground#6e7681
  • activityBarBadge.background#A084CA
  • activityBarBadge.foreground#161b22
  • editor.background#0d1117
  • editor.foreground#FFF7F0
  • editor.lineHighlightBackground#161b22
  • editor.selectionBackground#264f78
  • editor.selectionHighlightBackground#3b3b3b60
  • editorCursor.foreground#FFD700
  • editorGroupHeader.tabsBackground#161b22
  • editorIndentGuide.activeBackground1#FFD700
  • editorIndentGuide.background1#21262d
  • editorLineNumber.activeForeground#FFD700
  • editorLineNumber.foreground#7C6BA0
  • panel.background#161b22
  • panel.border#A084CA
  • sideBar.background#161b22
  • sideBar.foreground#FFF7F0
  • sideBarSectionHeader.background#21262d
  • sideBarSectionHeader.foreground#A084CA
  • statusBar.background#161b22
  • statusBar.debuggingBackground#FFD700
  • statusBar.debuggingForeground#161b22
  • statusBar.foreground#FFF7F0
  • statusBar.noFolderBackground#161b22
  • tab.activeBackground#21262d
  • tab.activeBorder#A084CA
  • tab.activeForeground#A084CA
  • tab.border#21262d
  • tab.inactiveBackground#161b22
  • tab.inactiveForeground#7C6BA0
  • tab.unfocusedActiveBorder#FFD70099
  • titleBar.activeBackground#161b22
  • titleBar.activeForeground#FFF7F0
  • titleBar.inactiveBackground#0d1117
  • titleBar.inactiveForeground#6e7681

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment.line, comment.block#7C6BA0italic
keyword, keyword.control.go#A084CAbold
entity.name.function, entity.name.function.go#FFD700italic
variable, variable.other.go#FFF7F0
string, string.quoted.double.go, string.quoted.single.go#A084CA
constant.numeric, constant.numeric.go#FFD700
storage.type, storage.type.go#A084CAbold
entity.name.namespace.go#A084CAbold
entity.name.import.go, variable.other.package.go#7C6BA0bold
entity.name.import.path.go#FFD700bold underline
entity.name.type, entity.name.type.go#A084CAbold
source.go#FFF7F0
entity.name.tag.yaml#FFD700bold
entity.name.anchor.yaml#A084CAbold underline
entity.name.alias.yaml#FFD700bold
string.unquoted.plain.out.yaml#3B4D9B
string.quoted.double.yaml, string.quoted.single.yaml#A084CA
constant.numeric.yaml#3B4D9B
constant.language.boolean.yaml#FFD700bold
constant.language.null.yaml#7C6BA0italic
comment.line.number-sign.yaml#7C6BA0italic
support.type.property-name.json, meta.object-literal.key.js, meta.object-literal.key.ts, meta.object-literal.key.tsx#FFD700bold
string.value.json, string.quoted.double.js, string.quoted.single.js, string.quoted.double.ts, string.quoted.single.ts, string.quoted.double.tsx, string.quoted.single.tsx#A084CA
constant.numeric.json, constant.numeric.js, constant.numeric.ts, constant.numeric.tsx#FFD700
constant.language.boolean.json, constant.language.boolean.js, constant.language.boolean.ts, constant.language.boolean.tsx#FFD700bold
constant.language.null.json, constant.language.null.js, constant.language.null.ts, constant.language.null.tsx#7C6BA0italic
comment.line.double-slash.js, comment.line.double-slash.ts, comment.line.double-slash.tsx, comment.block.documentation.js, comment.block.documentation.ts, comment.block.documentation.tsx#7C6BA0italic
punctuation.separator.key-value.json, punctuation.separator.key-value.js, punctuation.separator.key-value.ts, punctuation.separator.key-value.tsx#FFD700
punctuation.definition.block.js, punctuation.definition.block.ts, punctuation.definition.block.tsx#A084CA
keyword.control.makefile#FFD700bold
variable.assignment.makefile#A084CAbold
entity.name.function.target.makefile#FFD700bold underline
meta.scope.target.makefile#A084CAbold
meta.scope.prerequisites.makefile#A084CA
string.quoted.double.makefile, string.quoted.single.makefile#A084CA
comment.line.number-sign.makefile#7C6BA0italic
comment.line.double-slash.makefile#7C6BA0italic
keyword.control.terraform#A084CAbold
variable.other.terraform#FFF7F0
entity.name.function.terraform#A084CAitalic
entity.name.type.terraform#A084CAbold
string.quoted.double.terraform, string.quoted.single.terraform#FFD700
constant.numeric.terraform#FFD700
constant.language.boolean.terraform#A084CAbold
comment.line.number-sign.terraform#8b949eitalic
support.constant.terraform#FFD700bold
punctuation.definition.block.terraform#A084CA
support.function.builtin.terraform#A084CAbold italic
variable.other.readwrite.terraform#A084CAitalic

Shiki preview

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

Loading...