Rainier
Publisher: joytrekkerThemes in package: 3
A dark and refreshing syntax theme for Visual Studio Code.
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#509ddb
- activityBar.background#18121C
- activityBar.border#000000
- activityBar.foreground#b9d3e9
- activityBar.inactiveForeground#82709e
- activityBarBadge.background#b9346c
- activityBarBadge.foreground#f2f2f2
- badge.background#b9346c
- badge.foreground#f2f2f2
- breadcrumb.activeSelectionForeground#509ddb
- breadcrumb.focusForeground#509ddb
- breadcrumb.foreground#7B6296
- breadcrumbPicker.background#18121C
- button.background#509ddb
- button.foreground#ffffff
- button.hoverBackground#509cdb80
- contrastBorder#ffffff00
- debugExceptionWidget.background#2B2331
- debugExceptionWidget.border#b9d3e9
- debugToolBar.background#2B2331
- descriptionForeground#b9d3e9
- diffEditor.insertedTextBackground#37c2b631
- diffEditor.removedTextBackground#dd518b2a
- dropdown.background#352C3D
- dropdown.border#352C3D
- dropdown.foreground#b9d3e9
- editor.background#251E2A
- editor.findMatchBackground#251E2A
- editor.findMatchBorder#b9d3e9
- editor.findMatchHighlightBackground#37c2b646
- editor.foreground#b9d3e9
- editor.lineHighlightBackground#352C3D
- editor.selectionBackground#ffbffc38
- editor.selectionHighlightBackground#ffffff23
- editorBracketMatch.background#3572ac
- editorBracketMatch.border#509ddb
- editorCodeLens.foreground#b9d3e9
- editorCursor.foreground#5ec4ff
- editorError.border#333f4a
- editorError.foreground#dd518c
- editorGroup.border#332A3A
- editorGroup.dropBackground#332A3A
- editorGroupHeader.noTabsBackground#201825
- editorGroupHeader.tabsBackground#201825
- editorGroupHeader.tabsBorder#000000
- editorGutter.addedBackground#37c2b6
- editorGutter.deletedBackground#dd518c
- editorGutter.modifiedBackground#509ddb
- editorHoverWidget.background#18121C
- editorHoverWidget.border#000000
- editorIndentGuide.background#3c2e49
- editorLineNumber.activeForeground#509ddb
- editorLineNumber.foreground#73648b
- editorLink.activeForeground#509ddb
- editorMarkerNavigation.background#1d252c
- editorMarkerNavigationError.background#dd518c
- editorMarkerNavigationWarning.background#d98e48
- editorOverviewRuler.addedForeground#37c2b6
- editorOverviewRuler.border#000000
- editorOverviewRuler.commonContentForeground#ebbf8355
- editorOverviewRuler.currentContentForeground#ee3a4355
- editorOverviewRuler.deletedForeground#dd518c
- editorOverviewRuler.incomingContentForeground#3ad90055
- editorOverviewRuler.modifiedForeground#509ddb
- editorRuler.foreground#463850
- editorSuggestWidget.background#1d1720
- editorSuggestWidget.border#1d1720
- editorSuggestWidget.foreground#b9d3e9
- editorSuggestWidget.highlightForeground#37c2b6
- editorSuggestWidget.selectedBackground#3c2e49
- editorWarning.border#ffffff00
- editorWarning.foreground#d6af78
- editorWhitespace.foreground#483858
- editorWidget.background#18121C
- editorWidget.border#332A3A
- errorForeground#dd518c
- extensionButton.prominentBackground#509ddb
- extensionButton.prominentForeground#ffffff
- extensionButton.prominentHoverBackground#5eceeb
- focusBorder#509ddb
- foreground#b9d3e9
- gitDecoration.ignoredResourceForeground#9883b9
- gitDecoration.modifiedResourceForeground#509ddb
- gitDecoration.untrackedResourceForeground#37c2b6
- input.background#2B2331
- input.border#9883b9
- input.foreground#509ddb
- input.placeholderForeground#9883b9
- inputOption.activeBorder#509ddb
- inputValidation.errorBackground#dd518c
- inputValidation.errorBorder#dd518c
- inputValidation.errorForeground#18121C
- inputValidation.infoBackground#509ddb
- inputValidation.infoBorder#509ddb
- inputValidation.infoForeground#18121C
- inputValidation.warningBackground#d6af78
- inputValidation.warningBorder#d98e48
- inputValidation.warningForeground#18121C
- list.activeSelectionBackground#63567986
- list.activeSelectionForeground#ffffff
- list.dropBackground#63567986
- list.errorForeground#dd518c
- list.focusBackground#3572ac
- list.focusForeground#ffffff
- list.highlightForeground#37c2b6
- list.hoverBackground#3572ac
- list.hoverForeground#ffffff
- list.inactiveSelectionBackground#63567986
- list.inactiveSelectionForeground#ffffff
- menu.background#1d1720
- menu.foreground#b9d3e9
- menu.selectionBackground#3572ac
- menu.selectionForeground#ffffff
- menubar.selectionBackground#63567986
- notifications.background#2B2331
- panel.background#201825
- panel.border#000000
- panelTitle.activeBorder#c9c994
- panelTitle.activeForeground#c9c994
- panelTitle.inactiveForeground#b9d3e9
- peekView.border#000000
- peekViewEditor.background#201825
- peekViewResult.background#18121C
- peekViewTitle.background#18121C
- peekViewTitleDescription.foreground#9883b9
- peekViewTitleLabel.foreground#b9d3e9
- pickerGroup.border#333f4a
- pickerGroup.foreground#b9d3e9
- progressBar.background#509ddb
- scrollbar.shadow#00000091
- scrollbarSlider.activeBackground#4e405880
- scrollbarSlider.background#4e405880
- scrollbarSlider.hoverBackground#64527080
- selection.background#635679cc
- sideBar.background#201825
- sideBar.border#000000
- sideBar.foreground#b9d3e9
- sideBarSectionHeader.background#18121C
- sideBarSectionHeader.border#000000
- sideBarSectionHeader.foreground#c9c994
- sideBarTitle.foreground#9d79d8
- statusBar.background#201825
- statusBar.border#000000
- statusBar.debuggingBackground#3572ac
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#b9d3e9
- statusBar.noFolderBackground#635679
- statusBar.noFolderForeground#b9d3e9
- statusBarItem.activeBackground#333f4a
- statusBarItem.hoverBackground#ffffff4d
- statusBarItem.prominentBackground#251E2A
- statusBarItem.prominentHoverBackground#333f4a
- tab.activeBackground#251E2A
- tab.activeBorder#251E2A
- tab.activeForeground#ffffff
- tab.activeModifiedBorder#509ddb
- tab.border#000000
- tab.inactiveBackground#18121C
- tab.inactiveForeground#B3C8DC
- tab.unfocusedActiveForeground#ffffff
- tab.unfocusedInactiveForeground#ffffff
- terminal.ansiBlack#201825
- terminal.ansiBlue#509ddb
- terminal.ansiBrightBlack#7B6296
- terminal.ansiBrightBlue#509ddb
- terminal.ansiBrightCyan#509ddb
- terminal.ansiBrightGreen#37c2b6
- terminal.ansiBrightMagenta#9d79d8
- terminal.ansiBrightRed#b9346c
- terminal.ansiBrightWhite#f2f2f2
- terminal.ansiBrightYellow#d6af78
- terminal.ansiCyan#509ddb
- terminal.ansiGreen#37c2b6
- terminal.ansiMagenta#b9346c
- terminal.ansiRed#b9346c
- terminal.ansiWhite#b9d3e9
- terminal.ansiYellow#c9c994
- terminal.background#201825
- terminal.border#000000
- terminal.foreground#b9d3e9
- terminalCursor.background#5ec4ff
- terminalCursor.foreground#5ec4ff
- textBlockQuote.background#201825
- textBlockQuote.border#3572ac
- textCodeBlock.background#201825
- textLink.activeForeground#c9c994
- textLink.foreground#509ddb
- textPreformat.foreground#718ca1
- textSeparator.foreground#509ddb
- titleBar.activeBackground#18121C
- titleBar.activeForeground#ffffff
- titleBar.border#000000
- titleBar.inactiveBackground#251E2A
- titleBar.inactiveForeground#ffffff33
- walkThrough.embeddedEditorBackground#201825
- welcomePage.buttonBackground#18121C
- welcomePage.buttonHoverBackground#201825
- widget.shadow#00000026
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| constant | #9d79d8 | — |
| comment, string.quoted.docstring.multi.python | #73648b | — |
| entity.name.type.class, support.class | #37c2b6 | — |
| meta.function-call.generic, support.type.python, entity.name.function | #509ddb | — |
| invalid | #dd518c | — |
| keyword | #dd518c | — |
| storage.type.class.js | #509DDB | — |
| entity.name.type, support.type | #37c2b6 | — |
| meta | #b9d3e9 | — |
| meta.brace | #b9d3e9 | — |
| punctuation.definition.parameters | #b9d3e9 | — |
| entity.name.variable.parameter, meta.at-rule.function variable, meta.at-rule.mixin variable, meta.function.arguments, meta.function.parameter variable.other, meta.selectionset.graphql meta.arguments.graphql variable.arguments.graphql, variable.parameter | #d6af78 | italic |
| punctuation.definition.template-expression | #509ddb | — |
| storage | #c693da | — |
| storage.type.function.arrow | #509DDB | — |
| string, source.json string, punctuation.definition.string | #c9c994 | — |
| string.template, punctuation.definition.string.template | #509ddb | — |
| support.function | #509ddb | — |
| support.class.component.js | #509DDB | — |
| support.class.component.html | #c693da | — |
| support.variable.property.dom | #b9d3e9 | — |
| variable | #b9d3e9 | — |
| source.css, source.stylus, source.scss, entity.other.attribute-name.class.css | #509ddb | — |
| constant.other.color.rgb-value.hex.css | #dd518c | — |
| support.type.property-name.css | #b9d3e9 | — |
| keyword.other.important.scss | #dd518c | — |
| support.function.misc.scss | #b9d3e9 | — |
| entity.other.attribute-name.id.css | #9d79d8 | — |
| entity.name.tag.css | #509ddb | — |
| source.css support, source.stylus support | #b9d3e9 | — |
| source.css constant, source.css support.constant, source.stylus constant, source.stylus support.constant | #dd518c | — |
| support.constant.property-value.css | #c9c994 | — |
| constant.other.color.rgb-value.hex.css | #c9c994 | — |
| source.css punctuation.definition.string, source.css string, source.stylus punctuation.definition.string, source.stylus string | #c9c994 | — |
| source.css variable, source.stylus variable | #c693da | — |
| entity.other.attribute-name.css | #d6af78 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #c693da | — |
| entity.other | #37c2b6 | — |
| text.html.basic | #b9d3e9 | — |
| toc-list.id.html | #509ddb | — |
| entity.name.tag.block.any.html, entity.name.tag.inline.any.html, entity.name.tag.structure.any.html, entity.name.tag.html, meta.tag.js, meta.jsx.children.tsx, meta.tag.js, meta.jsx.children.tsx, meta.tag.js | #b9d3e9 | — |
| entity.name.tag.other.html | #c693da | — |
| punctuation.definition.string.begin, punctuation.definition.string.end | #509ddb | — |
| variable.language, entity.name.type.class.js | #c693da | — |
| entity.other.inherited-class.js, variable.language.this.js, variable.other.readwrite.alias.js, meta.import.js | #c693da | italic |
| variable.language.this.php | #c693da | italic |
| storage.type.function.python | #c693da | — |
| source.json string, source.json punctuation.definition.string | #c9c994 | — |
| punctuation.definition.string.end.json, punctuation.definition.string.begin.json | #509ddb | — |
| token.info-token | #509ddb | — |
| token.warn-token | #d6af78 | — |
| token.error-token | #dd518c | — |
| token.debug-token | #c693da | — |
| keyword.control, punctuation.section.embedded.begin , punctuation.section.embedded.end | #dd518c | — |
| constant.character.format.placeholder.other.python | #c693da | — |
| constant.character.escape.python | #509ddb | — |
| entity.name.tag.css | #37c2b6 | — |
| entity.other.attribute-name.class.css | #509ddb | — |
| keyword.other.unit.deg.css, keyword.other.unit.ms.css, keyword.other.unit.percentage.css, keyword.other.unit.px.css, keyword.other.unit.s.css, keyword.other.unit.vh.css, keyword.other.unit.vw.css | #dd518c | — |
| markup.list.unnumbered.markdown, markup.list.numbered.markdown | #dd518c | — |
| markup.bold.markdown, markup.italic.markdown, markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, meta.separator.markdown | #9d79d8 | — |
| entity.name.section.markdown, punctuation.definition.heading.markdown, punctuation.definition.raw.markdown | #37c2b6 | — |
| markup.raw.block.markdown | #d6af78 | — |
| markup.underline.link.markdown, markup.underline.link.image.markdown | #509ddb | — |
| support.type.property-name.json.comments, support.type.property-name.json | #509ddb | — |
| entity.name.tag.block.any.html, entity.name.tag.html, entity.name.tag.inline.any.html, entity.name.tag.structure.any.html, entity.name.tag.js, entity.name.tag.template, entity.name.tag.script, entity.name.tag.style | #509ddb | — |
| markup.bold | — | bold |
| markup.heading | — | bold |
| markup.italic | — | italic |
| source.css constant | #9d79d8 | — |
| entity.name.tag.yaml, entity.name.tag.localname.xml | #509ddb | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...