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#0a0a0a
- activityBar.foreground#ff007f
- activityBarBadge.background#00ffff
- activityBarBadge.foreground#000000
- badge.background#39ff14
- badge.foreground#000000
- breadcrumb.activeSelectionForeground#ff007f
- breadcrumb.background#000000
- breadcrumb.focusForeground#00ffff
- breadcrumb.foreground#cccccc
- button.background#8a2be2
- button.foreground#ffffff
- button.hoverBackground#ff007f
- debugToolBar.background#0a0a0a
- dropdown.background#1a0a1a
- dropdown.border#39ff14
- dropdown.foreground#ffffff
- editor.background#000000
- editor.findMatchBackground#39ff1460
- editor.findMatchHighlightBackground#39ff1430
- editor.foreground#ffffff
- editor.selectionBackground#8a2be260
- editor.selectionHighlightBackground#8a2be230
- editor.wordHighlightBackground#00ffff20
- editor.wordHighlightStrongBackground#00ffff40
- editorBracketMatch.background#ff007f40
- editorBracketMatch.border#ff007f
- editorCursor.foreground#00ffff
- editorError.foreground#ff007f
- editorGroup.border#ff007f
- editorGroupHeader.tabsBackground#0a0a0a
- editorGutter.addedBackground#39ff14
- editorGutter.background#000000
- editorGutter.deletedBackground#ff007f
- editorGutter.modifiedBackground#00ffff
- editorIndentGuide.activeBackground1#ff007f
- editorIndentGuide.background1#1a0d1a
- editorLineNumber.activeForeground#00ffff
- editorLineNumber.foreground#8a2be2
- editorOverviewRuler.addedForeground#39ff14
- editorOverviewRuler.border#1a0d1a
- editorOverviewRuler.deletedForeground#ff007f
- editorOverviewRuler.errorForeground#ff007f
- editorOverviewRuler.modifiedForeground#00ffff
- editorOverviewRuler.warningForeground#ffff00
- editorWarning.foreground#ffff00
- editorWhitespace.foreground#1a0d1a
- focusBorder#ff007f
- foreground#ffffff
- gitDecoration.addedResourceForeground#39ff14
- gitDecoration.conflictingResourceForeground#ffff00
- gitDecoration.deletedResourceForeground#ff007f
- gitDecoration.ignoredResourceForeground#666666
- gitDecoration.modifiedResourceForeground#00ffff
- gitDecoration.untrackedResourceForeground#39ff14
- input.background#1a0a1a
- input.border#39ff14
- input.foreground#ffffff
- inputOption.activeBorder#00ffff
- list.activeSelectionBackground#1a0d1a
- list.activeSelectionForeground#00ffff
- list.hoverBackground#1a0a1a
- list.inactiveSelectionBackground#1a0a1a
- menu.background#1a0a1a
- menu.foreground#ffffff
- menu.selectionBackground#ff007f40
- menu.selectionForeground#ffffff
- menubar.selectionBackground#ff007f40
- menubar.selectionForeground#ffffff
- minimap.background#000000
- minimapGutter.addedBackground#39ff14
- minimapGutter.deletedBackground#ff007f
- minimapGutter.modifiedBackground#00ffff
- notificationCenterHeader.background#0a0a0a
- notificationCenterHeader.foreground#ff007f
- notifications.background#1a0a1a
- notifications.foreground#ffffff
- panel.background#0a0a0a
- panel.border#ff007f
- panelTitle.activeForeground#39ff14
- panelTitle.inactiveForeground#666666
- peekView.background#1a0a1a
- peekViewEditor.background#000000
- peekViewResult.background#0a0a0a
- peekViewTitle.background#1a0d1a
- progressBar.background#ff007f
- quickInput.background#1a0a1a
- quickInput.foreground#ffffff
- quickInputTitle.background#0a0a0a
- scrollbar.shadow#000000
- scrollbarSlider.background#1a0d1a80
- scrollbarSlider.hoverBackground#ff007f80
- sideBar.background#0a0a0a
- sideBar.foreground#ffffff
- sideBarSectionHeader.background#1a0a1a
- sideBarSectionHeader.foreground#ff007f
- statusBar.background#0a0a0a
- statusBar.foreground#39ff14
- statusBarItem.hoverBackground#1a0d1a
- tab.activeBackground#000000
- tab.activeForeground#ffffff
- tab.border#1a0d1a
- tab.inactiveBackground#0a0a0a
- tab.inactiveForeground#666666
- terminal.ansiBlack#000000
- terminal.ansiBlue#1b03a3
- terminal.ansiBrightBlack#333333
- terminal.ansiBrightBlue#3366ff
- terminal.ansiBrightCyan#66ffff
- terminal.ansiBrightGreen#66ff33
- terminal.ansiBrightMagenta#cc66ff
- terminal.ansiBrightRed#ff3399
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#ffff66
- terminal.ansiCyan#00ffff
- terminal.ansiGreen#39ff14
- terminal.ansiMagenta#8a2be2
- terminal.ansiRed#ff007f
- terminal.ansiWhite#ffffff
- terminal.ansiYellow#ffff00
- terminal.background#000000
- terminal.foreground#ffffff
- titleBar.activeBackground#0a0a0a
- titleBar.activeForeground#ffffff
- titleBar.inactiveBackground#0a0a0a
- titleBar.inactiveForeground#cccccc
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #666666 | italic |
| string | #39ff14 | — |
| constant.numeric | #00ffff | — |
| constant.language | #ffff00 | bold |
| keyword | #ff007f | bold |
| storage.type | #8a2be2 | bold |
| storage.modifier | #ff007f | — |
| entity.name.function | #00ffff | — |
| entity.name.class | #ffff00 | bold |
| entity.name.type | #8a2be2 | — |
| variable | #ffffff | — |
| variable.parameter | #ff9999 | — |
| support.function | #00ffff | — |
| support.class | #ffff00 | — |
| support.type | #8a2be2 | — |
| markup.heading | #ff007f | bold |
| markup.bold | #00ffff | bold |
| markup.italic | #8a2be2 | italic |
| markup.code | #39ff14 | — |
| meta.import, meta.export | #ff007f | — |
| punctuation.definition.tag | #00ffff | — |
| meta.tag, entity.name.tag | #ff007f | — |
| entity.other.attribute-name | #39ff14 | — |
| string.quoted.double.html, string.quoted.single.html | #00ffff | — |
| punctuation.definition.string | #39ff14 | — |
| punctuation.section.embedded | #ff007f | — |
| operator | #ff007f | — |
| punctuation | #cccccc | — |
| entity.other.inherited-class | #8a2be2 | underline |
| constant.character.escape | #00ffff | — |
| keyword.operator.logical | #ffff00 | — |
| variable.language.this | #ff007f | italic |
| entity.name.section | #39ff14 | — |
| support.constant | #00ffff | — |
| meta.function-call | #ffffff | — |
| string.regexp | #8a2be2 | — |
| constant.other.color | #00ffff | — |
| meta.selector | #ff007f | — |
| entity.other.attribute-name.id | #ffff00 | — |
| entity.other.attribute-name.class | #39ff14 | — |
| support.type.property-name | #00ffff | — |
| keyword.other.important | #ff007f | bold |
| variable.language.super | #8a2be2 | italic |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...