Circadia Color Theme

Color themes

• 

  Circadia — Obsidian Pine (Dark Focus)

• 

  Circadia — Plum Noir (Dark Modern)

• 

  Circadia — Warm Ember & Espresso (Dark Classic)

• 

  Circadia — Warm Parchment (Light)

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.activeBorder#cf8aa4
• activityBar.activeFocusBorder#cf8aa4
• activityBar.background#1b1419
• activityBar.border#3d3039
• activityBar.foreground#d8c8d2
• activityBar.inactiveForeground#9a8b96
• activityBarBadge.background#cf8aa4
• activityBarBadge.foreground#140e12
• badge.background#261e23
• badge.foreground#d8c8d2
• breadcrumb.activeSelectionForeground#cf8aa4
• breadcrumb.background#140e12
• breadcrumb.focusForeground#d8c8d2
• breadcrumb.foreground#b4a3af
• breadcrumbPicker.background#1b1419
• button.background#cf8aa4
• button.foreground#140e12
• button.hoverBackground#cf8aa4dd
• button.secondaryBackground#261e23
• button.secondaryForeground#d8c8d2
• button.secondaryHoverBackground#1b1419
• chat.editedFileForeground#d49969
• chat.slashCommandBackground#cf8aa433
• chat.slashCommandForeground#cf8aa4
• checkbox.background#261e23
• checkbox.border#3d3039
• checkbox.foreground#d8c8d2
• descriptionForeground#b4a3af
• dropdown.background#261e23
• dropdown.border#3d3039
• dropdown.foreground#d8c8d2
• dropdown.listBackground#1b1419
• editor.background#140e12
• editor.findMatchBackground#cf8aa466
• editor.findMatchHighlightBackground#cf8aa433
• editor.foreground#d8c8d2
• editor.lineHighlightBackground#261e2333
• editor.lineHighlightBorder#00000000
• editor.selectionBackground#cf8aa440
• editor.selectionHighlightBackground#cf8aa426
• editor.wordHighlightBackground#cf8aa430
• editor.wordHighlightStrongBackground#cf8aa444
• editorBracketMatch.background#00000000
• editorBracketMatch.border#cf8aa4
• editorCursor.foreground#cf8aa4
• editorGroup.border#3d3039
• editorGroupHeader.noTabsBackground#140e12
• editorGroupHeader.tabsBackground#1b1419
• editorGroupHeader.tabsBorder#3d3039
• editorGutter.addedBackground#96b77b
• editorGutter.deletedBackground#e06c75
• editorGutter.modifiedBackground#d49969
• editorIndentGuide.activeBackground#9a8b96
• editorIndentGuide.background#3d3039
• editorLineNumber.activeForeground#cf8aa4
• editorLineNumber.foreground#9a8b96
• editorOverviewRuler.border#3d3039
• editorSuggestWidget.background#1b1419
• editorSuggestWidget.border#3d3039
• editorSuggestWidget.foreground#d8c8d2
• editorSuggestWidget.highlightForeground#cf8aa4
• editorSuggestWidget.selectedBackground#cf8aa438
• editorWidget.background#1b1419
• editorWidget.border#3d3039
• errorForeground#e06c75
• focusBorder#cf8aa4
• foreground#d8c8d2
• gitDecoration.conflictingResourceForeground#e06c75
• gitDecoration.deletedResourceForeground#e06c75
• gitDecoration.ignoredResourceForeground#9a8b96
• gitDecoration.modifiedResourceForeground#d49969
• gitDecoration.stageDeletedResourceForeground#e06c75
• gitDecoration.stageModifiedResourceForeground#d49969
• gitDecoration.untrackedResourceForeground#96b77b
• icon.foreground#b4a3af
• input.background#261e23
• input.border#3d3039
• input.foreground#d8c8d2
• input.placeholderForeground#9a8b96
• input.selectionBackground#cf8aa448
• inputOption.activeBackground#cf8aa444
• inputOption.activeBorder#cf8aa4
• inputOption.activeForeground#d8c8d2
• keybindingLabel.foreground#d8c8d2
• list.activeSelectionBackground#cf8aa438
• list.activeSelectionForeground#ffffff
• list.activeSelectionIconForeground#cf8aa4
• list.deemphasizedForeground#9a8b96
• list.dropBackground#cf8aa433
• list.focusBackground#cf8aa438
• list.focusForeground#ffffff
• list.focusHighlightForeground#cf8aa4
• list.focusOutline#cf8aa4
• list.highlightForeground#cf8aa4
• list.hoverBackground#3d3039aa
• list.hoverForeground#ffffff
• list.inactiveFocusBackground#3d3039
• list.inactiveSelectionBackground#3d3039
• list.inactiveSelectionForeground#ffffff
• menu.background#1b1419
• menu.foreground#d8c8d2
• menu.selectionBackground#cf8aa438
• menu.selectionForeground#ffffff
• menu.separatorBackground#3d3039
• modernActivityBar.activeBackground#261e2399
• modernActivityBar.hoverBackground#261e2344
• notificationCenterHeader.background#1b1419
• notificationCenterHeader.foreground#d8c8d2
• notifications.background#1b1419
• notifications.border#3d3039
• notifications.foreground#d8c8d2
• panel.background#1b1419
• panel.border#3d3039
• panelInput.border#3d3039
• panelSectionHeader.background#1b1419
• panelSectionHeader.border#3d3039
• panelSectionHeader.foreground#d8c8d2
• panelTitle.activeBorder#cf8aa4
• panelTitle.activeForeground#d8c8d2
• panelTitle.inactiveForeground#b4a3af
• peekView.border#cf8aa4
• peekViewEditor.background#140e12
• peekViewEditor.matchHighlightBackground#cf8aa444
• peekViewResult.background#1b1419
• peekViewResult.matchHighlightBackground#cf8aa444
• peekViewResult.selectionBackground#cf8aa438
• peekViewTitle.background#1b1419
• pickerGroup.border#3d3039
• pickerGroup.foreground#cf8aa4
• progressBar.background#cf8aa4
• quickInput.background#1b1419
• quickInput.foreground#d8c8d2
• quickInputList.focusBackground#cf8aa438
• quickInputList.focusForeground#ffffff
• scrollbarSlider.activeBackground#cf8aa466
• scrollbarSlider.background#9a8b9633
• scrollbarSlider.hoverBackground#9a8b9655
• selection.background#cf8aa448
• settings.dropdownBackground#261e23
• settings.dropdownBorder#3d3039
• settings.headerForeground#d8c8d2
• settings.modifiedItemIndicator#cf8aa4
• sideBar.background#1b1419
• sideBar.border#3d3039
• sideBar.foreground#b4a3af
• sideBarSectionHeader.background#1b1419
• sideBarSectionHeader.border#3d3039
• sideBarSectionHeader.foreground#d8c8d2
• sideBarTitle.foreground#d8c8d2
• statusBar.background#1b1419
• statusBar.border#3d3039
• statusBar.debuggingBackground#cf8aa4
• statusBar.debuggingForeground#140e12
• statusBar.foreground#b4a3af
• statusBar.noFolderBackground#1b1419
• statusBarItem.focusBorder#cf8aa4
• statusBarItem.hoverBackground#261e2399
• statusBarItem.hoverForeground#d8c8d2
• statusBarItem.remoteBackground#cf8aa4
• statusBarItem.remoteForeground#140e12
• tab.activeBackground#140e12
• tab.activeBorder#00000000
• tab.activeBorderTop#cf8aa4
• tab.activeForeground#ffffff
• tab.border#3d3039
• tab.hoverBackground#140e12ee
• tab.hoverForeground#ffffff
• tab.inactiveBackground#1b1419
• tab.inactiveForeground#9a8b96
• tab.selectedBorderTop#cf8aa4
• tab.unfocusedActiveBackground#140e12
• tab.unfocusedActiveBorder#00000000
• tab.unfocusedActiveBorderTop#cf8aa4b3
• tab.unfocusedActiveForeground#ffffff
• tab.unfocusedHoverBackground#140e1280
• tab.unfocusedInactiveForeground#9a8b96
• terminal.foreground#d8c8d2
• terminal.selectionBackground#cf8aa448
• terminal.tab.activeBorder#cf8aa4
• textBlockQuote.background#1b1419
• textBlockQuote.border#3d3039
• textCodeBlock.background#1b1419
• textLink.activeForeground#cf8aa4
• textLink.foreground#cf8aa4
• textPreformat.background#261e23
• textPreformat.foreground#d8c8d2
• textSeparator.foreground#3d3039
• titleBar.activeBackground#1b1419
• titleBar.activeForeground#d8c8d2
• titleBar.border#3d3039
• titleBar.inactiveBackground#140e12
• titleBar.inactiveForeground#b4a3af
• tree.indentGuidesStroke#3d3039
• tree.tableColumnsBorder#3d3039
• welcomePage.progress.foreground#cf8aa4
• welcomePage.tileBackground#1b1419
• widget.border#3d3039

tokenColors

TextMate scopes and font styles (syntax highlighting rules).