Bootstrap Theme
Publisher: BootstrapThemes in package: 4
Bootstrap theme for Shiki, VS Code, and more
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.
| key | HEX | RGB | RGBA |
|---|---|---|---|
activityBar.activeBorder | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
activityBar.background | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
activityBar.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
activityBar.foreground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
activityBarBadge.background | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
activityBarBadge.foreground | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
button.background | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
button.foreground | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
button.hoverBackground | COLOR(DISPLAY-P3 0.141176 0.341176 0.800000) | — | — |
diffEditor.deletedTextBackground | COLOR(DISPLAY-P3 0.907131 0.215067 0.276409 / 0.100000) | — | — |
diffEditor.insertedTextBackground | COLOR(DISPLAY-P3 0.270922 0.722281 0.366128 / 0.100000) | — | — |
dropdown.background | COLOR(DISPLAY-P3 0.094824 0.097911 0.101552) | — | — |
dropdown.border | COLOR(DISPLAY-P3 0.150443 0.156609 0.167488) | — | — |
dropdown.foreground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
editor.background | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
editor.foreground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
editor.lineHighlightBackground | COLOR(DISPLAY-P3 0.087501 0.113122 0.228266 / 0.550000) | — | — |
editor.selectionBackground | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073 / 0.300000) | — | — |
editorCursor.foreground | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
editorGroupHeader.tabsBackground | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
editorGroupHeader.tabsBorder | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
editorIndentGuide.activeBackground | COLOR(DISPLAY-P3 0.118352 0.121440 0.128667) | — | — |
editorIndentGuide.background | COLOR(DISPLAY-P3 0.134759 0.140923 0.148211) | — | — |
editorLineNumber.activeForeground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
editorLineNumber.foreground | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
focusBorder | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
foreground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
gitDecoration.addedResourceForeground | COLOR(DISPLAY-P3 0.270922 0.722281 0.366128) | — | — |
gitDecoration.conflictingResourceForeground | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
gitDecoration.deletedResourceForeground | COLOR(DISPLAY-P3 0.907131 0.215067 0.276409) | — | — |
gitDecoration.ignoredResourceForeground | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
gitDecoration.modifiedResourceForeground | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
gitDecoration.untrackedResourceForeground | COLOR(DISPLAY-P3 0.270922 0.722281 0.366128) | — | — |
input.background | COLOR(DISPLAY-P3 0.094824 0.097911 0.101552) | — | — |
input.border | COLOR(DISPLAY-P3 0.150443 0.156609 0.167488) | — | — |
input.foreground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
input.placeholderForeground | COLOR(DISPLAY-P3 0.318806 0.340308 0.362261) | — | — |
list.activeSelectionBackground | COLOR(DISPLAY-P3 0.087501 0.113122 0.228266 / 0.600000) | — | — |
list.activeSelectionForeground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
list.focusOutline | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
list.hoverBackground | COLOR(DISPLAY-P3 0.087501 0.113122 0.228266 / 0.350000) | — | — |
list.inactiveSelectionBackground | COLOR(DISPLAY-P3 0.087501 0.113122 0.228266 / 0.450000) | — | — |
panel.background | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
panel.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
panelTitle.activeBorder | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
panelTitle.activeForeground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
panelTitle.inactiveForeground | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
selection.background | COLOR(DISPLAY-P3 0.087501 0.113122 0.228266) | — | — |
sideBar.background | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
sideBar.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
sideBar.foreground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
sideBarSectionHeader.background | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
sideBarSectionHeader.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
sideBarSectionHeader.foreground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
sideBarTitle.foreground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
statusBar.background | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
statusBar.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
statusBar.debuggingBackground | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
statusBar.debuggingForeground | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
statusBar.foreground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
statusBar.noFolderBackground | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
statusBarItem.remoteBackground | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
statusBarItem.remoteForeground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
tab.activeBackground | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
tab.activeBorderTop | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
tab.activeForeground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
tab.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
tab.inactiveBackground | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
tab.inactiveForeground | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
terminal.ansiBlack | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
terminal.ansiBlue | COLOR(DISPLAY-P3 0.218618 0.478844 1.000000) | — | — |
terminal.ansiBrightBlack | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
terminal.ansiBrightBlue | COLOR(DISPLAY-P3 0.218618 0.478844 1.000000) | — | — |
terminal.ansiBrightCyan | COLOR(DISPLAY-P3 0.327414 0.730740 1.000000) | — | — |
terminal.ansiBrightGreen | COLOR(DISPLAY-P3 0.270922 0.722281 0.366128) | — | — |
terminal.ansiBrightMagenta | COLOR(DISPLAY-P3 0.688374 0.161635 0.855832) | — | — |
terminal.ansiBrightRed | COLOR(DISPLAY-P3 0.907131 0.215067 0.276409) | — | — |
terminal.ansiBrightWhite | COLOR(DISPLAY-P3 0.675568 0.697150 0.719064) | — | — |
terminal.ansiBrightYellow | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
terminal.ansiCyan | COLOR(DISPLAY-P3 0.327414 0.730740 1.000000) | — | — |
terminal.ansiGreen | COLOR(DISPLAY-P3 0.270922 0.722281 0.366128) | — | — |
terminal.ansiMagenta | COLOR(DISPLAY-P3 0.688374 0.161635 0.855832) | — | — |
terminal.ansiRed | COLOR(DISPLAY-P3 0.907131 0.215067 0.276409) | — | — |
terminal.ansiWhite | COLOR(DISPLAY-P3 0.675568 0.697150 0.719064) | — | — |
terminal.ansiYellow | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
terminal.background | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
terminal.foreground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
terminal.titleForeground | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
terminal.titleInactiveForeground | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
textLink.activeForeground | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
textLink.foreground | COLOR(DISPLAY-P3 0.149922 0.374042 0.885073) | — | — |
titleBar.activeBackground | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
titleBar.activeForeground | COLOR(DISPLAY-P3 0.965404 0.968498 0.972132) | — | — |
titleBar.border | COLOR(DISPLAY-P3 0.043849 0.046932 0.050576) | — | — |
titleBar.inactiveBackground | COLOR(DISPLAY-P3 0.075218 0.078304 0.081945) | — | — |
titleBar.inactiveForeground | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
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 | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
comment.block | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
comment.block.documentation | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
comment.line | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
constant | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
constant.character | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
constant.character.escape | COLOR(DISPLAY-P3 0.456836 0.760920 1.000000) | — | — |
constant.numeric | COLOR(DISPLAY-P3 0.456836 0.760920 1.000000) | — | — |
constant.numeric.integer | COLOR(DISPLAY-P3 0.456836 0.760920 1.000000) | — | — |
constant.numeric.float | COLOR(DISPLAY-P3 0.456836 0.760920 1.000000) | — | — |
constant.numeric.hex | COLOR(DISPLAY-P3 0.456836 0.760920 1.000000) | — | — |
constant.numeric.octal | COLOR(DISPLAY-P3 0.456836 0.760920 1.000000) | — | — |
constant.other | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
constant.other.placeholder | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
constant.regexp | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
constant.rgb-value | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
entity | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
entity.name | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
entity.name.class | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
entity.name.function | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
entity.name.namespace | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
entity.name.section | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
entity.name.tag | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
entity.name.type | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
entity.name.type.enum | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
entity.name.type.interface | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
entity.name.type.struct | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
entity.other | COLOR(DISPLAY-P3 0.452685 0.818495 0.793672) | — | — |
entity.other.attribute-name | COLOR(DISPLAY-P3 0.452685 0.818495 0.793672) | — | — |
entity.other.inherited-class | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
invalid | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
invalid.deprecated | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
invalid.illegal | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
keyword | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
keyword.control | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
keyword.control.flow | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
keyword.operator | COLOR(DISPLAY-P3 0.318806 0.340308 0.362261) | — | — |
keyword.operator.new | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
keyword.operator.assignment | COLOR(DISPLAY-P3 0.327414 0.730740 1.000000) | — | — |
keyword.operator.arithmetic | COLOR(DISPLAY-P3 0.327414 0.730740 1.000000) | — | — |
keyword.operator.logical | COLOR(DISPLAY-P3 0.327414 0.730740 1.000000) | — | — |
keyword.other | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
markup | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
markup.bold | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
markup.changed | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
markup.deleted | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
markup.heading | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
markup.inline.raw | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
markup.inserted | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
markup.italic | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
markup.quote | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
markup.underline | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
markup.underline.link | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
meta | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
meta.function | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
meta.function-call | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
meta.selector | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
meta.tag | COLOR(DISPLAY-P3 0.318806 0.340308 0.362261) | — | — |
punctuation.definition.bracket | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
punctuation.definition.comment | COLOR(DISPLAY-P3 0.394786 0.422416 0.451677) | — | — |
punctuation.definition.string.begin | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
punctuation.definition.string.end | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
punctuation.separator | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
punctuation.separator.continuation | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
punctuation.terminator | COLOR(DISPLAY-P3 0.318806 0.340308 0.362261) | — | — |
storage | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
storage.modifier | COLOR(DISPLAY-P3 0.925676 0.417188 0.564533) | — | — |
storage.type | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
string | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.interpolated | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.other | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.quoted | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.quoted.double | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.quoted.other | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.quoted.single | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.quoted.triple | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.regexp | COLOR(DISPLAY-P3 0.452685 0.818495 0.793672) | — | — |
string.template | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
string.unquoted | COLOR(DISPLAY-P3 0.428806 0.781598 0.483458) | — | — |
support | COLOR(DISPLAY-P3 0.945140 0.418324 0.421805) | — | — |
support.class | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
support.constant | COLOR(DISPLAY-P3 1.000000 0.865057 0.452973) | — | — |
support.function | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
support.other | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
support.type | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
support.type.primitive | COLOR(DISPLAY-P3 0.658931 0.416107 0.969964) | — | — |
support.type.property-name | COLOR(DISPLAY-P3 0.318806 0.340308 0.362261) | — | — |
support.variable | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
variable | COLOR(DISPLAY-P3 1.000000 0.581956 0.326458) | — | — |
variable.function | COLOR(DISPLAY-P3 0.617217 0.452715 1.000000) | — | — |
variable.language | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
variable.name | COLOR(DISPLAY-P3 1.000000 0.581956 0.326458) | — | — |
variable.other | COLOR(DISPLAY-P3 1.000000 0.581956 0.326458) | — | — |
variable.other.constant | COLOR(DISPLAY-P3 1.000000 0.828566 0.298929) | — | — |
variable.other.property | COLOR(DISPLAY-P3 1.000000 0.581956 0.326458) | — | — |
variable.other.readwrite | COLOR(DISPLAY-P3 1.000000 0.581956 0.326458) | — | — |
variable.parameter | COLOR(DISPLAY-P3 0.575097 0.602792 0.632021) | — | — |
