Rouge Theme
Publisher: josefThemes in package: 3
Warm and cozy dark theme for VSCode
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.background#172030
- activityBar.border#1A2335
- activityBar.foreground#A7ACB9
- activityBarBadge.background#c6797e
- activityBarBadge.foreground#fff
- badge.background#a06468df
- badge.foreground#fff
- breadcrumb.activeSelectionForeground#a7acb9
- breadcrumb.focusForeground#a7acb9
- breadcrumb.foreground#64727d
- breadcrumbPicker.background#172030
- button.background#75809580
- button.foreground#fff
- button.hoverBackground#758095
- contrastBorder#172030
- debugToolBar.background#97a38f
- descriptionForeground#a7acb9
- diffEditor.insertedTextBackground#9BBA9A40
- diffEditor.insertedTextBorder#9BBA9A
- diffEditor.removedTextBackground#CC565E40
- diffEditor.removedTextBorder#CC565E
- dropdown.background#172030
- dropdown.border#a06468df
- dropdown.foreground#ccc
- editor.background#172030
- editor.findMatchBackground#91d1bd40
- editor.findMatchHighlightBackground#91d1bd40
- editor.findRangeHighlightBackground#91d1bd40
- editor.foreground#bbb
- editor.hoverHighlightBackground#91d1bd40
- editor.inactiveSelectionBackground#91d1bd26
- editor.lineHighlightBackground#91d1bd10
- editor.selectionBackground#91d1bd40
- editor.selectionForeground#91d1bdff
- editor.wordHighlightBackground#91d1bd40
- editor.wordHighlightStrongBackground#91d1bd40
- editorBracketMatch.background#212e45
- editorBracketMatch.border#eabe9a80
- editorCodeLens.foreground#758095
- editorCursor.background#c6797e
- editorCursor.foreground#c6797e
- editorError.foreground#cc565e
- editorGroup.background#172030
- editorGroup.border#75809559
- editorGroup.dropBackground#75809566
- editorGroupHeader.noTabsBackground#172030
- editorGroupHeader.tabsBackground#172030
- editorGutter.addedBackground#9BBA9Acc
- editorGutter.background#172030
- editorGutter.deletedBackground#CC565Ecc
- editorGutter.modifiedBackground#eabe9acc
- editorHoverWidget.background#1F2A3F
- editorHoverWidget.border#758095
- editorIndentGuide.activeBackground#75809580
- editorIndentGuide.background#75809580
- editorLineNumber.activeForeground#A4B4D1
- editorLineNumber.foreground#758095
- editorLink.activeForeground#758095
- editorOverviewRuler.addedForeground#9BBA9Acc
- editorOverviewRuler.border#293a57cc
- editorOverviewRuler.deletedForeground#CC565E40
- editorOverviewRuler.errorForeground#CC565Ecc
- editorOverviewRuler.findMatchForeground#91d1bd66
- editorOverviewRuler.infoForeground#6e94b9cc
- editorOverviewRuler.modifiedForeground#eabe9acc
- editorOverviewRuler.selectionHighlightForeground#91d1bd66
- editorRuler.foreground#75809580
- editorSuggestWidget.background#1F2A3F
- editorSuggestWidget.border#758095
- editorSuggestWidget.foreground#c6cad2
- editorSuggestWidget.highlightForeground#eabe9a
- editorSuggestWidget.selectedBackground#293a57
- editorWarning.foreground#CC565Edf
- editorWhitespace.foreground#91d1bd26
- editorWidget.background#192334
- editorWidget.border#c6797e
- errorForeground#c6797e
- extensionButton.prominentBackground#728069B3
- extensionButton.prominentForeground#fff
- extensionButton.prominentHoverBackground#728069
- focusBorder#758095
- gitDecoration.conflictingResourceForeground#d19498
- gitDecoration.deletedResourceForeground#b18bb1e6
- gitDecoration.ignoredResourceForeground#6e94b9e6
- gitDecoration.modifiedResourceForeground#eabe9a
- gitDecoration.untrackedResourceForeground#ADB9A4
- input.background#172030
- input.border#a06468df
- input.foreground#A7ACB9
- input.placeholderForeground#808799
- inputOption.activeBorder#b8bcc6
- inputValidation.errorBackground#1A2335
- inputValidation.errorBorder#CC565Edf
- inputValidation.infoBackground#1A2335
- inputValidation.infoBorder#6e94b999
- inputValidation.warningBackground#1A2335
- inputValidation.warningBorder#eabe9adf
- list.activeSelectionBackground#c6797edf
- list.activeSelectionForeground#fff
- list.dropBackground#75809566
- list.errorForeground#CC565E
- list.focusBackground#293a57
- list.focusForeground#c6cad2
- list.highlightForeground#eabe9a
- list.hoverBackground#293a57
- list.hoverForeground#c6cad2
- list.inactiveFocusBackground#293a57
- list.inactiveFocusForeground#a7acb9
- list.inactiveSelectionBackground#293a57
- list.inactiveSelectionForeground#c6cad2
- list.invalidItemForeground#CC565E
- list.warningForeground#F9B5ACcc
- menu.background#172030
- menu.foreground#a7acb9
- menu.selectionBackground#293a57
- menu.selectionForeground#c6cad2
- menubar.selectionBackground#c6797e
- menubar.selectionForeground#fff
- merge.border#A7ACB9
- merge.currentContentBackground#9BBA9A26
- merge.currentHeaderBackground#9BBA9A80
- merge.incomingContentBackground#6e94b966
- merge.incomingHeaderBackground#6e94b999
- notificationCenter.border#758095
- notificationCenterHeader.background#1F2A3F
- notificationCenterHeader.foreground#A7ACB9
- notificationLink.foreground#c6cad2
- notifications.background#1F2A3F
- notifications.border#75809566
- notifications.foreground#c6cad2
- notificationToast.border#758095
- panel.background#172030
- panel.border#75809559
- panelTitle.activeBorder#c6797ecc
- panelTitle.activeForeground#A7ACB9
- panelTitle.inactiveForeground#808799b3
- peekView.border#c6797e
- peekViewEditor.background#1F2A3F
- peekViewEditor.matchHighlightBackground#91d1bd40
- peekViewEditorGutter.background#1F2A3F
- peekViewResult.background#1B2638
- peekViewResult.fileForeground##c6cad2
- peekViewResult.lineForeground#fff
- peekViewResult.matchHighlightBackground#91d1bd66
- peekViewResult.selectionBackground#293a57
- peekViewResult.selectionForeground#c6cad2
- peekViewTitle.background#1B2638
- peekViewTitleDescription.foreground#A7ACB9
- peekViewTitleLabel.foreground#c6cad2
- pickerGroup.border#758095
- pickerGroup.foreground#eabe9acc
- progressBar.background#97a38f
- scrollbar.shadow#a0646810
- scrollbarSlider.activeBackground#c6797ef2
- scrollbarSlider.background#a06468cc
- scrollbarSlider.hoverBackground#c6797ecc
- selection.background#91d1bd40
- settings.checkboxBackground#75809560
- settings.checkboxBorder#c6797e80
- settings.checkboxForeground#758095
- settings.dropdownBackground#172030
- settings.dropdownBorder#c6797e80
- settings.dropdownForeground#A7ACB9
- settings.headerForeground#c6cad2
- settings.inactiveSelectedItemBorder#75809559
- settings.modifiedItemForeground#c6797e
- settings.numberInputBackground#172030
- settings.numberInputBorder#c6797e80
- settings.numberInputForeground#A7ACB9
- settings.textInputBackground#172030
- settings.textInputBorder#c6797e80
- settings.textInputForeground#A7ACB9
- sideBar.background#172030
- sideBar.border#1A2335
- sideBar.dropBackground#c6797edf
- sideBar.foreground#a7acb9
- sideBarSectionHeader.background#172030
- sideBarSectionHeader.foreground#e6e6e6
- statusBar.background#172030
- statusBar.debuggingBackground#97a38fe6
- statusBar.debuggingForeground#fff
- statusBar.foreground#c6cad2
- statusBar.noFolderBackground#c6797edf
- statusBarItem.activeBackground#c6797e
- statusBarItem.activeForeground#fff
- statusBarItem.hoverBackground#293a57
- statusBarItem.prominentBackground#b18bb1cc
- statusBarItem.prominentHoverBackground#b18bb1
- tab.activeBackground#c6797edf
- tab.activeForeground#fff
- tab.border#172030
- tab.inactiveBackground#172030
- tab.inactiveForeground#A7ACB9
- tab.unfocusedActiveForeground#fff
- tab.unfocusedInactiveForeground#A7ACB9
- terminal.ansiBlack#374E73
- terminal.ansiBlue#6e94b9
- terminal.ansiBrightBlack#3F5A85
- terminal.ansiBrightBlue#98b3cd
- terminal.ansiBrightCyan#abcbd3
- terminal.ansiBrightGreen#bec8b7
- terminal.ansiBrightMagenta#ccb3cc
- terminal.ansiBrightRed#d19498
- terminal.ansiBrightWhite#fff
- terminal.ansiBrightYellow#F2EFC7
- terminal.ansiCyan#8ab6c1
- terminal.ansiGreen#ADB9A4
- terminal.ansiMagenta#b18bb1
- terminal.ansiRed#c6797e
- terminal.ansiWhite#e3e4e8
- terminal.ansiYellow#ece7ac
- terminal.background#172030
- terminal.foreground#b8bcc6
- terminalCursor.background#ADB9A4
- terminalCursor.foreground#ADB9A4
- textBlockQuote.background#1D293D
- textBlockQuote.border#c6797e
- textCodeBlock.background#172030
- textLink.activeForeground#98b3cd
- textLink.foreground#6e94b9
- textPreformat.foreground#bbb
- textSeparator.foreground#bbb
- titleBar.activeBackground#172030
- titleBar.activeForeground#A7ACB9
- titleBar.inactiveBackground#1E283A
- titleBar.inactiveForeground#A7ACB9
- walkThrough.embeddedEditorBackground#1F2A3F
- welcomePage.buttonBackground#1D293D
- welcomePage.buttonHoverBackground#293A57
- widget.shadow#121321
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #bbb | — |
| comment, punctuation.definition.comment, unused.comment, wildcard.comment | #64727d | italic |
| constant | #eabe9a | — |
| entity | #F7E3AF | — |
| invalid | #bbb | — |
| keyword | #b18bb1 | italic |
| keyword.operator | #D0D6B5 | regular |
| keyword.operator.new | #D0D6B5 | italic |
| variable.language.this | — | italic |
| meta | #DB6E8F | — |
| meta.brace | #D0D6B5 | — |
| punctuation | #D0D6B5 | — |
| punctuation.definition.template-expression, punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.ts, punctuation.definition.template-expression.end.js | #D0D6B5 | — |
| storage | #b18bb1 | italic |
| storage.type.function.arrow | #b18bb1 | regular |
| string, punctuation.definition.string | #A3B09A | — |
| support | #F7E3AF | — |
| support.variable.property | #DB6E8F | — |
| support.function, entity.name.function | #F9B5AC | — |
| variable | #C6878F | — |
| variable.other.property, variable.other.object.property | #DB6E8F | — |
| variable.parameter | #DB6E8F | — |
| punctuation.definition.string.begin, punctuation.definition.string.end | #D0D6B5 | — |
| comment.block.documentation storage, comment.block.documentation variable, comment.block.documentation punctuation, comment.block.documentation meta | #64727d | — |
| meta.object-literal.key entity, meta.object-literal.key | #bbb | — |
| source.css entity, source.stylus entity | #eabe9a | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id.css punctuation.definition.entity.css | #eabe9a | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.css punctuation.definition.entity.css | #eabe9a | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-class.css punctuation.definition.entity.css | #eabe9a | — |
| entity.name.tag | #DB6E8F | — |
| source.css support, source.stylus support | #bbb | — |
| source.css support.constant.media, source.stylus support.constant.media | #D0D6B5 | — |
| entity.other.attribute-name.pseudo-class.css punctuation.definition.entity.css, entity.other.attribute-name.id.css punctuation.definition.entity.css, entity.other.attribute-name.class.css punctuation.definition.entity.css | #D0D6B5 | — |
| source.css constant, source.css support.constant, source.stylus constant, source.stylus support.constant | #A3B09A | — |
| source.css constant.numeric, source.stylus constant.numeric | #F9B5AC | — |
| source.css keyword.other.unit, source.stylus keyword.other.unit | #A3B09A | regular |
| source.css string, source.css punctuation.definition.string, source.stylus string, source.stylus punctuation.definition.string | #A3B09A | — |
| punctuation.definition.keyword | #b18bb1 | — |
| meta.property-value.css, source.stylus meta.property-value | #A3B09A | — |
| source.css variable, source.stylus variable | #C6878F | — |
| source.css variable.parameter.url, source.stylus variable.parameter.url | #A3B09A | — |
| meta.property-list.scss, meta.property-list.css | #bbb | — |
| meta.property-value.scss, meta.property-value.less | #A3B09A | — |
| source.css meta.at-rule.keyframes, source.css meta.at-rule.mixin, source.css meta.property-list | #D0D6B5 | — |
| meta.at-rule.each.scss | #D0D6B5 | — |
| text.html.basic entity.name, text.html.basic meta.tag.sgml | #DB6E8F | — |
| meta.toc-list.id.html | #A3B09A | — |
| text.html entity.other, entity.other.attribute-name.html | #F7E3AF | italic |
| punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.scope.between-tag-pair.html | #808080 | — |
| text.html.basic meta.tag | #bbb | — |
| constant.name.attribute.tag.jade, args.mixin.jade, string.interpolated.jade, text.jade meta.tag.other, text.jade constant | #D0D6B5 | — |
| entity.other.attribute-name.tag.jade | — | italic |
| entity.other.attribute-name.class.jade, entity.other.attribute-name.id.jade | #eabe9a | — |
| punctuation.definition.tag.xml, punctuation.definition.tag.begin.xml, punctuation.definition.tag.end.xml, meta.scope.between-tag-pair.xml | #808080 | — |
| meta.tag.xml, meta.tag.preprocessor.xml | #bbb | — |
| entity.other.attribute-name.localname.xml | — | italic |
| source.js support.class.component, source.jsx support.class.component | #DB6E8F | — |
| source.js entity.other.attribute-name, source.jsx entity.other.attribute-name | #F7E3AF | italic |
| source.js meta.jsx.children meta.object-literal.key, source.jsx meta.jsx.children meta.object-literal.key | #bbb | — |
| source.js meta.tag variable.other.readwrite, source.jsx meta.tag variable.other.readwrite | #C6878F | — |
| punctuation.definition.tag.begin.js, punctuation.definition.tag.end.js | #808080 | — |
| source.js meta.jsx.children, source.jsx meta.jsx.children | #bbb | — |
| keyword.operator.expression.typeof.js, keyword.operator.expression.instanceof.js | #D0D6B5 | italic |
| meta.embedded.block.json | #D0D6B5 | — |
| source.json support, support.json | #bbb | — |
| support.type.property-name.json | #bbb | — |
| source.json string.json, source.json punctuation.definition.string.json | #A3B09A | — |
| punctuation.definition.heading.markdown | #D0D6B5 | — |
| entity.name.section.markdown, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown | #DB6E8F | bold |
| meta.paragraph.markdown | #bbb | — |
| meta.paragraph.markdown meta.other | #bbb | — |
| beginning.punctuation.definition.quote.markdown | #D0D6B5 | — |
| markup.quote.markdown meta.paragraph.markdown | #A3B09A | italic |
| meta.separator.markdown | #D0D6B5 | — |
| markup.fenced_code.block.markdown | #bbb | — |
| markup.inline.raw.string.markdown | #D0D6B5 | — |
| markup.bold.markdown, markup.bold.markdown punctuation.definition.bold.markdown | #bbb | bold |
| markup.italic.markdown | — | italic |
| beginning.punctuation.definition.list.markdown | #DB6E8F | — |
| string.other.link.title.markdown | #F9B5AC | — |
| string.other.link.title.markdown, string.other.link.description.markdown, string.other.link.description.title.markdown | #F9B5AC | — |
| markup.underline.link.markdown, markup.underline.link.image.markdown | #7ea9a9 | — |
| fenced_code.block.language, markup.inline.raw.markdown | #A3B09A | — |
| fenced_code.block.language, markup.inline.raw.markdown | #A3B09A | — |
| constant.other.database-name.sql | #bbb | — |
| constant.other.table-name.sql | #bbb | — |
| markup.error | #CC565EDF | — |
| markup.inserted | #9BBA9A | — |
| markup.deleted | #CC565EDF | — |
| markup.changed | #FFB86C | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...