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#1a1a1a
- activityBar.activeBorder#00ffff
- activityBar.activeFocusBorder#00ffff
- activityBar.background#000000
- activityBar.border#333333
- activityBar.dropBorder#00ffff
- activityBar.foreground#00ffff
- activityBar.inactiveForeground#808080
- activityBarBadge.background#ff0000
- activityBarBadge.foreground#ffffff
- badge.background#ff0000
- badge.foreground#ffffff
- breadcrumb.activeSelectionForeground#00ffff
- breadcrumb.background#000000
- breadcrumb.focusForeground#00ffff
- breadcrumb.foreground#999999
- breadcrumbPicker.background#1a1a1a
- button.background#00ffff
- button.foreground#000000
- button.hoverBackground#66ffff
- button.secondaryBackground#404040
- button.secondaryForeground#ffffff
- button.secondaryHoverBackground#666666
- charts.blue#0088ff
- charts.foreground#ffffff
- charts.green#00ff00
- charts.lines#00ffff
- charts.orange#ff8800
- charts.purple#ff00ff
- charts.red#ff0000
- charts.yellow#ffff00
- checkbox.background#1a1a1a
- checkbox.border#404040
- checkbox.foreground#00ffff
- debugConsole.errorForeground#ff0000
- debugConsole.infoForeground#00ffff
- debugConsole.sourceForeground#ff00ff
- debugConsole.warningForeground#ffff00
- debugConsoleInputIcon.foreground#00ffff
- debugIcon.breakpointDisabledForeground#808080
- debugIcon.breakpointForeground#ff0000
- debugIcon.breakpointUnverifiedForeground#ffff00
- debugIcon.continueForeground#00ff00
- debugIcon.pauseForeground#ffff00
- debugIcon.restartForeground#00ffff
- debugIcon.startForeground#00ff00
- debugIcon.stepIntoForeground#ff00ff
- debugIcon.stepOutForeground#ff00ff
- debugIcon.stepOverForeground#ff00ff
- debugIcon.stopForeground#ff0000
- debugToolBar.background#1a1a1a
- debugToolBar.border#00ffff
- descriptionForeground#999999
- diffEditor.diagonalFill#40404080
- diffEditor.insertedLineBackground#00ff0020
- diffEditor.insertedTextBackground#00ff0030
- diffEditor.removedLineBackground#ff000020
- diffEditor.removedTextBackground#ff000030
- dropdown.background#1a1a1a
- dropdown.border#00ffff
- dropdown.foreground#ffffff
- dropdown.listBackground#000000
- editor.background#000000
- editor.findMatchBackground#ffff0080
- editor.findMatchHighlightBackground#ffff0040
- editor.findRangeHighlightBackground#00ffff30
- editor.foreground#ffffff
- editor.hoverHighlightBackground#00ffff30
- editor.inactiveSelectionBackground#ffffff20
- editor.inlineValuesBackground#333333
- editor.inlineValuesForeground#ffff00
- editor.lineHighlightBackground#1a1a1a
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#1a1a1a40
- editor.selectionBackground#ffffff40
- editor.selectionHighlightBackground#ffffff30
- editor.wordHighlightBackground#ffffff40
- editor.wordHighlightStrongBackground#ffffff60
- editorBracketHighlight.foreground1#00ffff
- editorBracketHighlight.foreground2#ff00ff
- editorBracketHighlight.foreground3#ffff00
- editorBracketHighlight.foreground4#00ff00
- editorBracketHighlight.foreground5#ff8800
- editorBracketHighlight.foreground6#0088ff
- editorBracketMatch.background#ff00ff40
- editorBracketMatch.border#ff00ff
- editorCodeLens.foreground#808080
- editorCursor.background#000000
- editorCursor.foreground#00ff00
- editorError.border#ff0000
- editorError.foreground#ff0000
- editorGroup.border#333333
- editorGroup.dropBackground#00ffff30
- editorGroupHeader.noTabsBackground#000000
- editorGroupHeader.tabsBackground#000000
- editorGroupHeader.tabsBorder#333333
- editorGutter.addedBackground#00ff00
- editorGutter.background#000000
- editorGutter.deletedBackground#ff0000
- editorGutter.modifiedBackground#ffff00
- editorHint.border#00ff00
- editorHint.foreground#00ff00
- editorHoverWidget.background#1a1a1a
- editorHoverWidget.border#00ffff
- editorHoverWidget.foreground#ffffff
- editorIndentGuide.activeBackground#00ff00
- editorIndentGuide.background#404040
- editorInfo.border#00ffff
- editorInfo.foreground#00ffff
- editorLineNumber.activeForeground#00ff00
- editorLineNumber.dimmedForeground#404040
- editorLineNumber.foreground#808080
- editorLink.activeForeground#00ffff
- editorOverviewRuler.addedForeground#00ff00
- editorOverviewRuler.border#333333
- editorOverviewRuler.bracketMatchForeground#ff00ff
- editorOverviewRuler.currentContentForeground#00ffff
- editorOverviewRuler.deletedForeground#ff0000
- editorOverviewRuler.errorForeground#ff0000
- editorOverviewRuler.findMatchForeground#ffff00
- editorOverviewRuler.incomingContentForeground#ff00ff
- editorOverviewRuler.infoForeground#00ffff
- editorOverviewRuler.modifiedForeground#ffff00
- editorOverviewRuler.rangeHighlightForeground#00ffff60
- editorOverviewRuler.selectionHighlightForeground#ffffff40
- editorOverviewRuler.warningForeground#ffff00
- editorOverviewRuler.wordHighlightForeground#00ffff60
- editorOverviewRuler.wordHighlightStrongForeground#00ffff80
- editorRuler.foreground#404040
- editorStickyScroll.background#000000
- editorStickyScroll.border#333333
- editorStickyScrollHover.background#1a1a1a
- editorSuggestWidget.background#1a1a1a
- editorSuggestWidget.border#00ffff
- editorSuggestWidget.foreground#ffffff
- editorSuggestWidget.highlightForeground#00ffff
- editorSuggestWidget.selectedBackground#333333
- editorWarning.border#ffff00
- editorWarning.foreground#ffff00
- editorWhitespace.foreground#404040
- editorWidget.background#1a1a1a
- editorWidget.border#00ffff
- editorWidget.foreground#ffffff
- errorForeground#ff0000
- extensionBadge.remoteBackground#ff00ff
- extensionBadge.remoteForeground#ffffff
- extensionButton.prominentBackground#00ffff
- extensionButton.prominentForeground#000000
- extensionButton.prominentHoverBackground#66ffff
- focusBorder#00ffff
- foreground#ffffff
- gitDecoration.addedResourceForeground#00ff00
- gitDecoration.conflictingResourceForeground#ff8800
- gitDecoration.deletedResourceForeground#ff0000
- gitDecoration.ignoredResourceForeground#808080
- gitDecoration.modifiedResourceForeground#ffff00
- gitDecoration.submoduleResourceForeground#ff00ff
- gitDecoration.untrackedResourceForeground#00ffff
- icon.foreground#00ffff
- inlineChat.background#1a1a1a
- inlineChat.border#00ffff
- inlineChatInput.background#000000
- input.background#1a1a1a
- input.border#404040
- input.foreground#ffffff
- input.placeholderForeground#808080
- inputOption.activeBackground#00ffff30
- inputOption.activeBorder#00ffff
- inputOption.activeForeground#00ffff
- inputValidation.errorBackground#ff000030
- inputValidation.errorBorder#ff0000
- inputValidation.infoBackground#00ffff30
- inputValidation.infoBorder#00ffff
- inputValidation.warningBackground#ffff0030
- inputValidation.warningBorder#ffff00
- keybindingLabel.background#333333
- keybindingLabel.border#00ffff
- keybindingLabel.bottomBorder#00ffff
- keybindingLabel.foreground#00ffff
- list.activeSelectionBackground#333333
- list.activeSelectionForeground#00ffff
- list.dropBackground#00ffff30
- list.errorForeground#ff0000
- list.filterMatchBackground#ffff0060
- list.filterMatchBorder#ffff00
- list.focusBackground#333333
- list.focusForeground#00ffff
- list.highlightForeground#ff0000
- list.hoverBackground#333333
- list.hoverForeground#ffffff
- list.inactiveSelectionBackground#333333
- list.inactiveSelectionForeground#cccccc
- list.warningForeground#ffff00
- listFilterWidget.background#1a1a1a
- listFilterWidget.noMatchesOutline#ff0000
- listFilterWidget.outline#00ffff
- menu.background#1a1a1a
- menu.border#00ffff
- menu.foreground#ffffff
- menu.selectionBackground#333333
- menu.selectionForeground#00ffff
- menu.separatorBackground#404040
- menubar.selectionBackground#333333
- menubar.selectionBorder#00ffff
- menubar.selectionForeground#00ffff
- merge.border#ff0000
- merge.currentContentBackground#00ffff30
- merge.currentHeaderBackground#00ffff60
- merge.incomingContentBackground#ff00ff30
- merge.incomingHeaderBackground#ff00ff60
- mergeEditor.change.background#00ffff30
- mergeEditor.change.word.background#00ffff50
- mergeEditor.conflict.handled.minimapOverViewRuler#00ff00
- mergeEditor.conflict.unhandled.minimapOverViewRuler#ff0000
- minimap.background#000000
- minimap.errorHighlight#ff0000
- minimap.findMatchHighlight#ffff0080
- minimap.selectionHighlight#ffffff40
- minimap.warningHighlight#ffff00
- minimapGutter.addedBackground#00ff00
- minimapGutter.deletedBackground#ff0000
- minimapGutter.modifiedBackground#ffff00
- minimapSlider.activeBackground#00ffff60
- minimapSlider.background#40404060
- minimapSlider.hoverBackground#66666680
- notebook.cellBorderColor#333333
- notebook.focusedCellBorder#00ffff
- notebook.focusedEditorBorder#00ffff
- notebook.inactiveFocusedCellBorder#808080
- notebookStatusErrorIcon.foreground#ff0000
- notebookStatusSuccessIcon.foreground#00ff00
- notificationCenter.border#00ffff
- notificationCenterHeader.background#1a1a1a
- notificationCenterHeader.foreground#00ffff
- notificationLink.foreground#00ffff
- notifications.background#1a1a1a
- notifications.border#00ffff
- notifications.foreground#ffffff
- notificationsErrorIcon.foreground#ff0000
- notificationsInfoIcon.foreground#00ffff
- notificationsWarningIcon.foreground#ffff00
- notificationToast.border#00ffff
- panel.background#000000
- panel.border#333333
- panelInput.border#333333
- panelSection.border#333333
- panelSection.dropBackground#00ffff30
- panelSectionHeader.background#1a1a1a
- panelSectionHeader.border#333333
- panelSectionHeader.foreground#00ffff
- panelTitle.activeBorder#00ffff
- panelTitle.activeForeground#00ffff
- panelTitle.inactiveForeground#808080
- peekView.border#00ffff
- peekViewEditor.background#000000
- peekViewEditor.matchHighlightBackground#ffff0080
- peekViewResult.background#1a1a1a
- peekViewResult.fileForeground#ffffff
- peekViewResult.lineForeground#cccccc
- peekViewResult.matchHighlightBackground#ffff0080
- peekViewResult.selectionBackground#333333
- peekViewResult.selectionForeground#00ffff
- peekViewTitle.background#1a1a1a
- peekViewTitleDescription.foreground#999999
- peekViewTitleLabel.foreground#00ffff
- pickerGroup.border#333333
- pickerGroup.foreground#00ffff
- problemsErrorIcon.foreground#ff0000
- problemsInfoIcon.foreground#00ffff
- problemsWarningIcon.foreground#ffff00
- progressBar.background#00ffff
- quickInput.background#1a1a1a
- quickInput.foreground#ffffff
- quickInputList.focusBackground#333333
- quickInputList.focusForeground#00ffff
- quickInputList.focusIconForeground#00ffff
- sash.hoverBorder#00ffff
- scrollbar.shadow#000000
- scrollbarSlider.activeBackground#00ffff80
- scrollbarSlider.background#40404080
- scrollbarSlider.hoverBackground#666666a0
- selection.background#ffffff40
- settings.checkboxBackground#1a1a1a
- settings.checkboxBorder#404040
- settings.checkboxForeground#00ffff
- settings.dropdownBackground#1a1a1a
- settings.dropdownBorder#00ffff
- settings.dropdownForeground#ffffff
- settings.headerForeground#00ffff
- settings.modifiedItemIndicator#00ffff
- settings.numberInputBackground#1a1a1a
- settings.numberInputBorder#404040
- settings.numberInputForeground#ffffff
- settings.textInputBackground#1a1a1a
- settings.textInputBorder#404040
- settings.textInputForeground#ffffff
- sideBar.background#000000
- sideBar.border#333333
- sideBar.foreground#cccccc
- sideBarSectionHeader.background#1a1a1a
- sideBarSectionHeader.border#333333
- sideBarSectionHeader.foreground#00ffff
- sideBarTitle.foreground#00ffff
- statusBar.background#000000
- statusBar.border#333333
- statusBar.debuggingBackground#ff0000
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#ffffff
- statusBar.noFolderBackground#000000
- statusBar.noFolderForeground#999999
- statusBarItem.activeBackground#333333
- statusBarItem.errorBackground#ff0000
- statusBarItem.errorForeground#ffffff
- statusBarItem.hoverBackground#333333
- statusBarItem.prominentBackground#ff0000
- statusBarItem.prominentForeground#ffffff
- statusBarItem.prominentHoverBackground#ff3333
- statusBarItem.remoteBackground#ff00ff
- statusBarItem.remoteForeground#ffffff
- statusBarItem.warningBackground#ffff00
- statusBarItem.warningForeground#000000
- symbolIcon.arrayForeground#ffff00
- symbolIcon.booleanForeground#ff8800
- symbolIcon.classForeground#ff00ff
- symbolIcon.colorForeground#ff66ff
- symbolIcon.constantForeground#ff8800
- symbolIcon.constructorForeground#00ffff
- symbolIcon.enumeratorForeground#ff00ff
- symbolIcon.enumeratorMemberForeground#00ff00
- symbolIcon.eventForeground#ff0000
- symbolIcon.fieldForeground#ffffff
- symbolIcon.fileForeground#cccccc
- symbolIcon.folderForeground#999999
- symbolIcon.functionForeground#00ffff
- symbolIcon.interfaceForeground#ff00ff
- symbolIcon.keyForeground#ff0000
- symbolIcon.keywordForeground#ff0000
- symbolIcon.methodForeground#00ffff
- symbolIcon.moduleForeground#ff00ff
- symbolIcon.namespaceForeground#ff00ff
- symbolIcon.nullForeground#ff8800
- symbolIcon.numberForeground#ffff00
- symbolIcon.objectForeground#ffffff
- symbolIcon.operatorForeground#00ffff
- symbolIcon.packageForeground#ff00ff
- symbolIcon.propertyForeground#ffffff
- symbolIcon.referenceForeground#ff66ff
- symbolIcon.snippetForeground#00ff00
- symbolIcon.stringForeground#00ff00
- symbolIcon.structForeground#ff00ff
- symbolIcon.textForeground#ffffff
- symbolIcon.typeParameterForeground#ff00ff
- symbolIcon.unitForeground#ffff00
- symbolIcon.variableForeground#ffffff
- tab.activeBackground#000000
- tab.activeBorder#00000000
- tab.activeBorderTop#00ffff
- tab.activeForeground#00ffff
- tab.border#333333
- tab.hoverBackground#333333
- tab.hoverBorder#00ffff
- tab.hoverForeground#00ffff
- tab.inactiveBackground#1a1a1a
- tab.inactiveForeground#808080
- tab.lastPinnedBorder#ff0000
- tab.unfocusedActiveBorderTop#808080
- tab.unfocusedActiveForeground#999999
- tab.unfocusedInactiveForeground#666666
- terminal.ansiBlack#000000
- terminal.ansiBlue#0088ff
- terminal.ansiBrightBlack#808080
- terminal.ansiBrightBlue#66aaff
- terminal.ansiBrightCyan#66ffff
- terminal.ansiBrightGreen#66ff66
- terminal.ansiBrightMagenta#ff66ff
- terminal.ansiBrightRed#ff6666
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#ffff66
- terminal.ansiCyan#00ffff
- terminal.ansiGreen#00ff00
- terminal.ansiMagenta#ff00ff
- terminal.ansiRed#ff0000
- terminal.ansiWhite#ffffff
- terminal.ansiYellow#ffff00
- terminal.background#000000
- terminal.border#333333
- terminal.foreground#ffffff
- terminal.selectionBackground#ffffff40
- terminalCursor.background#000000
- terminalCursor.foreground#00ff00
- testing.iconErrored#ff0000
- testing.iconFailed#ff0000
- testing.iconPassed#00ff00
- testing.iconQueued#ffff00
- testing.iconSkipped#808080
- textBlockQuote.background#1a1a1a
- textBlockQuote.border#00ffff
- textCodeBlock.background#1a1a1a
- textLink.activeForeground#66ffff
- textLink.foreground#00ffff
- textPreformat.foreground#00ff00
- textSeparator.foreground#404040
- titleBar.activeBackground#000000
- titleBar.activeForeground#ffffff
- titleBar.border#333333
- titleBar.inactiveBackground#000000
- titleBar.inactiveForeground#808080
- tree.indentGuidesStroke#404040
- walkThrough.embeddedEditorBackground#000000
- welcomePage.buttonBackground#333333
- welcomePage.buttonHoverBackground#404040
- widget.shadow#000000
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #808080 | italic |
| string | #00ff00 | — |
| constant.numeric | #ffff00 | — |
| constant.language.boolean | #ff8800 | — |
| constant.language.null, constant.language.undefined | #ff8800 | — |
| keyword | #ff0000 | — |
| storage.type, storage.modifier | #ff0000 | — |
| entity.name.function, support.function | #00ffff | — |
| entity.name.class, entity.name.type, support.class | #ff00ff | — |
| variable | #ffffff | — |
| variable.other.property | #00ffff | — |
| constant | #ff8800 | — |
| keyword.operator | #00ffff | — |
| entity.name.tag | #ff0000 | — |
| entity.other.attribute-name | #ff00ff | — |
| markup.heading, entity.name.section.markdown | #00ffff | bold |
| markup.quote, meta.frontmatter, punctuation.section.frontmatter | #00ff00 | — |
| markup.inline.raw, markup.fenced_code.block.markdown | #ffff00 | — |
| entity.name.tag, entity.name.tag.jsx, entity.name.tag.tsx | #ff0000 | — |
| entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, support.type.property-name.json, meta.object-literal.key | #00ffff | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.scss, entity.other.attribute-name.id.css, entity.other.attribute-name.id.scss | #ffff00 | — |
| meta.function.decorator.python, entity.name.function.decorator.python, storage.type.annotation.python | #ff00ff | — |
| string.regexp, constant.character.escape | #ff8800 | — |