Carex
Publisher: OMERBABACOThemes in package: 11
🎨 A premium VS Code theme suite with 11 color variants, file icons, and product icons. Inspired by Catppuccin, refined for long coding sessions.
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.activeBackground#31324440
- activityBar.activeBorder#89b4fa
- activityBar.activeFocusBorder#89b4fa
- activityBar.background#181825
- activityBar.border#313244
- activityBar.dropBorder#89b4fa
- activityBar.foreground#89b4fa
- activityBar.inactiveForeground#6c7086
- activityBarBadge.background#f38ba8
- activityBarBadge.foreground#1e1e2e
- badge.background#f38ba8
- badge.foreground#1e1e2e
- breadcrumb.activeSelectionForeground#89b4fa
- breadcrumb.background#181825
- breadcrumb.focusForeground#89b4fa
- breadcrumb.foreground#9399b2
- breadcrumbPicker.background#181825
- button.background#89b4fa
- button.foreground#1e1e2e
- button.hoverBackground#a6c9f7
- button.secondaryBackground#45475a
- button.secondaryForeground#cdd6f4
- button.secondaryHoverBackground#585b70
- charts.blue#89b4fa
- charts.foreground#cdd6f4
- charts.green#a6e3a1
- charts.lines#89b4fa
- charts.orange#fab387
- charts.purple#cba6f7
- charts.red#f38ba8
- charts.yellow#f9e2af
- checkbox.background#1e1e2e
- checkbox.border#45475a
- checkbox.foreground#89b4fa
- debugConsole.errorForeground#f38ba8
- debugConsole.infoForeground#89b4fa
- debugConsole.sourceForeground#cba6f7
- debugConsole.warningForeground#f9e2af
- debugConsoleInputIcon.foreground#89b4fa
- debugIcon.breakpointDisabledForeground#6c7086
- debugIcon.breakpointForeground#f38ba8
- debugIcon.breakpointUnverifiedForeground#f9e2af
- debugIcon.continueForeground#a6e3a1
- debugIcon.pauseForeground#f9e2af
- debugIcon.restartForeground#89b4fa
- debugIcon.startForeground#a6e3a1
- debugIcon.stepIntoForeground#cba6f7
- debugIcon.stepOutForeground#cba6f7
- debugIcon.stepOverForeground#cba6f7
- debugIcon.stopForeground#f38ba8
- debugToolBar.background#181825
- debugToolBar.border#89b4fa60
- descriptionForeground#9399b2
- diffEditor.diagonalFill#45475a60
- diffEditor.insertedLineBackground#a6e3a115
- diffEditor.insertedTextBackground#a6e3a120
- diffEditor.removedLineBackground#f38ba815
- diffEditor.removedTextBackground#f38ba820
- dropdown.background#181825
- dropdown.border#89b4fa60
- dropdown.foreground#cdd6f4
- dropdown.listBackground#1e1e2e
- editor.background#1e1e2e
- editor.findMatchBackground#f9e2af60
- editor.findMatchHighlightBackground#f9e2af30
- editor.findRangeHighlightBackground#89b4fa20
- editor.foreground#cdd6f4
- editor.hoverHighlightBackground#89b4fa20
- editor.inactiveSelectionBackground#585b7030
- editor.inlineValuesBackground#31324480
- editor.inlineValuesForeground#f9e2af
- editor.lineHighlightBackground#313244
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#31324440
- editor.selectionBackground#585b7050
- editor.selectionHighlightBackground#585b7040
- editor.wordHighlightBackground#585b7050
- editor.wordHighlightStrongBackground#585b7070
- editorBracketHighlight.foreground1#89b4fa
- editorBracketHighlight.foreground2#f38ba8
- editorBracketHighlight.foreground3#f9e2af
- editorBracketHighlight.foreground4#cba6f7
- editorBracketHighlight.foreground5#a6e3a1
- editorBracketHighlight.foreground6#fab387
- editorBracketMatch.background#f38ba840
- editorBracketMatch.border#f38ba8
- editorCodeLens.foreground#6c7086
- editorCursor.background#1e1e2e
- editorCursor.foreground#f5e0dc
- editorError.border#f38ba860
- editorError.foreground#f38ba8
- editorGroup.border#313244
- editorGroup.dropBackground#89b4fa20
- editorGroupHeader.noTabsBackground#181825
- editorGroupHeader.tabsBackground#181825
- editorGroupHeader.tabsBorder#313244
- editorGutter.addedBackground#a6e3a1
- editorGutter.background#1e1e2e
- editorGutter.deletedBackground#f38ba8
- editorGutter.modifiedBackground#f9e2af
- editorHint.border#94e2d560
- editorHint.foreground#94e2d5
- editorHoverWidget.background#181825
- editorHoverWidget.border#89b4fa60
- editorHoverWidget.foreground#cdd6f4
- editorIndentGuide.activeBackground#cba6f7
- editorIndentGuide.background#45475a
- editorInfo.border#89b4fa60
- editorInfo.foreground#89b4fa
- editorLineNumber.activeForeground#cba6f7
- editorLineNumber.dimmedForeground#45475a
- editorLineNumber.foreground#6c7086
- editorLink.activeForeground#89b4fa
- editorOverviewRuler.addedForeground#a6e3a1
- editorOverviewRuler.border#313244
- editorOverviewRuler.bracketMatchForeground#f38ba8
- editorOverviewRuler.currentContentForeground#89b4fa
- editorOverviewRuler.deletedForeground#f38ba8
- editorOverviewRuler.errorForeground#f38ba8
- editorOverviewRuler.findMatchForeground#f9e2af80
- editorOverviewRuler.incomingContentForeground#cba6f7
- editorOverviewRuler.infoForeground#89b4fa
- editorOverviewRuler.modifiedForeground#f9e2af
- editorOverviewRuler.rangeHighlightForeground#89b4fa40
- editorOverviewRuler.selectionHighlightForeground#585b7050
- editorOverviewRuler.warningForeground#f9e2af
- editorOverviewRuler.wordHighlightForeground#89b4fa40
- editorOverviewRuler.wordHighlightStrongForeground#89b4fa60
- editorRuler.foreground#45475a
- editorStickyScroll.background#181825
- editorStickyScroll.border#313244
- editorStickyScrollHover.background#313244
- editorSuggestWidget.background#181825
- editorSuggestWidget.border#89b4fa60
- editorSuggestWidget.foreground#cdd6f4
- editorSuggestWidget.highlightForeground#89b4fa
- editorSuggestWidget.selectedBackground#313244
- editorWarning.border#f9e2af60
- editorWarning.foreground#f9e2af
- editorWhitespace.foreground#45475a
- editorWidget.background#181825
- editorWidget.border#89b4fa60
- editorWidget.foreground#cdd6f4
- errorForeground#f38ba8
- extensionBadge.remoteBackground#cba6f7
- extensionBadge.remoteForeground#1e1e2e
- extensionButton.prominentBackground#89b4fa
- extensionButton.prominentForeground#1e1e2e
- extensionButton.prominentHoverBackground#a6c9f7
- focusBorder#89b4fa
- foreground#cdd6f4
- gitDecoration.addedResourceForeground#a6e3a1
- gitDecoration.conflictingResourceForeground#fab387
- gitDecoration.deletedResourceForeground#f38ba8
- gitDecoration.ignoredResourceForeground#6c7086
- gitDecoration.modifiedResourceForeground#f9e2af
- gitDecoration.submoduleResourceForeground#cba6f7
- gitDecoration.untrackedResourceForeground#94e2d5
- icon.foreground#89b4fa
- inlineChat.background#181825
- inlineChat.border#89b4fa60
- inlineChatInput.background#1e1e2e
- input.background#1e1e2e
- input.border#45475a
- input.foreground#cdd6f4
- input.placeholderForeground#6c7086
- inputOption.activeBackground#89b4fa20
- inputOption.activeBorder#89b4fa
- inputOption.activeForeground#89b4fa
- inputValidation.errorBackground#f38ba820
- inputValidation.errorBorder#f38ba8
- inputValidation.infoBackground#89b4fa20
- inputValidation.infoBorder#89b4fa
- inputValidation.warningBackground#f9e2af20
- inputValidation.warningBorder#f9e2af
- keybindingLabel.background#313244
- keybindingLabel.border#89b4fa60
- keybindingLabel.bottomBorder#89b4fa
- keybindingLabel.foreground#89b4fa
- list.activeSelectionBackground#313244
- list.activeSelectionForeground#89b4fa
- list.dropBackground#89b4fa20
- list.errorForeground#f38ba8
- list.filterMatchBackground#f9e2af40
- list.filterMatchBorder#f9e2af
- list.focusBackground#313244
- list.focusForeground#89b4fa
- list.highlightForeground#f38ba8
- list.hoverBackground#31324480
- list.hoverForeground#cdd6f4
- list.inactiveSelectionBackground#313244
- list.inactiveSelectionForeground#bac2de
- list.warningForeground#f9e2af
- listFilterWidget.background#181825
- listFilterWidget.noMatchesOutline#f38ba8
- listFilterWidget.outline#89b4fa
- menu.background#181825
- menu.border#89b4fa60
- menu.foreground#cdd6f4
- menu.selectionBackground#313244
- menu.selectionForeground#89b4fa
- menu.separatorBackground#45475a
- menubar.selectionBackground#313244
- menubar.selectionBorder#89b4fa
- menubar.selectionForeground#89b4fa
- merge.border#f38ba8
- merge.currentContentBackground#89b4fa20
- merge.currentHeaderBackground#89b4fa40
- merge.incomingContentBackground#cba6f720
- merge.incomingHeaderBackground#cba6f740
- mergeEditor.change.background#89b4fa20
- mergeEditor.change.word.background#89b4fa35
- mergeEditor.conflict.handled.minimapOverViewRuler#a6e3a1
- mergeEditor.conflict.unhandled.minimapOverViewRuler#f38ba8
- minimap.background#1e1e2e
- minimap.errorHighlight#f38ba8
- minimap.findMatchHighlight#f9e2af60
- minimap.selectionHighlight#585b7050
- minimap.warningHighlight#f9e2af
- minimapGutter.addedBackground#a6e3a1
- minimapGutter.deletedBackground#f38ba8
- minimapGutter.modifiedBackground#f9e2af
- minimapSlider.activeBackground#89b4fa40
- minimapSlider.background#45475a40
- minimapSlider.hoverBackground#585b7060
- notebook.cellBorderColor#313244
- notebook.focusedCellBorder#89b4fa
- notebook.focusedEditorBorder#89b4fa60
- notebook.inactiveFocusedCellBorder#45475a
- notebookStatusErrorIcon.foreground#f38ba8
- notebookStatusSuccessIcon.foreground#a6e3a1
- notificationCenter.border#89b4fa60
- notificationCenterHeader.background#1e1e2e
- notificationCenterHeader.foreground#89b4fa
- notificationLink.foreground#89b4fa
- notifications.background#181825
- notifications.border#89b4fa60
- notifications.foreground#cdd6f4
- notificationsErrorIcon.foreground#f38ba8
- notificationsInfoIcon.foreground#89b4fa
- notificationsWarningIcon.foreground#f9e2af
- notificationToast.border#89b4fa60
- panel.background#181825
- panel.border#313244
- panelInput.border#313244
- panelSection.border#313244
- panelSection.dropBackground#89b4fa20
- panelSectionHeader.background#1e1e2e
- panelSectionHeader.border#313244
- panelSectionHeader.foreground#89b4fa
- panelTitle.activeBorder#89b4fa
- panelTitle.activeForeground#89b4fa
- panelTitle.inactiveForeground#6c7086
- peekView.border#89b4fa
- peekViewEditor.background#1e1e2e
- peekViewEditor.matchHighlightBackground#f9e2af60
- peekViewResult.background#181825
- peekViewResult.fileForeground#cdd6f4
- peekViewResult.lineForeground#bac2de
- peekViewResult.matchHighlightBackground#f9e2af60
- peekViewResult.selectionBackground#313244
- peekViewResult.selectionForeground#89b4fa
- peekViewTitle.background#181825
- peekViewTitleDescription.foreground#9399b2
- peekViewTitleLabel.foreground#89b4fa
- pickerGroup.border#313244
- pickerGroup.foreground#89b4fa
- problemsErrorIcon.foreground#f38ba8
- problemsInfoIcon.foreground#89b4fa
- problemsWarningIcon.foreground#f9e2af
- progressBar.background#89b4fa
- quickInput.background#181825
- quickInput.foreground#cdd6f4
- quickInputList.focusBackground#313244
- quickInputList.focusForeground#89b4fa
- quickInputList.focusIconForeground#89b4fa
- sash.hoverBorder#89b4fa
- scrollbar.shadow#00000080
- scrollbarSlider.activeBackground#89b4fa60
- scrollbarSlider.background#45475a60
- scrollbarSlider.hoverBackground#585b7080
- selection.background#585b7050
- settings.checkboxBackground#1e1e2e
- settings.checkboxBorder#45475a
- settings.checkboxForeground#89b4fa
- settings.dropdownBackground#181825
- settings.dropdownBorder#89b4fa60
- settings.dropdownForeground#cdd6f4
- settings.headerForeground#89b4fa
- settings.modifiedItemIndicator#89b4fa
- settings.numberInputBackground#1e1e2e
- settings.numberInputBorder#45475a
- settings.numberInputForeground#cdd6f4
- settings.textInputBackground#1e1e2e
- settings.textInputBorder#45475a
- settings.textInputForeground#cdd6f4
- sideBar.background#181825
- sideBar.border#313244
- sideBar.foreground#bac2de
- sideBarSectionHeader.background#1e1e2e
- sideBarSectionHeader.border#313244
- sideBarSectionHeader.foreground#89b4fa
- sideBarTitle.foreground#89b4fa
- statusBar.background#181825
- statusBar.border#313244
- statusBar.debuggingBackground#f38ba8
- statusBar.debuggingForeground#1e1e2e
- statusBar.foreground#cdd6f4
- statusBar.noFolderBackground#181825
- statusBar.noFolderForeground#9399b2
- statusBarItem.activeBackground#313244
- statusBarItem.errorBackground#f38ba8
- statusBarItem.errorForeground#1e1e2e
- statusBarItem.hoverBackground#31324480
- statusBarItem.prominentBackground#f38ba8
- statusBarItem.prominentForeground#1e1e2e
- statusBarItem.prominentHoverBackground#f5c2e7
- statusBarItem.remoteBackground#cba6f7
- statusBarItem.remoteForeground#1e1e2e
- statusBarItem.warningBackground#f9e2af
- statusBarItem.warningForeground#1e1e2e
- symbolIcon.arrayForeground#f9e2af
- symbolIcon.booleanForeground#fab387
- symbolIcon.classForeground#cba6f7
- symbolIcon.colorForeground#f5c2e7
- symbolIcon.constantForeground#fab387
- symbolIcon.constructorForeground#89b4fa
- symbolIcon.enumeratorForeground#cba6f7
- symbolIcon.enumeratorMemberForeground#a6e3a1
- symbolIcon.eventForeground#f38ba8
- symbolIcon.fieldForeground#cdd6f4
- symbolIcon.fileForeground#bac2de
- symbolIcon.folderForeground#9399b2
- symbolIcon.functionForeground#89b4fa
- symbolIcon.interfaceForeground#cba6f7
- symbolIcon.keyForeground#f38ba8
- symbolIcon.keywordForeground#f38ba8
- symbolIcon.methodForeground#89b4fa
- symbolIcon.moduleForeground#cba6f7
- symbolIcon.namespaceForeground#cba6f7
- symbolIcon.nullForeground#fab387
- symbolIcon.numberForeground#f9e2af
- symbolIcon.objectForeground#cdd6f4
- symbolIcon.operatorForeground#89dceb
- symbolIcon.packageForeground#cba6f7
- symbolIcon.propertyForeground#cdd6f4
- symbolIcon.referenceForeground#f5c2e7
- symbolIcon.snippetForeground#a6e3a1
- symbolIcon.stringForeground#a6e3a1
- symbolIcon.structForeground#cba6f7
- symbolIcon.textForeground#cdd6f4
- symbolIcon.typeParameterForeground#cba6f7
- symbolIcon.unitForeground#f9e2af
- symbolIcon.variableForeground#cdd6f4
- tab.activeBackground#1e1e2e
- tab.activeBorder#00000000
- tab.activeBorderTop#89b4fa
- tab.activeForeground#89b4fa
- tab.border#313244
- tab.hoverBackground#313244
- tab.hoverBorder#89b4fa60
- tab.hoverForeground#89b4fa
- tab.inactiveBackground#181825
- tab.inactiveForeground#6c7086
- tab.lastPinnedBorder#f38ba8
- tab.unfocusedActiveBorderTop#6c7086
- tab.unfocusedActiveForeground#9399b2
- tab.unfocusedInactiveForeground#585b70
- terminal.ansiBlack#45475a
- terminal.ansiBlue#89b4fa
- terminal.ansiBrightBlack#585b70
- terminal.ansiBrightBlue#a6c9f7
- terminal.ansiBrightCyan#b5e8e0
- terminal.ansiBrightGreen#b9e5b3
- terminal.ansiBrightMagenta#d9c0f5
- terminal.ansiBrightRed#f5c2e7
- terminal.ansiBrightWhite#cdd6f4
- terminal.ansiBrightYellow#fbedc1
- terminal.ansiCyan#94e2d5
- terminal.ansiGreen#a6e3a1
- terminal.ansiMagenta#cba6f7
- terminal.ansiRed#f38ba8
- terminal.ansiWhite#bac2de
- terminal.ansiYellow#f9e2af
- terminal.background#181825
- terminal.border#313244
- terminal.foreground#cdd6f4
- terminal.selectionBackground#585b7050
- terminalCursor.background#1e1e2e
- terminalCursor.foreground#f5e0dc
- testing.iconErrored#f38ba8
- testing.iconFailed#f38ba8
- testing.iconPassed#a6e3a1
- testing.iconQueued#f9e2af
- testing.iconSkipped#9399b2
- textBlockQuote.background#181825
- textBlockQuote.border#89b4fa
- textCodeBlock.background#1e1e2e
- textLink.activeForeground#a6c9f7
- textLink.foreground#89b4fa
- textPreformat.foreground#a6e3a1
- textSeparator.foreground#45475a
- titleBar.activeBackground#181825
- titleBar.activeForeground#cdd6f4
- titleBar.border#313244
- titleBar.inactiveBackground#181825
- titleBar.inactiveForeground#6c7086
- tree.indentGuidesStroke#45475a
- walkThrough.embeddedEditorBackground#1e1e2e
- welcomePage.buttonBackground#313244
- welcomePage.buttonHoverBackground#45475a
- widget.shadow#00000080
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #72798e | italic |
| string | #9fc4a5 | — |
| keyword, storage.type, storage.modifier | #d29aa6 | — |
| entity.name.function, support.function | #9bb0e8 | — |
| comment, punctuation.definition.comment | #72798e | italic |
| string | #9fc4a5 | — |
| keyword, storage.type, storage.modifier | #d29aa6 | — |
| entity.name.function, support.function | #9bb0e8 | — |
| comment, punctuation.definition.comment | #6c7086 | italic |
| string | #a6e3a1 | — |
| constant.numeric | #f9e2af | — |
| constant.language.boolean | #fab387 | — |
| constant.language.null, constant.language.undefined | #fab387 | — |
| keyword | #f38ba8 | — |
| storage.type, storage.modifier | #f38ba8 | — |
| entity.name.function, support.function | #89b4fa | — |
| entity.name.class, entity.name.type, support.class | #cba6f7 | — |
| variable | #cdd6f4 | — |
| variable.other.property | #89dceb | — |
| constant | #fab387 | — |
| keyword.operator | #89dceb | — |
| entity.name.tag | #f38ba8 | — |
| entity.other.attribute-name | #cba6f7 | — |
| markup.heading, entity.name.section.markdown | #89b4fa | bold |
| markup.quote, meta.frontmatter, punctuation.section.frontmatter | #94e2d5 | — |
| markup.inline.raw, markup.fenced_code.block.markdown | #a6e3a1 | — |
| entity.name.tag, entity.name.tag.jsx, entity.name.tag.tsx | #f38ba8 | — |
| entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, support.type.property-name.json, meta.object-literal.key | #89dceb | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.scss, entity.other.attribute-name.id.css, entity.other.attribute-name.id.scss | #f9e2af | — |
| meta.function.decorator.python, entity.name.function.decorator.python, storage.type.annotation.python | #f5c2e7 | — |
| string.regexp, constant.character.escape | #fab387 | — |