Koipop
Publisher: dhoulbThemes in package: 1
Cool relaxing color theme for VS Code with vibrant assertive token colors.
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.activeBackground#454b54
- activityBar.background#2e3238
- activityBar.border#454b54
- activityBar.foreground#f1f2f4
- activityBar.inactiveForeground#abb1ba
- activityBarBadge.background#2f78e5
- activityBarBadge.foreground#ffffff
- badge.background#454b54
- badge.foreground#f1f2f4
- breadcrumb.activeSelectionForeground#ffffff
- breadcrumb.background#2e3238
- breadcrumb.focusForeground#ffffff
- breadcrumb.foreground#abb1ba
- breadcrumbPicker.background#2e3238
- button.background#2f78e5
- button.border#2f78e5
- button.foreground#ffffff
- button.hoverBackground#2f78e5
- button.secondaryBackground#454b54
- button.secondaryForeground#abb1ba
- button.secondaryHoverBackground#454b54
- button.separator#2f78e5
- commandCenter.activeBorder#454b54
- commandCenter.border#454b54
- descriptionForeground#abb1ba
- diffEditor.border#2e3238
- diffEditor.diagonalFill#454b54
- diffEditor.insertedLineBackground#92f41622
- diffEditor.insertedTextBackground#92f41622
- diffEditor.removedLineBackground#e5352f22
- diffEditor.removedTextBackground#e5352f22
- diffEditorGutter.insertedLineBackground#92f41622
- diffEditorGutter.removedLineBackground#e5352f22
- diffEditorOverview.insertedForeground#92f416
- diffEditorOverview.removedForeground#e5352f
- disabledForeground#abb1ba
- dropdown.background#454b54
- dropdown.border#454b54
- dropdown.foreground#f1f2f4
- dropdown.listBackground#2e3238
- editor.background#22252a
- editor.findMatchBackground#2f78e5
- editor.findMatchHighlightBackground#2f78e588
- editor.findRangeHighlightBackground#2f78e588
- editor.foreground#abb1ba
- editor.inactiveSelectionBackground#393e46
- editor.lineHighlightBackground#2e3238
- editor.lineHighlightBorder#2e3238
- editor.selectionBackground#454b54
- editor.selectionForeground#ffffff
- editor.selectionHighlightBackground#393e46
- editor.wordHighlightBackground#393e46
- editor.wordHighlightStrongBackground#393e46
- editor.wordHighlightTextBackground#393e46
- editorCursor.background#ffffff
- editorCursor.foreground#ffffff
- editorGroup.border#454b54
- editorGroup.dropBackground#2f78e522
- editorGroupHeader.border#2e3238
- editorGroupHeader.noTabsBackground#22252a
- editorGroupHeader.tabsBackground#22252a
- editorGutter.addedBackground#92f416
- editorGutter.deletedBackground#e5352f
- editorGutter.modifiedBackground#ffb21a
- editorLineNumber.activeForeground#ffffff
- editorLineNumber.dimmedForeground#454b54
- editorLineNumber.foreground#abb1ba
- editorOverviewRuler.addedForeground#92f416
- editorOverviewRuler.bracketMatchForeground#abb1ba
- editorOverviewRuler.deletedForeground#e5352f
- editorOverviewRuler.errorForeground#e5352f
- editorOverviewRuler.findMatchForeground#2f78e588
- editorOverviewRuler.infoForeground#2f78e5
- editorOverviewRuler.modifiedForeground#ffb21a
- editorOverviewRuler.rangeHighlightForeground#abb1ba88
- editorOverviewRuler.selectionHighlightForeground#abb1ba88
- editorOverviewRuler.warningForeground#ffb21a
- editorOverviewRuler.wordHighlightForeground#abb1ba88
- editorOverviewRuler.wordHighlightStrongForeground#ffffff88
- editorOverviewRuler.wordHighlightTextForeground#abb1ba88
- editorWidget.background#2e3238
- editorWidget.border#454b54
- editorWidget.foreground#f1f2f4
- errorForeground#e5352f
- focusBorder#2f78e5
- foreground#f1f2f4
- gitDecoration.addedResourceForeground#92f416
- gitDecoration.conflictingResourceForeground#e5352f
- gitDecoration.deletedResourceForeground#e5352f
- gitDecoration.ignoredResourceForeground#abb1ba
- gitDecoration.modifiedResourceForeground#ffb21a
- gitDecoration.renamedResourceForeground#ffb21a
- gitDecoration.stageDeletedResourceForeground#e5352f
- gitDecoration.stageModifiedResourceForeground#ffb21a
- gitDecoration.submoduleResourceForeground#abb1ba
- gitDecoration.untrackedResourceForeground#92f416
- icon.foreground#f1f2f4
- input.background#454b54
- input.foreground#f1f2f4
- input.placeholderForeground#abb1ba
- inputOption.activeBackground#2f78e5
- inputOption.activeBorder#2f78e5
- inputOption.activeForeground#ffffff
- inputOption.hoverBackground#454b54
- inputValidation.errorBackground#e5352f
- inputValidation.errorBorder#e5352f
- inputValidation.errorForeground#ffffff
- inputValidation.infoBackground#2f78e5
- inputValidation.infoBorder#2f78e5
- inputValidation.infoForeground#ffffff
- inputValidation.warningBackground#ffb21a
- inputValidation.warningBorder#ffb21a
- inputValidation.warningForeground#ffffff
- list.activeSelectionBackground#2f78e5
- list.activeSelectionForeground#ffffff
- list.activeSelectionIconForeground#ffffff
- list.dropBackground#454b54
- list.errorForeground#e5352f
- list.focusAndSelectionOutline#2f78e5
- list.focusBackground#454b54
- list.focusForeground#ffffff
- list.focusHighlightForeground#ffffff
- list.focusOutline#454b54
- list.highlightForeground#ffffff
- list.hoverBackground#454b54
- list.hoverForeground#ffffff
- list.inactiveFocusBackground#454b54
- list.inactiveFocusOutline#454b54
- list.inactiveSelectionBackground#454b54
- list.inactiveSelectionForeground#ffffff
- list.inactiveSelectionIconForeground#ffffff
- list.invalidItemForeground#abb1ba
- list.warningForeground#ffb21a
- minimap.errorHighlight#e5352f
- minimap.findMatchHighlight#2f78e5
- minimap.selectionHighlight#d5d8dd
- minimap.selectionOccurrenceHighlight#abb1ba
- minimap.warningHighlight#ffb21a
- minimapGutter.addedBackground#92f416
- minimapGutter.deletedBackground#e5352f
- minimapGutter.modifiedBackground#ffb21a
- minimapSlider.activeBackground#abb1ba66
- minimapSlider.background#abb1ba22
- minimapSlider.hoverBackground#abb1ba44
- panel.background#22252a
- panel.border#454b54
- panelSection.border#2e3238
- panelSectionHeader.background#2e3238
- panelSectionHeader.foreground#f1f2f4
- panelTitle.activeBorder#454b54
- panelTitle.activeForeground#f1f2f4
- panelTitle.inactiveForeground#abb1ba
- peekView.border#454b54
- peekViewEditor.background#2e3238
- peekViewResult.background#2e3238
- peekViewTitle.background#2e3238
- problemsErrorIcon.foreground#e5352f
- problemsInfoIcon.foreground#2f78e5
- problemsWarningIcon.foreground#f2d7a0
- progressBar.background#92f416
- sash.hoverBorder#454b54
- scrollbar.shadow#000000
- scrollbarSlider.activeBackground#abb1ba66
- scrollbarSlider.background#abb1ba22
- scrollbarSlider.hoverBackground#abb1ba44
- selection.background#2f78e5
- settings.focusedRowBackground#22252a
- settings.focusedRowBorder#22252a
- settings.modifiedItemIndicator#ffb21a
- settings.rowHoverBackground#22252a
- sideBar.background#22252a
- sideBar.border#454b54
- sideBar.foreground#f1f2f4
- sideBarSectionHeader.background#2e3238
- sideBarSectionHeader.border#454b54
- sideBarSectionHeader.foreground#f1f2f4
- sideBarTitle.foreground#f1f2f4
- sideBySideEditor.horizontalBorder#2e3238
- sideBySideEditor.verticalBorder#2e3238
- statusBar.background#2e3238
- statusBar.border#454b54
- statusBar.debuggingBackground#ffb21a
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#f1f2f4
- statusBarItem.activeBackground#2f78e5
- statusBarItem.errorBackground#e5352f
- statusBarItem.errorForeground#ffffff
- statusBarItem.hoverBackground#454b54
- statusBarItem.remoteBackground#2e3238
- statusBarItem.remoteForeground#ffffff
- statusBarItem.warningBackground#ffb21a
- statusBarItem.warningForeground#ffffff
- tab.activeBackground#2e3238
- tab.activeForeground#f1f2f4
- tab.border#2e3238
- tab.inactiveBackground#22252a
- tab.inactiveForeground#abb1ba
- textBlockQuote.background#22252a
- textBlockQuote.border#2e3238
- textCodeBlock.background#22252a
- textLink.activeForeground#2f78e5
- textLink.foreground#2f78e5
- textPreformat.foreground#f1f2f4
- textSeparator.foreground#2e3238
- toolbar.activeBackground#2f78e5
- toolbar.hoverBackground#454b54
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| string, markup.inline.raw | #ffb21a | — |
| entity.name.function, support.function | #92f416 | — |
| entity.name.type.class, entity.other.inherited-class, variable.language.this, variable.language.super, markup.bold, markup.italic | #ffe01a | — |
| constant.numeric, constant.language, support.constant | #f047ff | — |
| keyword.control, keyword.operator.new, storage.modifier, storage.type, entity.other.attribute-name.pseudo-class, entity.name.tag | #f43789 | — |
| support.type.builtin, support.type.primitive, entity.name.type, punctuation.definition.heading, string.other.link.title, entity.other.attribute-name | #15f4e5 | — |
| markup.underline.link | #15f4e588 | — |
| #2f78e5 | — | |
| invalid | #e5352f | — |
| variable, support.type.property-name, entity.name.label, meta.object-literal.key string, markup, markup string, meta.paragraph, constant.other.color, text.html.derivative | #ffffff | — |
| comment, punctuation, storage.type.function.arrow, meta.brace | #abb1ba | — |
| markup.bold | — | bold |
| meta.type.annotation, meta.return.type, markup.italic | — | italic |
| *url*, *link*, *uri* | — | underline |