Rain
Publisher: GetcodeThemes in package: 1
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.activeBackground#141c26
- activityBar.background#0b1015
- activityBar.border#0b1015
- activityBar.foreground#ffffff
- activityBar.inactiveForeground#c8c8c8
- activityBarBadge.background#0099ff
- activityBarBadge.foreground#ffffff
- badge.background#ff0000
- badge.foreground#ffffff
- breadcrumb.activeSelectionForeground#ffffff
- breadcrumb.background#0e151b
- breadcrumb.focusForeground#ffffff
- breadcrumb.foreground#8c8c8ccc
- button.background#0099ff
- button.foreground#ffffff
- button.hoverBackground#1177bb
- button.secondaryBackground#696969
- button.secondaryForeground#ffffff
- button.secondaryHoverBackground#45494e
- checkbox.background#070b0e
- checkbox.border#00000000
- checkbox.foreground#ffffff
- debugExceptionWidget.background#0b1015
- debugExceptionWidget.border#47474700
- debugToolBar.background#0b1015
- debugToolBar.border#47474700
- diffEditor.border#44444400
- diffEditor.insertedTextBackground#00ff281f
- diffEditor.insertedTextBorder#ff000000
- diffEditor.removedTextBackground#ff000042
- diffEditor.removedTextBorder#ff000000
- dropdown.background#070b0e
- dropdown.border#00000000
- dropdown.foreground#ffffff
- editor.background#0e151b
- editor.findMatchBackground#0078f0cd
- editor.findMatchBorder#eaeaea00
- editor.findMatchHighlightBackground#0078f0cd
- editor.findMatchHighlightBorder#c4303000
- editor.findRangeHighlightBackground#5e5e5e66
- editor.findRangeHighlightBorder#ff000000
- editor.foldBackground#0078f020
- editor.foreground#ffffff
- editor.hoverHighlightBackground#0078f0cd
- editor.inactiveSelectionBackground#1b2127
- editor.lineHighlightBackground#0078f02c
- editor.lineHighlightBorder#28282800
- editor.rangeHighlightBackground#ffffff00
- editor.rangeHighlightBorder#ffffff00
- editor.selectionBackground#1b2127
- editor.selectionHighlightBackground#0078f0cd
- editor.selectionHighlightBorder#a5acb400
- editor.wordHighlightBackground#0078f0cd
- editor.wordHighlightBorder#ff000000
- editor.wordHighlightStrongBackground#0078f07e
- editor.wordHighlightStrongBorder#ff000000
- editorBracketMatch.background#ffffff00
- editorBracketMatch.border#0078f0cd
- editorCodeLens.foreground#ffffff
- editorCursor.background#ff0000d7
- editorCursor.foreground#0099ff
- editorError.background#ff0c0000
- editorError.border#8c1a1a00
- editorError.foreground#d10000
- editorGroup.border#db141400
- editorGroup.emptyBackground#0e151b
- editorGroupHeader.border#e6000000
- editorGroupHeader.tabsBackground#0b1015
- editorGroupHeader.tabsBorder#860e0e00
- editorGutter.addedBackground#adff00
- editorGutter.background#0e151b
- editorGutter.commentRangeForeground#757575
- editorGutter.deletedBackground#ff000c
- editorGutter.foldingControlForeground#757575
- editorGutter.modifiedBackground#2592ffcd
- editorHoverWidget.background#14202c
- editorHoverWidget.border#000000
- editorHoverWidget.foreground#f2f2f2
- editorIndentGuide.activeBackground#164780
- editorIndentGuide.background#1b2735
- editorInfo.background#4490BF00
- editorInfo.border#4490BF00
- editorInfo.foreground#0087ff
- editorLineNumber.activeForeground#ffffff
- editorLineNumber.foreground#545454
- editorLink.activeForeground#2693ff
- editorMarkerNavigation.background#0b1015
- editorMarkerNavigationError.background#ff000062
- editorMarkerNavigationInfo.background#0087ffa9
- editorMarkerNavigationWarning.background#ffd10093
- editorOverviewRuler.background#ff000000
- editorOverviewRuler.border#ff242400
- editorRuler.foreground#db2f2f00
- editorSuggestWidget.background#0b1015
- editorSuggestWidget.border#cb373700
- editorSuggestWidget.foreground#adadad
- editorSuggestWidget.highlightForeground#0099ff
- editorSuggestWidget.selectedBackground#0e151b
- editorWarning.background#A9904000
- editorWarning.border#ffffff00
- editorWarning.foreground#ffd30c
- editorWhitespace.foreground#7fff0000
- editorWidget.background#0b1015
- editorWidget.foreground#bcbcbc
- editorWidget.resizeBorder#ff000000
- focusBorder#0099ff00
- foreground#CECECE
- gitDecoration.addedResourceForeground#5ff079
- gitDecoration.conflictingResourceForeground#9090fb
- gitDecoration.deletedResourceForeground#db2000
- gitDecoration.ignoredResourceForeground#8a8a8a
- gitDecoration.modifiedResourceForeground#ffa013
- gitDecoration.stageDeletedResourceForeground#ff694f
- gitDecoration.stageModifiedResourceForeground#f9be65
- gitDecoration.submoduleResourceForeground#62b0f9
- gitDecoration.untrackedResourceForeground#55a972
- icon.foreground#CECECE
- input.background#070b0e
- input.border#00000000
- input.foreground#ffffff
- input.placeholderForeground#ececec
- inputOption.activeBackground#0099ff
- inputOption.activeBorder#ffffff00
- inputOption.activeForeground#ffffff
- list.activeSelectionBackground#000000
- list.activeSelectionForeground#ffffff
- list.dropBackground#383b3d00
- list.focusBackground#1a2631
- list.focusForeground#ffffff
- list.highlightForeground#0099ff
- list.hoverBackground#ffffff00
- list.hoverForeground#ffffff
- list.inactiveSelectionBackground#37373d
- list.inactiveSelectionForeground#ffffff
- listFilterWidget.background#ffffff
- listFilterWidget.noMatchesOutline#be1100
- listFilterWidget.outline#0099ff
- menu.background#0b1015
- menu.border#ff000000
- menu.foreground#999999
- menu.selectionBackground#09477100
- menu.selectionBorder#ff090900
- menu.selectionForeground#ffffff
- menu.separatorBackground#212121
- menubar.selectionBackground#0b1015
- menubar.selectionBorder#ff0f0f00
- menubar.selectionForeground#cccccc
- merge.commonContentBackground#282828
- merge.commonHeaderBackground#383838
- merge.currentContentBackground#2b3f3b
- merge.currentHeaderBackground#398a79
- merge.incomingContentBackground#28384B
- merge.incomingHeaderBackground#395F8F
- minimap.background#0e151b
- minimap.errorHighlight#d10000
- minimap.findMatchHighlight#0078f0cd
- minimap.selectionHighlight#1b2127
- minimap.warningHighlight#ffd30c
- minimapGutter.addedBackground#adff00
- minimapGutter.deletedBackground#ff000c
- minimapGutter.modifiedBackground#2592ffcd
- notificationCenter.border#47474700
- notificationCenterHeader.background#0b1015
- notificationCenterHeader.foreground#b2b2b2
- notifications.background#0b1015
- notifications.border#30303100
- notifications.foreground#b8b8b8
- notificationsErrorIcon.foreground#ff0000
- notificationsInfoIcon.foreground#0099ff
- notificationsWarningIcon.foreground#fffb00
- notificationToast.border#0099ff
- panel.background#0e151b
- panel.border#80808000
- panelSection.border#1b2735
- panelTitle.activeBorder#0099ff
- panelTitle.activeForeground#ffffff
- panelTitle.inactiveForeground#9f9f9f99
- peekView.border#1193ea
- peekViewEditor.background#0e151b
- peekViewEditor.matchHighlightBackground#ff8f004e
- peekViewEditor.matchHighlightBorder#ff8f0036
- peekViewEditorGutter.background#0e151b
- peekViewResult.background#0e151b
- peekViewResult.fileForeground#929292
- peekViewResult.lineForeground#ffffff
- peekViewResult.matchHighlightBackground#ffffff4d
- peekViewResult.selectionBackground#16487b33
- peekViewResult.selectionForeground#ffffff
- peekViewTitle.background#1e1e1e
- peekViewTitleDescription.foreground#ccccccb3
- peekViewTitleLabel.foreground#ffffff
- pickerGroup.border#000000
- pickerGroup.foreground#355a84
- progressBar.background#0099ff
- scrollbar.shadow#000000
- scrollbarSlider.activeBackground#5eeb97
- scrollbarSlider.background#5eeb97
- scrollbarSlider.hoverBackground#5eeb97
- selection.background#000000
- settings.focusedRowBackground#ffffff07
- settings.headerForeground#CECECE
- sideBar.background#0b1015
- sideBar.border#0b1015
- sideBar.dropBackground#383b3d00
- sideBar.foreground#5e6b77
- sideBarSectionHeader.background#ff000000
- sideBarSectionHeader.border#d3d3d300
- sideBarSectionHeader.foreground#5e6b77
- sideBarTitle.foreground#5e6b77
- statusBar.background#0b1015
- statusBar.border#ff000000
- statusBar.debuggingBackground#0b1015
- statusBar.debuggingBorder#ff000000
- statusBar.debuggingForeground#c9c9c9
- statusBar.foreground#c9c9c9
- statusBar.noFolderBackground#0b1015
- statusBar.noFolderForeground#c9c9c9
- statusBarItem.activeBackground#FFFFFF25
- statusBarItem.hoverBackground#0b1015
- statusBarItem.remoteBackground#0099ff
- statusBarItem.remoteForeground#ffffff
- tab.activeBackground#141c26
- tab.activeBorder#0099ff00
- tab.activeBorderTop#00000000
- tab.activeForeground#ffffff
- tab.border#0000ec00
- tab.hoverBackground#db252500
- tab.hoverBorder#0099ff
- tab.hoverForeground#ffffff
- tab.inactiveBackground#0b1015
- tab.inactiveForeground#a5a5a580
- terminal.ansiBlack#000000
- terminal.ansiBlue#2472c8
- terminal.ansiBrightBlack#666666
- terminal.ansiBrightBlue#3b8eea
- terminal.ansiBrightCyan#29b8db
- terminal.ansiBrightGreen#23d18b
- terminal.ansiBrightMagenta#d670d6
- terminal.ansiBrightRed#f14c4c
- terminal.ansiBrightWhite#e5e5e5
- terminal.ansiBrightYellow#f5f543
- terminal.ansiCyan#11a8cd
- terminal.ansiGreen#0dbc79
- terminal.ansiMagenta#bc3fbc
- terminal.ansiRed#cd3131
- terminal.ansiWhite#e5e5e5
- terminal.ansiYellow#e5e510
- terminal.border#1b2735
- terminal.foreground#ffffff
- terminal.selectionBackground#2a394562
- terminalCursor.background#0099ff
- terminalCursor.foreground#ffffff
- textLink.foreground#3794ff
- titleBar.activeBackground#0b1015
- titleBar.activeForeground#d1d1d1
- titleBar.border#ea000000
- titleBar.inactiveBackground#0b10159f
- titleBar.inactiveForeground#8a8a8a99
- tree.indentGuidesStroke#ffe3e300
- walkThrough.embeddedEditorBackground#00000050
- widget.shadow#f0000000
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #efefef | — |
| comment | #515c68 | |
| constant | #ffe792 | |
| entity | #3cadd7 | |
| keyword | #d7503c | bold |
| storage | #ffffff | |
| storage.type | #3cadd7 | italic |
| string | #ffe792 | |
| support, support.function.primitive | #ffe792 | bold |
| variable | #d73c4d | bold |
| invalid | #F8F8F8 | — |
| text source | — | — |
| text.html.ruby source | — | — |
| entity.other.inherited-class | #4abe95 | italic |
| string.quoted source | #5eebb8 | |
| string constant | #5eebb8 | — |
| string.regexp | #FFB454 | — |
| string variable | #ffe792 | — |
| support.function | #d7503c | |
| support.constant | #5eebb8 | |
| other.preprocessor.c | #8996A8 | — |
| other.preprocessor.c entity | #AFC4DB | — |
| declaration.tag, declaration.tag entity, meta.tag, meta.tag entity | #3cadd7 | — |
| meta.selector.css entity.name.tag | #3cadd7 | — |
| meta.selector.css entity.other.attribute-name.id | #ffe792 | bold |
| meta.selector.css entity.other.attribute-name.class | #5eebb8 | bold |
| support.type.property-name.css | #ffffff | — |
| meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css | #5eebb8 | italic |
| meta.preprocessor.at-rule keyword.control.at-rule | #ffe792 | bold |
| meta.property-value support.constant.named-color.css, meta.property-value constant | #ffe792 | — |
| meta.constructor.argument.css | #d7503c | — |
| meta.diff, meta.diff.header | #F8F8F8 | italic |
| markup.deleted | #F8F8F8 | — |
| markup.changed | #F8F8F8 | — |
| markup.inserted | #F8F8F8 | — |
| sublimelinter.outline.notes | — | — |
| sublimelinter.outline.illegal | — | — |
| sublimelinter.underline.illegal | — | — |
| sublimelinter.outline.warning | #ffffff | — |
| sublimelinter.underline.warning | — | — |
| sublimelinter.outline.violation | — | — |
| sublimelinter.underline.violation | — | — |
| html.entity.other.attribute-name.id, xml.entity.other.attribute-name.id | #f57542 | — |
| html.entity.other.attribute-name, xml.entity.other.attribute-name | #76ffcd | — |
| punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag | #266b85 | — |
| keyword.control.at-rule.import.css | #f7f09d | bold |
| variable.other.less | #ffffff | — |
| entity.other.less.mixin | #ffffff | — |
| source.css.less keyword.unit.css | #5eebb8 | — |
| entity.other.attribute-name.angular.html, source.angular.embedded.html | #ffe792 | — |
| html.constant.character.entity, xml.constant.character.entity | #5eebb8 | — |
| variable.other.readwrite.instance.coffee | #5eebb8 | — |
| meta.brace.round.coffee, meta.brace.square.coffee | #ffe792 | — |
| punctuation.section.embedded.coffee | #5eebb8 | — |
| variable.assignment.coffee variable.assignment.coffee | #FFFFFF | — |
| meta.delimiter.method.period.coffee | #3cadd7 | — |
| meta.brace.curly.coffee | #5eebb8 | — |
| meta.tag.sgml.doctype.xml, declaration.sgml.html declaration.doctype, declaration.sgml.html declaration.doctype entity, declaration.sgml.html declaration.doctype string, declaration.xml-processing, declaration.xml-processing entity, declaration.xml-processing string, doctype | #3c444d | — |
| markup.deleted.git_gutter | #d7503c | — |
| markup.inserted.git_gutter | #43ae88 | — |
| markup.changed.git_gutter | #3cadd7 | — |
| markup.ignored.git_gutter | #3e4751 | — |
| markup.untracked.git_gutter | #3e4751 | — |
| meta.structure.dictionary.property-name.json | #3cadd7 | — |
| meta.dictionary.value.json | #ffe792 | — |
| meta.structure.dictionary.value.json.begin, meta.structure.dictionary.value.json.end, string.quoted.double.json.begin, string.quoted.double.json.end, meta.structure.dictionary.property-name.json.begin, meta.structure.dictionary.property-name.json.end, string.quoted.double.json.begin, string.quoted.double.json.end, token.meta.structure.punctuation.separator | #ffffff | — |
| sublimelinter.gutter-mark | #FFFFFF | — |
| sublimelinter.mark.warning | #DDB700 | — |
| sublimelinter.mark.error | #D02000 | — |
| yaml.entity | #3cadd7 | — |
| yaml.punctuation | #efefef | — |
| yaml.comment | #515c68 | — |
| modifier | #3cadd7 | italic |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...