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#ffd6e0
  • activityBar.foreground#d87093
  • activityBarBadge.background#ff69b4
  • activityBarBadge.foreground#ffffff
  • button.background#ff69b4
  • button.foreground#ffffff
  • dropdown.background#fff0f5
  • dropdown.foreground#d87093
  • editor.background#ffefef
  • editor.foreground#d87093
  • editor.lineHighlightBackground#fff0f5
  • editor.selectionBackground#ffb6c1
  • editor.selectionHighlightBackground#ffb6c180
  • editor.wordHighlightBackground#ffb6c180
  • editorCursor.foreground#ff69b4
  • editorGroupHeader.tabsBackground#ffe4e8
  • editorIndentGuide.activeBackground#ffb6c1
  • editorIndentGuide.background#ffe4e8
  • editorWhitespace.foreground#ffe4e8
  • focusBorder#ff69b4
  • input.background#fff0f5
  • input.foreground#d87093
  • input.placeholderForeground#ff77a8
  • list.activeSelectionBackground#ffefef
  • list.activeSelectionForeground#d87093
  • list.hoverBackground#fff0f5
  • list.hoverForeground#d87093
  • sideBar.background#fff0f5
  • sideBar.foreground#d87093
  • sideBarTitle.foreground#ff69b4
  • statusBar.background#ffd6e0
  • statusBar.foreground#d87093
  • statusBar.noFolderBackground#ffefef
  • tab.activeBackground#ffefef
  • tab.activeForeground#d87093
  • tab.inactiveBackground#ffd6e0
  • tab.inactiveForeground#ff77a8
  • terminal.ansiBlack#ffe4e8
  • terminal.ansiBlue#db7093
  • terminal.ansiBrightBlack#ffefef
  • terminal.ansiBrightBlue#f08080
  • terminal.ansiBrightCyan#ffc0cb
  • terminal.ansiBrightGreen#ff77a8
  • terminal.ansiBrightMagenta#ff9aac
  • terminal.ansiBrightRed#ff0066
  • terminal.ansiBrightWhite#fff5f7
  • terminal.ansiBrightYellow#ffa6c9
  • terminal.ansiCyan#ffafc5
  • terminal.ansiGreen#ff69b4
  • terminal.ansiMagenta#ff85a2
  • terminal.ansiRed#ff1493
  • terminal.ansiWhite#ffd1dc
  • terminal.ansiYellow#ffb6c1
  • terminal.background#ffefef
  • terminal.foreground#d87093
  • titleBar.activeBackground#ffd6e0
  • titleBar.activeForeground#d87093

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#e5a3b5italic
string, string.quoted.single, string.quoted.double, string.quoted.triple, string.template, constant.character, constant.other.symbol#ff69b4
constant.numeric, constant.language, constant.character.escape, constant.other, support.constant#c96385
variable, variable.other, variable.parameter, variable.language, variable.object.property#d87093
keyword, keyword.control, keyword.operator, keyword.other, storage.type, storage.modifier, punctuation.decorator#e35a8f
entity.name.function, entity.name.method, support.function, meta.function-call, meta.method-call, meta.function.dart#d45a88
entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.union, entity.name.trait, entity.name.interface, support.class, support.type, meta.return-type#ff77a8bold
meta.decorator, meta.annotation, punctuation.definition.annotation#c96385
entity.name.tag, punctuation.definition.tag#e35a8f
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.css, support.type.property-name.css, entity.other.attribute-name.class#ff77a8
support.type.primitive, support.type.builtin, keyword.type, storage.type.primitive, storage.type.built-in, support.type.primitive.dart#ff77a8
string.regexp, constant.character.escape.regex#ff69b4
markup.heading, entity.name.section#d45a88bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.fenced_code, markup.raw#ff69b4
support.type.property-name.json, support.type.property-name.jsonc#ff77a8
keyword.operator.expression, keyword.operator.new, keyword.operator.optional, keyword.operator.comparison, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.logical#e35a8f
meta.embedded, source.groovy.embedded, meta.template.expression#d87093
meta.object-literal.key, variable.object.property, variable.other.property, variable.other.object.property#ff77a8
support.variable.property, support.variable.object.process, support.variable.object.node#ff77a8
source.rust storage.type.rust, source.rust entity.name.type.rust, source.rust entity.name.type.struct.rust#ff77a8
source.rust keyword.operator, source.rust keyword.operator.arithmetic, source.rust keyword.operator.logical#e35a8f
source.python support.type.python, source.python support.function.builtin.python#d45a88
source.cs entity.name.type.class.cs, source.cs storage.type.cs#ff77a8
source.dart support.class.dart, source.dart support.type.dart#ff77a8
source.prisma keyword.operator, source.prisma constant.language, source.prisma keyword.type#e35a8f
source.graphql support.type, source.graphql constant.character#ff77a8
source.sql keyword.other, source.sql storage.type#e35a8f
meta.jsx.children, meta.embedded.block.tsx, meta.embedded.block.jsx#d87093
meta.decorator.ts, meta.decorator.tsx, meta.decorator.angular#c96385
Naomi's Themes by NHCarrigan - VS Code Theme