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.activeBorder#FF3399
  • activityBar.background#2B3731
  • activityBar.dropBorder#FF3399
  • activityBar.foreground#FF3399
  • activityBar.inactiveForeground#29CD7B
  • activityBarBadge.background#24B46C
  • badge.background#24B46C
  • breadcrumb.activeSelectionForeground#FF3399
  • breadcrumb.focusForeground#FF3399
  • button.background#2B3731
  • button.foreground#E0E0E0
  • button.hoverBackground#3E5047
  • button.secondaryBackground#15693F
  • button.secondaryForeground#FFFFFF
  • button.secondaryHoverBackground#1A824E
  • chat.requestBubbleBackground#181E1B80
  • chat.requestBubbleHoverBackground#2B373180
  • checkbox.foreground#FF3399
  • contrastActiveBorder#FF3399
  • contrastBorder#15693F
  • dropdown.background#181E1B
  • dropdown.listBackground#181E1B
  • editor.background#1A1A1A
  • editor.foldBackground#1A824E80
  • editor.foreground#E0E0E0
  • editor.lineHighlightBorder#648273
  • editor.selectionBackground#69153F
  • editor.selectionForeground#FFFFFF
  • editorBracketHighlight.foreground1#FCFC30
  • editorBracketHighlight.foreground2#FC30FC
  • editorBracketHighlight.foreground3#30FCFC
  • editorGroupHeader.tabsBackground#061E12
  • editorGutter.foldingControlForeground#FF3399
  • editorLineNumber.activeForeground#29CD7B
  • editorLineNumber.foreground#51695D
  • editorStickyScrollHover.background#370B21
  • editorUnicodeHighlight.border#779B89
  • editorWidget.background#2B3731
  • editorWidget.border#24B46C
  • focusBorder#FF3399
  • foreground#E0E0E0
  • input.background#181E1B
  • inputOption.activeBorder#FF3399
  • keybindingLabel.border#33FF99
  • keybindingLabel.bottomBorder#FF3399
  • list.hoverBackground#00000000
  • menu.background#2B3731
  • menu.border#24B46C
  • menu.separatorBackground#24B46C
  • panelTitle.activeBorder#061E12
  • pickerGroup.border#24B46C
  • pickerGroup.foreground#33FF99
  • sideBar.background#181E1B
  • sideBarSectionHeader.background#0B3721
  • statusBar.background#15693F
  • statusBar.debuggingBackground#69153F
  • statusBar.noFolderBackground#105030
  • tab.activeForeground#E0E0E0
  • tab.inactiveBackground#061E12
  • tab.inactiveForeground#E0E0E0
  • textPreformat.background#3E5047
  • textPreformat.foreground#FF3399
  • titleBar.activeBackground#105030
  • titleBar.activeForeground#E0E0E0
  • titleBar.inactiveBackground#2B3731
  • titleBar.inactiveForeground#C3FFE1
  • widget.border#24B46C

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
markup.bold#FDB975bold
markup.italic#FDB975italic
markup.strikethroughstrikethrough
markup.underlineunderline
markup.inserted#20A820
markup.deleted#A82020
markup.changed#2020A8
invalid#FC3030
comment, punctuation.definition.comment#949494italic
meta.preprocessor, keyword.operator, punctuation.accessor, punctuation.definition, punctuation.math, punctuation.other, punctuation.section, punctuation.separator, punctuation.terminator, storage.type.function.arrow#E0E0E0
constant.character, constant.language, constant.numeric, constant.other, punctuation.definition.bold, punctuation.separator.pointer-access#FAC832
punctuation.definition.string, string, punctuation.definition.quote#C8FA32
entity.name.section, markup.heading, heading, punctuation.definition.heading#64FA32bold
constant.other.caps, entity.name.namespace, entity.name.scope-resolution, entity.name.type, keyword.declaration, keyword.struct#50C828
entity.name.tag, entity.name.variable.event#28C8A0
constant.character.math, entity.name.variable, entity.other.attribute-name, markup.inline, meta.attribute, meta.function-call.arguments, meta.member, meta.object.member, meta.property-value, punctuation.definition.constant.math, storage.modifier.import, support.class.math, support.type.property-name, variable#32C8FA
entity.name.variable.parameter, meta.parameter.initialization, variable.parameter#7A9AFAitalic
constant.other.general.math, entity.name.function, keyword.operator.sizeof, meta.function-call.generic, support.function#9A7AFA
keyword.control, keyword.operator.delete, keyword.operator.expression.new, keyword.operator.new, keyword.other, keyword.other.type, keyword.type, punctuation.definition.directive, storage.modifier, storage.type.modifier, storage.type#FA7A9A