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.
key HEX RGB RGBA activityBar.activeBorder
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) activityBar.background
#09090B RGB(9, 9, 11) RGBA(9, 9, 11, 1) activityBar.border
#3F3F46 RGB(63, 63, 70) RGBA(63, 63, 70, 1) activityBar.foreground
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) activityBarBadge.background
#FF8B38 RGB(255, 139, 56) RGBA(255, 139, 56, 1) activityBarBadge.foreground
#18181B RGB(24, 24, 27) RGBA(24, 24, 27, 1) editor.background
#18181B RGB(24, 24, 27) RGBA(24, 24, 27, 1) editor.foreground
#E4E4E7 RGB(228, 228, 231) RGBA(228, 228, 231, 1) editorGroup.border
#3F3F46 RGB(63, 63, 70) RGBA(63, 63, 70, 1) editorGroupHeader.border
#00000000 RGB(0, 0, 0) RGBA(0, 0, 0, 0) editorGroupHeader.tabsBorder
#00000000 RGB(0, 0, 0) RGBA(0, 0, 0, 0) editorGutter.addedBackground
#4ADE8033 RGB(74, 222, 128) RGBA(74, 222, 128, 0.2) editorGutter.modifiedBackground
#FB923C52 RGB(251, 146, 60) RGBA(251, 146, 60, 0.322) editorLineNumber.activeForeground
#52525B RGB(82, 82, 91) RGBA(82, 82, 91, 1) editorLineNumber.foreground
#52525B99 RGB(82, 82, 91) RGBA(82, 82, 91, 0.6) focusBorder
#00000000 RGB(0, 0, 0) RGBA(0, 0, 0, 0) keybindingLabel.background
#00000000 RGB(0, 0, 0) RGBA(0, 0, 0, 0) keybindingLabel.border
#71717A33 RGB(113, 113, 122) RGBA(113, 113, 122, 0.2) keybindingLabel.bottomBorder
#71717A33 RGB(113, 113, 122) RGBA(113, 113, 122, 0.2) keybindingLabel.foreground
#71717A RGB(113, 113, 122) RGBA(113, 113, 122, 1) keybindingLabel.foregroundActive
#71717A RGB(113, 113, 122) RGBA(113, 113, 122, 1) list.activeSelectionBackground
#FFB57122 RGB(255, 181, 113) RGBA(255, 181, 113, 0.133) list.activeSelectionForeground
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) list.focusHighlightForeground
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) list.highlightForeground
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) list.inactiveFocusBackground
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) panel.background
#09090B RGB(9, 9, 11) RGBA(9, 9, 11, 1) quickInput.background
#27272A RGB(39, 39, 42) RGBA(39, 39, 42, 1) sideBar.background
#09090B RGB(9, 9, 11) RGBA(9, 9, 11, 1) sideBar.border
#3F3F46 RGB(63, 63, 70) RGBA(63, 63, 70, 1) sideBar.foreground
#6B7280 RGB(107, 114, 128) RGBA(107, 114, 128, 1) sideBarTitle.foreground
#BBBBBB RGB(187, 187, 187) RGBA(187, 187, 187, 1) statusBar.background
#09090B55 RGB(9, 9, 11) RGBA(9, 9, 11, 0.333) statusBar.border
#3F3F46 RGB(63, 63, 70) RGBA(63, 63, 70, 1) statusBar.debuggingBackground
#FFB57133 RGB(255, 181, 113) RGBA(255, 181, 113, 0.2) statusBar.foreground
#E4E4E7 RGB(228, 228, 231) RGBA(228, 228, 231, 1) statusBarItem.remoteBackground
#00000000 RGB(0, 0, 0) RGBA(0, 0, 0, 0) statusBarItem.remoteForeground
#E4E4E7 RGB(228, 228, 231) RGBA(228, 228, 231, 1) tab.activeBackground
#18181B RGB(24, 24, 27) RGBA(24, 24, 27, 1) tab.activeBorder
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) tab.activeBorderTop
#18181B RGB(24, 24, 27) RGBA(24, 24, 27, 1) tab.inactiveBackground
#18181B RGB(24, 24, 27) RGBA(24, 24, 27, 1) terminal.background
#09090B RGB(9, 9, 11) RGBA(9, 9, 11, 1) textLink.foreground
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) titleBar.activeBackground
#09090B RGB(9, 9, 11) RGBA(9, 9, 11, 1) titleBar.border
#3F3F46 RGB(63, 63, 70) RGBA(63, 63, 70, 1)
tokenColors Foregrounds this theme assigns to the token scope catalog. A rule with only a font style is skipped, and a longer matching scope wins. Italic and bold rules are not listed — the preview above shows them in the code.
scope HEX RGB RGBA comment
#52525B RGB(82, 82, 91) RGBA(82, 82, 91, 1) comment.block
#52525B RGB(82, 82, 91) RGBA(82, 82, 91, 1) comment.block.documentation
#52525B RGB(82, 82, 91) RGBA(82, 82, 91, 1) comment.line
#52525B RGB(82, 82, 91) RGBA(82, 82, 91, 1) constant
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.character
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.character.escape
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.numeric
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.numeric.integer
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.numeric.float
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.numeric.hex
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.numeric.octal
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.other
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.other.placeholder
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.regexp
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) constant.rgb-value
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) entity
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.class
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.function
#C7B5FD RGB(199, 181, 253) RGBA(199, 181, 253, 1) entity.name.method
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.namespace
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.section
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.selector
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.tag
#A1A1AA RGB(161, 161, 170) RGBA(161, 161, 170, 1) entity.name.type
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.type.enum
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.type.interface
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.name.type.struct
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.other
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) entity.other.attribute-name
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) entity.other.inherited-class
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) keyword
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) keyword.control
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) keyword.control.flow
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) keyword.operator
#A1A1AA RGB(161, 161, 170) RGBA(161, 161, 170, 1) keyword.operator.new
#A1A1AA RGB(161, 161, 170) RGBA(161, 161, 170, 1) keyword.operator.assignment
#A1A1AA RGB(161, 161, 170) RGBA(161, 161, 170, 1) keyword.operator.arithmetic
#A1A1AA RGB(161, 161, 170) RGBA(161, 161, 170, 1) keyword.operator.logical
#A1A1AA RGB(161, 161, 170) RGBA(161, 161, 170, 1) keyword.other
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) meta
#E4E4E7 RGB(228, 228, 231) RGBA(228, 228, 231, 1) meta.function-call
#E4E4E7 RGB(228, 228, 231) RGBA(228, 228, 231, 1) meta.preprocessor
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) punctuation.definition.bracket
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) punctuation.definition.comment
#52525B RGB(82, 82, 91) RGBA(82, 82, 91, 1) punctuation.definition.string.begin
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) punctuation.definition.string.end
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) punctuation.separator
#C7B5FD55 RGB(199, 181, 253) RGBA(199, 181, 253, 0.333) punctuation.separator.continuation
#C7B5FD55 RGB(199, 181, 253) RGBA(199, 181, 253, 0.333) punctuation.terminator
#C7B5FD RGB(199, 181, 253) RGBA(199, 181, 253, 1) storage
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) storage.modifier
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) storage.type
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) string
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.interpolated
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.other
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.quoted
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.quoted.double
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.quoted.other
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.quoted.single
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.quoted.triple
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.regexp
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.template
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) string.unquoted
#AAD94C RGB(170, 217, 76) RGBA(170, 217, 76, 1) support
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) support.class
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) support.constant
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) support.function
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) support.other
#C7B5FD55 RGB(199, 181, 253) RGBA(199, 181, 253, 0.333) support.type
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) support.type.primitive
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) support.type.property-name
#FFD4A8 RGB(255, 212, 168) RGBA(255, 212, 168, 1) support.variable
#E0D6FE RGB(224, 214, 254) RGBA(224, 214, 254, 1) variable
#D4D4D8 RGB(212, 212, 216) RGBA(212, 212, 216, 1) variable.function
#D4D4D8 RGB(212, 212, 216) RGBA(212, 212, 216, 1) variable.language
#FFB571 RGB(255, 181, 113) RGBA(255, 181, 113, 1) variable.name
#D4D4D8 RGB(212, 212, 216) RGBA(212, 212, 216, 1) variable.other
#D4D4D8 RGB(212, 212, 216) RGBA(212, 212, 216, 1) variable.other.constant
#FFF387 RGB(255, 243, 135) RGBA(255, 243, 135, 1) variable.other.property
#E0D6FE RGB(224, 214, 254) RGBA(224, 214, 254, 1) variable.other.readwrite
#A394E5 RGB(163, 148, 229) RGBA(163, 148, 229, 1) variable.parameter
#D4D4D8 RGB(212, 212, 216) RGBA(212, 212, 216, 1)