Red Velvet Cupcake

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#CF5050
• activityBar.inactiveForeground#ffacac
• activityBarBadge.background#404051
• activityBarBadge.foreground#ffffff
• badge.background#49717C
• badge.foreground#0f0f0f
• breadcrumb.focusForeground#CF5050
• breadcrumb.foreground#404051
• button.background#CF5050
• button.foreground#ffffff
• debugToolBar.background#1c1e27
• dropdown.background#20232c
• editor.background#ffffff
• editor.findMatchBackground#ff7777
• editor.foreground#5d7075
• editor.lineHighlightBackground#f2eaff
• editor.lineHighlightBorder#ffffff
• editor.rangeHighlightBackground#A09BB3
• editor.selectionBackground#f2eaff
• editor.selectionHighlightBackground#2b74b3
• editor.wordHighlightBackground#49717C
• editor.wordHighlightStrongBackground#A09BB3
• editorCursor.foreground#A09BB3
• editorError.foreground#CF5050
• editorGroup.dropBackground#49717C
• editorGroup.focusedEmptyBorder#49717C
• editorGroupHeader.tabsBackground#2B2B36
• editorHoverWidget.background#A09BB3
• editorIndentGuide.background#c9c7d1
• editorLineNumber.activeForeground#a26ef7
• editorLineNumber.foreground#A09BB3
• editorLink.activeForeground#399EF4
• editorMarkerNavigation.background#A09BB3
• editorSuggestWidget.highlightForeground#CF5050
• editorSuggestWidget.selectedBackground#f2eaff
• editorWhitespace.foreground#FF3399
• editorWidget.background#ffffff
• focusBorder#2B2B36
• foreground#404051
• gitDecoration.addedResourceForeground#00B253
• gitDecoration.modifiedResourceForeground#f7bdbd
• gitDecoration.untrackedResourceForeground#A09BB3
• input.background#ffffff
• inputOption.activeBorder#49717C
• list.activeSelectionBackground#404051
• list.activeSelectionForeground#ffffff
• list.dropBackground#404051
• list.focusBackground#404051
• list.focusForeground#ffffff
• list.highlightForeground#ffffff
• list.hoverBackground#2B2B36
• list.hoverForeground#FFFFFF
• list.inactiveSelectionBackground#404051
• minimap.background#ffffff
• panel.background#2B2B36
• panel.border#0f0f0f
• panelTitle.activeBorder#5d7075
• panelTitle.inactiveForeground#5d7075
• peekView.border#49717C
• peekViewEditor.background#101116
• peekViewResult.background#0f0f0f
• peekViewTitle.background#14161c
• pickerGroup.border#0f0f0f
• selection.background#49717C
• sideBar.background#404051
• sideBar.foreground#b6b6b6
• sideBarSectionHeader.background#404051
• sideBarSectionHeader.border#404051
• sideBarSectionHeader.foreground#FFFFFF
• statusBar.background#CF5050
• statusBar.debuggingBackground#49717C
• statusBar.debuggingForeground#0f0f0f
• statusBar.foreground#ffffff
• statusBar.noFolderBackground#101116
• statusBarItem.activeBackground#49717C
• statusBarItem.hoverBackground#0f0f0f
• statusBarItem.remoteBackground#49717C
• statusBarItem.remoteForeground#0f0f0f
• tab.activeBackground#545463
• tab.activeModifiedBorder#49717C
• tab.border#000000
• tab.inactiveBackground#2B2B36
• tab.inactiveModifiedBorder#2b434a
• tab.unfocusedActiveModifiedBorder#3a5a63
• tab.unfocusedInactiveModifiedBorder#2b434a
• terminal.background#2B2B36
• textLink.foreground#CF5050
• titleBar.activeBackground#101116

tokenColors

TextMate scopes and font styles (syntax highlighting rules).