Ssera Themes
Publisher: sserafyThemes in package: 19
Themes inspired by nature and media aesthetics. Personally curated and designed (with the exception of Dracula).
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#1a1310
- activityBar.foreground#ff9cb3
- activityBarBadge.background#A0303E
- activityBarBadge.foreground#f5f0e8
- badge.background#A0303E
- badge.foreground#f5f0e8
- button.background#ff9cb3
- button.foreground#1a1310
- button.hoverBackground#ffb3cc
- debugToolBar.background#1a1310
- dropdown.background#2d2420
- dropdown.border#5c4f47
- dropdown.foreground#f5f0e8
- editor.background#1f1a16
- editor.findMatchBackground#ff9cb340
- editor.findMatchHighlightBackground#ff9cb320
- editor.foreground#ede3d5
- editor.selectionBackground#5c4f4780
- editor.selectionHighlightBackground#3d2f2a40
- editor.wordHighlightBackground#d4a57420
- editor.wordHighlightStrongBackground#d4a57430
- editorBracketMatch.background#3d2f2a40
- editorBracketMatch.border#ff9cb3
- editorCursor.foreground#ff9cb3
- editorError.foreground#c73e4a
- editorGroup.border#3d2f2a
- editorGroupHeader.tabsBackground#1a1310
- editorIndentGuide.activeBackground1#ff9cb3
- editorIndentGuide.background1#3d2f2a
- editorLineNumber.activeForeground#ff9cb3
- editorLineNumber.foreground#5c4f47
- editorSuggestWidget.background#2d2420
- editorSuggestWidget.border#5c4f47
- editorSuggestWidget.foreground#ede3d5
- editorSuggestWidget.selectedBackground#3d2f2a
- editorWarning.foreground#d4a574
- editorWhitespace.foreground#3d2f2a
- editorWidget.background#2d2420
- editorWidget.border#5c4f47
- focusBorder#ff9cb3
- foreground#f5f0e8
- gitDecoration.addedResourceForeground#7d8471
- gitDecoration.conflictingResourceForeground#c73e4a
- gitDecoration.deletedResourceForeground#A0303E
- gitDecoration.ignoredResourceForeground#5c4f47
- gitDecoration.modifiedResourceForeground#d4a574
- gitDecoration.untrackedResourceForeground#ff9cb3
- input.background#2d2420
- input.border#5c4f47
- input.foreground#f5f0e8
- inputOption.activeBorder#ff9cb3
- list.activeSelectionBackground#3d2f2a
- list.activeSelectionForeground#ff9cb3
- list.hoverBackground#2d2420
- list.inactiveSelectionBackground#2d2420
- menu.background#2d2420
- menu.foreground#ede3d5
- menu.selectionBackground#3d2f2a
- menu.selectionForeground#ff9cb3
- menubar.selectionBackground#3d2f2a
- menubar.selectionForeground#ff9cb3
- notificationCenter.border#5c4f47
- notificationCenterHeader.background#2d2420
- notifications.background#2d2420
- notifications.border#5c4f47
- notifications.foreground#ede3d5
- notificationToast.border#5c4f47
- panel.background#1a1310
- panel.border#3d2f2a
- panelTitle.activeForeground#ff9cb3
- panelTitle.inactiveForeground#6b5d54
- peekView.border#ff9cb3
- peekViewEditor.background#1f1a16
- peekViewResult.background#2d2420
- peekViewTitle.background#3d2f2a
- progressBar.background#ff9cb3
- scrollbar.shadow#000000
- scrollbarSlider.background#3d2f2a80
- scrollbarSlider.hoverBackground#5c4f47
- sideBar.background#1a1310
- sideBar.foreground#ede3d5
- sideBarSectionHeader.background#2d2420
- sideBarSectionHeader.foreground#ff9cb3
- statusBar.background#1a1310
- statusBar.foreground#f5f0e8
- statusBarItem.hoverBackground#2d2420
- tab.activeBackground#1f1a16
- tab.activeForeground#ff9cb3
- tab.border#3d2f2a
- tab.inactiveBackground#1a1310
- tab.inactiveForeground#6b5d54
- terminal.ansiBlack#3d2f2a
- terminal.ansiBlue#8b9dc3
- terminal.ansiBrightBlack#5c4f47
- terminal.ansiBrightBlue#a0b3d6
- terminal.ansiBrightCyan#bcd3b4
- terminal.ansiBrightGreen#94a085
- terminal.ansiBrightMagenta#ffb3cc
- terminal.ansiBrightRed#c73e4a
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#e6b787
- terminal.ansiCyan#a8c0a0
- terminal.ansiGreen#7d8471
- terminal.ansiMagenta#ff9cb3
- terminal.ansiRed#A0303E
- terminal.ansiWhite#f5f0e8
- terminal.ansiYellow#d4a574
- terminal.background#1f1a16
- terminal.foreground#ede3d5
- titleBar.activeBackground#1a1310
- titleBar.activeForeground#ede3d5
- titleBar.inactiveBackground#1a1310
- titleBar.inactiveForeground#6b5d54
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #8b7b73 | italic |
| string | #a8c0a0 | — |
| constant.numeric | #d4a574 | — |
| constant.language | #f5f0e8 | — |
| keyword | #8b9dc3 | — |
| storage.type | #ff9cb3 | — |
| storage.modifier | #94a085 | — |
| entity.name.function | #d4a574 | — |
| entity.name.class | #ffb3cc | — |
| entity.name.type | #a0b3d6 | — |
| variable | #ede3d5 | — |
| variable.parameter | #e6c7b8 | — |
| support.function | #bcd3b4 | — |
| support.class | #e6b787 | — |
| markup.heading | #ff9cb3 | bold |
| markup.bold | #ffb3cc | bold |
| markup.italic | #f5f0e8 | italic |
| meta.import, meta.export | #8b9dc3 | — |
| punctuation.definition.tag | #ff9cb3 | — |
| meta.tag, entity.name.tag | #ffb3cc | — |
| entity.other.attribute-name | #d4a574 | — |
| punctuation.separator | #8b7b73 | — |
| punctuation.terminator | #ede3d5 | — |
| operator | #c0a8a0 | — |
| meta.brace | #ede3d5 | — |
| constant.other.color | #ff9cb3 | — |
| invalid | #f5f0e8 | — |
| invalid.deprecated | #f5f0e8 | — |
| constant.character.escape | #a8c0a0 | — |
| string.regexp | #94a085 | — |
| markup.list | #d4a574 | — |
| markup.quote | #8b7b73 | italic |
| meta.diff.header | #8b7b73 | — |
| markup.deleted | #A0303E | — |
| markup.inserted | #7d8471 | — |
| markup.changed | #d4a574 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...