Velvet Noir
Publisher: RacedThemes in package: 1
A rich, romantic dark theme built around a hand-picked velvet color palette — perfect for developers who want their editor to feel as luxurious as it looks.
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#0f0208
- activityBar.border#2C0415
- activityBar.foreground#EE9FB3
- activityBar.inactiveForeground#720008
- activityBarBadge.background#9F305E
- activityBarBadge.foreground#EE9FB3
- badge.background#9F305E
- badge.foreground#EE9FB3
- breadcrumb.activeSelectionForeground#B175A5
- breadcrumb.background#130309
- breadcrumb.foreground#720008
- breadcrumbPicker.background#1a0510
- button.background#9F305E
- button.foreground#EE9FB3
- button.hoverBackground#720008
- button.secondaryBackground#2C0415
- button.secondaryForeground#EE9FB3
- checkbox.background#1a0510
- checkbox.border#720008
- debugToolBar.background#1a0510
- debugToolBar.border#720008
- dropdown.background#1a0510
- dropdown.border#720008
- dropdown.foreground#EE9FB3
- editor.background#1a0510
- editor.findMatchBackground#9F305E88
- editor.findMatchHighlightBackground#9F305E44
- editor.foreground#EE9FB3
- editor.inactiveSelectionBackground#9F305E22
- editor.lineHighlightBackground#2C041520
- editor.selectionBackground#9F305E55
- editor.selectionHighlightBackground#9F305E33
- editor.wordHighlightBackground#B175A522
- editor.wordHighlightStrongBackground#B175A544
- editorBracketMatch.background#9F305E44
- editorBracketMatch.border#9F305E
- editorCursor.foreground#EE9FB3
- editorError.foreground#ff4d6d
- editorGroupHeader.tabsBackground#0f0208
- editorGroupHeader.tabsBorder#2C0415
- editorGutter.background#160410
- editorHoverWidget.background#2C0415
- editorHoverWidget.border#720008
- editorIndentGuide.activeBackground1#9F305E66
- editorIndentGuide.background1#2C041540
- editorInfo.foreground#B175A5
- editorLineNumber.activeForeground#B175A5
- editorLineNumber.foreground#720008aa
- editorRuler.foreground#2C041566
- editorSuggestWidget.background#1a0510
- editorSuggestWidget.border#720008
- editorSuggestWidget.foreground#EE9FB3
- editorSuggestWidget.highlightForeground#B175A5
- editorSuggestWidget.selectedBackground#2C0415
- editorWarning.foreground#EE9FB3
- editorWhitespace.foreground#2C041566
- editorWidget.background#1a0510
- editorWidget.border#720008
- extensionButton.prominentBackground#9F305E
- extensionButton.prominentForeground#EE9FB3
- extensionButton.prominentHoverBackground#720008
- focusBorder#9F305E
- foreground#EE9FB3
- gitDecoration.conflictingResourceForeground#ff4d6d
- gitDecoration.deletedResourceForeground#720008
- gitDecoration.ignoredResourceForeground#720008aa
- gitDecoration.modifiedResourceForeground#B175A5
- gitDecoration.untrackedResourceForeground#9F305E
- input.background#1a0510
- input.border#720008
- input.foreground#EE9FB3
- input.placeholderForeground#720008
- inputOption.activeBackground#9F305E33
- inputOption.activeBorder#9F305E
- list.activeSelectionBackground#2C0415
- list.activeSelectionForeground#EE9FB3
- list.focusBackground#2C0415
- list.highlightForeground#B175A5
- list.hoverBackground#2C041533
- list.hoverForeground#EE9FB3
- list.inactiveSelectionBackground#2C041566
- menu.background#1a0510
- menu.foreground#EE9FB3
- menu.selectionBackground#2C0415
- menu.selectionForeground#EE9FB3
- menu.separatorBackground#2C0415
- menubar.selectionBackground#2C0415
- menubar.selectionForeground#EE9FB3
- notificationCenterHeader.background#0f0208
- notificationLink.foreground#B175A5
- notifications.background#1a0510
- notifications.border#720008
- notifications.foreground#EE9FB3
- panel.background#0f0208
- panel.border#2C0415
- panel.dropBorder#2C0415
- panelTitle.activeBorder#9F305E
- panelTitle.activeForeground#EE9FB3
- panelTitle.inactiveForeground#720008
- peekView.border#720008
- peekViewEditor.background#130309
- peekViewEditor.matchHighlightBackground#9F305E44
- peekViewResult.background#0f0208
- peekViewResult.matchHighlightBackground#9F305E44
- peekViewResult.selectionBackground#2C0415
- peekViewTitle.background#1a0510
- peekViewTitleDescription.foreground#B175A5
- peekViewTitleLabel.foreground#EE9FB3
- progressBar.background#9F305E
- scrollbar.shadow#00000066
- scrollbarSlider.activeBackground#9F305E
- scrollbarSlider.background#9F305E33
- scrollbarSlider.hoverBackground#9F305E66
- selection.background#9F305E55
- sideBar.background#130309
- sideBar.border#2C0415
- sideBar.foreground#EE9FB3cc
- sideBarSectionHeader.background#1a0510
- sideBarSectionHeader.border#2C0415
- sideBarSectionHeader.foreground#B175A5
- sideBarTitle.foreground#B175A5
- statusBar.background#720008
- statusBar.border#720008
- statusBar.debuggingBackground#9F305E
- statusBar.debuggingForeground#EE9FB3
- statusBar.foreground#EE9FB3
- statusBar.noFolderBackground#2C0415
- statusBarItem.hoverBackground#9F305E55
- tab.activeBackground#1a0510
- tab.activeBorder#9F305E
- tab.activeForeground#EE9FB3
- tab.border#2C0415
- tab.inactiveBackground#0f0208
- tab.inactiveForeground#720008
- tab.unfocusedActiveBorder#720008
- terminal.ansiBrightBlack#2C0415
- terminal.ansiBrightBlue#9F305E
- terminal.ansiBrightGreen#B175A5
- terminal.ansiBrightMagenta#B175A5
- terminal.ansiBrightRed#ff4d6d
- terminal.ansiBrightYellow#EE9FB3
- terminal.ansiCyan#B175A5
- terminal.ansiMagenta#9F305E
- terminal.ansiRed#720008
- terminal.background#0f0208
- terminal.foreground#EE9FB3
- terminal.selectionBackground#9F305E55
- terminalCursor.foreground#EE9FB3
- titleBar.activeBackground#0f0208
- titleBar.activeForeground#EE9FB3
- titleBar.border#2C0415
- titleBar.inactiveBackground#0f0208
- titleBar.inactiveForeground#720008
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #72000888 | italic |
| string, string.quoted, string.template | #EE9FB3 | — |
| constant.character.escape, string.regexp | #B175A5 | — |
| constant.numeric, constant.language.boolean, constant.language.null, constant.language.undefined | #9F305E | — |
| keyword, keyword.control, keyword.operator, storage.type | #B175A5 | italic |
| storage.modifier, keyword.control.flow | #9F305E | italic |
| entity.name.function, meta.function-call.generic, support.function | #EE9FB3 | bold |
| entity.name.class, entity.name.type, support.class, entity.other.inherited-class | #B175A5 | — |
| variable, variable.other | #EE9FB3cc | — |
| variable.parameter | #EE9FB3 | italic |
| entity.name.tag, support.class.component | #9F305E | — |
| entity.other.attribute-name | #B175A5 | italic |
| support.type.property-name, meta.property-name | #EE9FB3 | — |
| support.constant.property-value, keyword.other.unit | #9F305E | — |
| entity.other.attribute-name.class, entity.other.attribute-name.id | #B175A5 | — |
| string.quoted.double.include, meta.import string | #EE9FB399 | — |
| keyword.operator.assignment, punctuation.accessor | #B175A5aa | — |
| meta.object-literal.key, support.type.property-name.json | #EE9FB3 | — |
| meta.decorator, punctuation.decorator | #9F305E | italic |
| markup.heading, entity.name.section | #B175A5 | bold |
| markup.bold | #EE9FB3 | bold |
| markup.italic | #9F305E | italic |
| markup.underline.link | #B175A5 | — |
| markup.inline.raw, markup.fenced_code | #EE9FB3bb | — |
| invalid, invalid.deprecated | #ff4d6d | strikethrough |