Perpetuity Theme
Publisher: Sathwik KunchamThemes in package: 2
A clean, modern theme with teal accents, semantic highlighting, and comprehensive syntax coverage for 20+ languages
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#0a1a20
- activityBar.border#164955
- activityBar.foreground#4de8e8
- activityBar.inactiveForeground#36a5a5
- activityBarBadge.background#4de8e8
- activityBarBadge.foreground#0a1a20
- badge.background#4de8e8
- badge.foreground#0a1a20
- breadcrumb.activeSelectionForeground#4de8e8
- breadcrumb.focusForeground#4de8e8
- breadcrumb.foreground#36a5a5
- breadcrumbPicker.background#0c2025
- button.background#4de8e8
- button.foreground#0a1a20
- button.hoverBackground#36a5a5
- button.secondaryBackground#164955
- button.secondaryForeground#4de8e8
- button.secondaryHoverBackground#0f3039
- debugToolBar.background#0c2025
- debugToolBar.border#164955
- descriptionForeground#36a5a5
- dropdown.background#0c2025
- dropdown.border#164955
- dropdown.foreground#4de8e8
- editor.background#0a1a20
- editor.findMatchBackground#4de8e830
- editor.findMatchHighlightBackground#4de8e820
- editor.foreground#4de8e8
- editor.lineHighlightBackground#0f303950
- editor.lineHighlightBorder#0f303900
- editor.selectionBackground#164955
- editor.selectionHighlightBackground#16495580
- editor.wordHighlightBackground#16495580
- editor.wordHighlightStrongBackground#16495580
- editorBracketMatch.background#16495550
- editorBracketMatch.border#4de8e8
- editorCursor.foreground#4de8e8
- editorError.foreground#e83c3c
- editorGroup.border#164955
- editorGroup.dropBackground#16495530
- editorGroupHeader.tabsBackground#0a1a20
- editorGroupHeader.tabsBorder#164955
- editorHint.foreground#36a5a5
- editorHoverWidget.background#0c2025
- editorHoverWidget.border#164955
- editorIndentGuide.activeBackground#164955
- editorIndentGuide.background#16495570
- editorInfo.foreground#4de8e8
- editorLineNumber.activeForeground#4de8e8
- editorLineNumber.foreground#36a5a580
- editorRuler.foreground#164955
- editorSuggestWidget.background#0c2025
- editorSuggestWidget.border#164955
- editorSuggestWidget.foreground#4de8e8
- editorSuggestWidget.highlightForeground#4de8e8
- editorSuggestWidget.selectedBackground#164955
- editorWarning.foreground#ffda44
- editorWidget.background#0c2025
- editorWidget.border#164955
- editorWidget.resizeBorder#4de8e8
- extensionButton.prominentBackground#4de8e8
- extensionButton.prominentForeground#0a1a20
- extensionButton.prominentHoverBackground#36a5a5
- focusBorder#4de8e8
- foreground#4de8e8
- gitDecoration.addedResourceForeground#39e75f
- gitDecoration.conflictingResourceForeground#c792ea
- gitDecoration.deletedResourceForeground#e83c3c
- gitDecoration.ignoredResourceForeground#36a5a580
- gitDecoration.modifiedResourceForeground#ffda44
- gitDecoration.submoduleResourceForeground#4de8e8
- gitDecoration.untrackedResourceForeground#36a5a5
- input.background#164955
- input.border#164955
- input.foreground#4de8e8
- input.placeholderForeground#36a5a580
- input.selectionBackground#0f3039
- inputOption.activeBorder#4de8e8
- inputValidation.errorBackground#e83c3c
- inputValidation.errorBorder#e83c3c
- inputValidation.errorForeground#f2f2f2
- inputValidation.infoBackground#4de8e8
- inputValidation.infoBorder#4de8e8
- inputValidation.infoForeground#0a1a20
- inputValidation.warningBackground#ffda44
- inputValidation.warningBorder#ffda44
- inputValidation.warningForeground#0a1a20
- list.activeSelectionBackground#164955
- list.activeSelectionForeground#4de8e8
- list.dropBackground#16495550
- list.focusBackground#16495580
- list.focusForeground#4de8e8
- list.highlightForeground#4de8e8
- list.hoverBackground#0f3039
- list.hoverForeground#4de8e8
- list.inactiveSelectionBackground#0f3039
- list.inactiveSelectionForeground#4de8e8
- listFilterWidget.background#0c2025
- listFilterWidget.noMatchesOutline#e83c3c
- listFilterWidget.outline#4de8e8
- menu.background#0c2025
- menu.foreground#4de8e8
- menu.selectionBackground#164955
- menu.selectionForeground#4de8e8
- menu.separatorBackground#164955
- menubar.selectionBackground#164955
- menubar.selectionForeground#4de8e8
- notificationCenter.border#164955
- notificationCenterHeader.background#0a1a20
- notificationCenterHeader.foreground#4de8e8
- notificationLink.foreground#4de8e8
- notifications.background#0c2025
- notifications.border#164955
- notifications.foreground#4de8e8
- notificationToast.border#164955
- panel.background#0a1a20
- panel.border#164955
- panelTitle.activeBorder#4de8e8
- panelTitle.activeForeground#4de8e8
- panelTitle.inactiveForeground#36a5a5
- peekView.border#4de8e8
- peekViewEditor.background#0f3039
- peekViewEditor.matchHighlightBackground#4de8e840
- peekViewResult.background#0a1a20
- peekViewResult.fileForeground#4de8e8
- peekViewResult.lineForeground#36a5a5
- peekViewResult.matchHighlightBackground#4de8e840
- peekViewResult.selectionBackground#164955
- peekViewResult.selectionForeground#4de8e8
- peekViewTitle.background#164955
- peekViewTitleDescription.foreground#36a5a5
- peekViewTitleLabel.foreground#4de8e8
- problemsErrorIcon.foreground#e83c3c
- problemsInfoIcon.foreground#4de8e8
- problemsWarningIcon.foreground#ffda44
- progressBar.background#4de8e8
- selection.background#164955
- settings.checkboxBackground#0c2025
- settings.checkboxBorder#164955
- settings.checkboxForeground#4de8e8
- settings.dropdownBackground#0c2025
- settings.dropdownBorder#164955
- settings.dropdownForeground#4de8e8
- settings.headerForeground#4de8e8
- settings.modifiedItemIndicator#4de8e8
- settings.numberInputBackground#0c2025
- settings.numberInputBorder#164955
- settings.numberInputForeground#4de8e8
- settings.textInputBackground#0c2025
- settings.textInputBorder#164955
- settings.textInputForeground#4de8e8
- sideBar.background#0a1a20
- sideBar.border#164955
- sideBar.foreground#4de8e8
- sideBarSectionHeader.background#164955
- sideBarSectionHeader.border#164955
- sideBarSectionHeader.foreground#4de8e8
- sideBarTitle.foreground#4de8e8
- statusBar.background#164955
- statusBar.border#164955
- statusBar.debuggingBackground#36a5a5
- statusBar.debuggingForeground#0a1a20
- statusBar.foreground#4de8e8
- statusBar.noFolderBackground#0f3039
- statusBar.noFolderForeground#4de8e8
- statusBarItem.activeBackground#16495540
- statusBarItem.hoverBackground#16495580
- statusBarItem.prominentBackground#e83c3c
- statusBarItem.prominentForeground#f2f2f2
- statusBarItem.prominentHoverBackground#e83c3c80
- tab.activeBackground#0a1a20
- tab.activeBorder#4de8e8
- tab.activeBorderTop#00000000
- tab.activeForeground#4de8e8
- tab.border#164955
- tab.hoverBackground#0f3039
- tab.hoverForeground#4de8e8
- tab.inactiveBackground#0a1a20
- tab.inactiveForeground#36a5a5
- terminal.ansiBlack#0c2025
- terminal.ansiBlue#4de8e8
- terminal.ansiBrightBlack#0f3039
- terminal.ansiBrightBlue#70ecec
- terminal.ansiBrightCyan#45c6c6
- terminal.ansiBrightGreen#4aff73
- terminal.ansiBrightMagenta#d5a6f7
- terminal.ansiBrightRed#f54545
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#ffe066
- terminal.ansiCyan#36a5a5
- terminal.ansiGreen#39e75f
- terminal.ansiMagenta#c792ea
- terminal.ansiRed#e83c3c
- terminal.ansiWhite#d4f1f1
- terminal.ansiYellow#ffda44
- terminal.background#0a1a20
- terminal.foreground#4de8e8
- terminalCursor.background#0a1a20
- terminalCursor.foreground#4de8e8
- titleBar.activeBackground#0a1a20
- titleBar.activeForeground#4de8e8
- titleBar.border#164955
- titleBar.inactiveBackground#0a1a20
- titleBar.inactiveForeground#36a5a5
- walkThrough.embeddedEditorBackground#0a1a20
- welcomePage.buttonBackground#164955
- welcomePage.buttonHoverBackground#0f3039
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #566b73 | — |
| string, punctuation.definition.string | #39e75f | — |
| keyword, storage.type, storage.modifier, keyword.control, keyword.operator.new | #4de8e8 | bold |
| entity.name.function, support.function, meta.function-call.generic | #70ecec | — |
| entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, entity.name.type.class, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy | #36a5a5 | bold |
| variable, variable.other, variable.parameter, variable.name, support.variable, entity.name.variable | #52e5e5 | — |
| constant, constant.numeric, constant.language, constant.character, constant.other, support.constant | #c792ea | — |
| entity.name.tag, punctuation.definition.tag | #4de8e8 | bold |
| entity.other.attribute-name | #70ecec | italic |
| invalid, invalid.illegal | #e83c3c | — |
| invalid.deprecated | #e83c3c | italic underline |
| keyword.operator | #89ddff | — |
| constant.character.escape | #45c6c6 | — |
| punctuation.definition, punctuation.definition.parameters, punctuation.definition.array, punctuation.section, punctuation.separator, punctuation.terminator | #36a5a5 | — |
| variable.other.property, variable.other.object.property, support.type.property-name | #36c5c5 | — |
| support.type.property-name.json | #70ecec | — |
| support.type.property-name.css | #70ecec | — |
| entity.other.attribute-name | #36a5a5 | italic |
| markup.heading, entity.name.section.markdown | #4de8e8 | bold |
| markup.bold | #4de8e8 | bold |
| markup.italic | #4de8e8 | italic |
| markup.underline.link, string.other.link | #70ecec | — |
| markup.list | #4de8e8 | — |
| meta.method-call, meta.function-call entity.name.function, support.function.console | #5dd5ec | — |
| support.function.builtin, support.function.magic, support.function.builtin.python | #70ecec | italic |
| entity.name.function.constructor, support.class.builtin | #36a5a5 | bold |
| variable.parameter, meta.parameters variable, variable.parameter.function, meta.function.parameters variable | #e0af68 | italic |
| meta.object-literal.key, variable.other.property, variable.other.object.property | #36c5c5 | — |
| variable.language, variable.language.this, variable.language.self, variable.language.super, variable.parameter.function.language.special.self.python | #c792ea | italic |
| variable.other.constant, variable.other.enummember, constant.other.caps | #c792ea | — |
| entity.name.type.parameter, meta.type.parameters, support.type.primitive, meta.type.annotation | #52bebe | italic |
| entity.name.type.interface, support.type.interface | #4ab5b5 | bold |
| entity.name.type.enum, support.type.enum | #45a8a8 | bold |
| meta.decorator, punctuation.decorator, storage.type.annotation, meta.function.decorator.python, entity.name.function.decorator.python | #ffda44 | italic |
| meta.template.expression, punctuation.definition.template-expression, meta.embedded | #4de8e8 | — |
| string.template punctuation.definition.string, punctuation.definition.string.template | #45c6c6 | — |
| string.regexp, keyword.operator.quantifier.regexp, constant.character.escape.backslash.regexp, keyword.control.anchor.regexp | #45c6c6 | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as | #c792ea | bold |
| string.quoted.module, meta.import string | #39e75f | — |
| comment.block.documentation, comment.line.documentation, string.quoted.docstring.multi.python | #7f9fa3 | italic |
| storage.type.class.jsdoc, punctuation.definition.block.tag.jsdoc, entity.name.type.instance.jsdoc, variable.other.jsdoc | #70ecec | italic |
| entity.name.type.instance.jsdoc | #52bebe | italic |
| entity.name.tag.tsx, support.class.component.tsx, support.class.component.jsx, entity.name.tag.js.jsx | #36a5a5 | bold |
| entity.other.attribute-name.tsx, entity.other.attribute-name.jsx | #70ecec | italic |
| storage.type.interface.ts, storage.type.type.ts, storage.type.class.ts | #4de8e8 | bold |
| variable.language.this.ts, variable.language.this.tsx | #c792ea | italic |
| string.quoted.single.python.f-string, string.quoted.double.python.f-string, meta.fstring.python | #39e75f | — |
| meta.interpolation.python, meta.embedded.python | #4de8e8 | — |
| support.function.magic.python | #70ecec | italic |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.scss | #ffda44 | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id.scss | #70ecec | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #c792ea | italic |
| keyword.other.unit.css, keyword.other.unit.scss, keyword.other.unit.percentage.css | #f5a868 | — |
| variable.css, variable.argument.css | #70ecec | — |
| markup.inline.raw.markdown, markup.fenced_code.block.markdown | #39e75f | — |
| fenced_code.block.language, markup.fenced_code.block.markdown fenced_code.block.language | #70ecec | — |
| markup.quote.markdown, punctuation.definition.quote.begin.markdown | #7f9fa3 | italic |
| entity.name.namespace, entity.name.type.module, entity.name.type.namespace | #70ecec | — |
| entity.name.label | #ffda44 | bold |
| entity.name.function.preprocessor, meta.preprocessor.macro, entity.name.other.preprocessor.macro | #f5a868 | — |
| storage.modifier.access, storage.modifier.visibility | #c792ea | italic |
| constant.numeric.hex, constant.numeric.octal, constant.numeric.binary, constant.numeric.float | #f5a868 | — |
| support.type.property-name.json, string.json support.type.property-name.json | #70ecec | — |
| source.json meta.structure.dictionary.json support.type.property-name.json | #70ecec | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #36c5c5 | — |
| entity.name.tag.yaml | #70ecec | — |
| keyword.other.sql | #c792ea | bold |
| markup.inserted, meta.diff.header.to-file | #39e75f | — |
| markup.deleted, meta.diff.header.from-file | #e83c3c | — |
| markup.changed | #ffda44 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...