Sea of Serenity & Tycho Crater

Color themes

• 

  Sea of Serenity

• 

  Tycho Crater

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#f8ffff
• activityBar.background#b0aca8
• activityBar.foreground#f8ffff
• activityBar.inactiveForeground#888480
• activityBarBadge.background#00a0c0
• badge.background#00a0c0
• badge.foreground#f8ffff
• breadcrumb.background#d4d0cc
• breadcrumb.foreground#787470
• button.background#00a0c0
• button.foreground#383430
• button.hoverBackground#0caccc
• debugIcon.breakpointCurrentStackframeForeground#805454
• debugIcon.breakpointForeground#ff3050
• debugIcon.continueForeground#00a0c0
• debugIcon.disconnectForeground#c88040
• debugIcon.pauseForeground#00a0c0
• debugIcon.restartForeground#00a000
• debugIcon.startForeground#00a0c0
• debugIcon.stepBackForeground#0020e0
• debugIcon.stepIntoForeground#0020e0
• debugIcon.stepOutForeground#0020e0
• debugIcon.stepOverForeground#0020e0
• debugIcon.stopForeground#ff3050
• debugTokenExpression.name#503028
• debugTokenExpression.number#a00080
• debugTokenExpression.value#787470
• debugToolBar.background#e8e4e0
• debugView.valueChangedHighlight#ffffff80
• descriptionForeground#787470
• diffEditor.insertedLineBackground#d1e1e9c0
• diffEditor.insertedTextBackground#bdd3dffe
• diffEditor.removedLineBackground#ecbdc4c0
• diffEditor.removedTextBackground#e49fa9fe
• disabledForeground#787470
• dropdown.background#b4b0ac
• dropdown.border#a4a09c
• dropdown.foreground#585450
• editor.background#d4d0cc
• editor.findMatchBackground#ffffff
• editor.findMatchHighlightBackground#ffffffa0
• editor.focusedStackFrameHighlightBackground#ffc08040
• editor.foldBackground#98948030
• editor.foldPlaceholderForeground#383430
• editor.foreground#787470
• editor.hoverHighlightBackground#ffffff20
• editor.inlineValuesBackground#b8a080c0
• editor.inlineValuesForeground#585450
• editor.lineHighlightBackground#00000010
• editor.rangeHighlightBackground#f8ffff40
• editor.selectionBackground#78d0ff60
• editor.selectionHighlightBackground#30a0e040
• editor.stackFrameHighlightBackground#b8a08040
• editor.symbolHighlightBackground#00a0c0a0
• editor.wordHighlightBackground#ffc02040
• editorActionList.background#d4d0cc
• editorActionList.focusBackground#00000010
• editorActionList.focusForeground#585450
• editorActionList.foreground#787470
• editorBracketHighlight.foreground1#f8ffff
• editorBracketHighlight.foreground2#f8ffff
• editorBracketHighlight.foreground3#f8ffff
• editorBracketMatch.background#00000000
• editorBracketMatch.border#f8ffff
• editorCursor.background#787470
• editorCursor.foreground#f8ffff
• editorError.foreground#ff3050
• editorGroup.border#888480
• editorGroup.dropBackground#00000010
• editorGroupHeader.tabsBackground#c4c0bc
• editorGutter.addedBackground#208020
• editorGutter.addedSecondaryBackground#7fce00
• editorGutter.deletedBackground#a04040
• editorGutter.deletedSecondaryBackground#ff8000
• editorGutter.modifiedBackground#7090b8
• editorGutter.modifiedSecondaryBackground#00a0c0
• editorIndentGuide.activeBackground1#f8ffff
• editorIndentGuide.background1#989490
• editorInfo.foreground#00a0c0
• editorLightBulb.foreground#00a0c0
• editorLineNumber.activeForeground#181818
• editorLineNumber.foreground#787470
• editorMarkerNavigation.background#f0204040
• editorMarkerNavigationError.background#f02040
• editorMarkerNavigationError.headerBackground#f0204040
• editorMarkerNavigationInfo.background#00a0c0
• editorMarkerNavigationWarning.background#f08000
• editorMultiCursor.secondary.foreground#503028
• editorOverviewRuler.addedForeground#208020
• editorOverviewRuler.background#d4d0cc
• editorOverviewRuler.border#00000000
• editorOverviewRuler.deletedForeground#a04040
• editorOverviewRuler.findMatchForeground#ffffffa0
• editorOverviewRuler.modifiedForeground#7090b8
• editorRuler.foreground#b4b0ac
• editorStickyScroll.shadow#a4a09c
• editorStickyScrollHover.background#ffffff30
• editorWarning.foreground#ff8000
• editorWidget.background#d4d0cc
• editorWidget.border#a8a4a0
• editorWidget.foreground#787470
• editorWidget.resizeBorder#805454
• errorForeground#ff3050
• extensionIcon.starForeground#f08000
• focusBorder#00000000
• foreground#787470
• gitDecoration.addedResourceForeground#208020
• gitDecoration.deletedResourceForeground#a04040
• gitDecoration.ignoredResourceForeground#808088
• gitDecoration.modifiedResourceForeground#7090b8
• gitDecoration.submoduleResourceForeground#00a0c0
• gitDecoration.untrackedResourceForeground#c88040
• icon.foreground#383430
• input.background#b4b0ac
• input.border#a4a09c
• input.foreground#585450
• input.placeholderForeground#888480
• inputOption.activeBackground#ffffff20
• inputOption.activeBorder#888480
• inputOption.activeForeground#888480
• inputOption.hoverBackground#ffffff20
• list.activeSelectionBackground#f8ffff40
• list.activeSelectionForeground#585450
• list.dropBackground#00000020
• list.errorForeground#ff3050
• list.filterMatchBackground#f8ffffa0
• list.focusOutline#00000000
• list.highlightForeground#7090b8
• list.hoverBackground#f8ffff30
• list.inactiveSelectionBackground#f8ffff20
• list.warningForeground#ff8000
• menu.background#c4c0bc
• menu.separatorBackground#888480
• minimap.background#00000000
• minimap.errorHighlight#ff3050a0
• minimap.findMatchHighlight#f8ffffa0
• minimap.foregroundOpacity#000000e0
• minimap.infoHighlight#00a0c0a0
• minimap.selectionHighlight#78d0ffa0
• minimap.selectionOccurrenceHighlight#ffc020a0
• minimap.warningHighlight#f08000a0
• minimapGutter.addedBackground#208020
• minimapGutter.deletedBackground#a04040
• minimapGutter.modifiedBackground#7090b8
• minimapSlider.activeBackground#00000030
• minimapSlider.background#00000020
• minimapSlider.hoverBackground#00000028
• notebook.cellBorderColor#888480
• notebook.cellEditorBackground#d4d0cc
• notebook.cellHoverBackground#ffffff40
• notebook.cellToolbarSeparator#888480
• notebook.editorBackground#c4c0bc
• notebook.focusedCellBackground#ffffff40
• notebook.focusedCellBorder#805454
• notebook.focusedEditorBorder#686460
• notebook.inactiveFocusedCellBorder#74625c
• notebook.outputContainerBackgroundColor#a8a4a0
• notebook.selectedCellBackground#0080ff30
• outputView.background#d4d0cc
• panel.background#ccc8c4
• panel.border#bcb8bc
• panel.dropBorder#888480
• panelInput.border#a4a09c
• panelSection.border#888480
• panelSection.dropBackground#00000020
• panelSectionHeader.background#c4c0bc
• panelTitle.activeBorder#f8ffff
• panelTitle.activeForeground#f8ffff
• panelTitle.inactiveForeground#787470
• peekView.border#603028
• peekViewEditor.background#d4d0cc
• peekViewEditor.matchHighlightBackground#f8ffffc0
• peekViewResult.background#c4c0bc
• peekViewResult.matchHighlightBackground#f8ffffc0
• peekViewResult.selectionBackground#f8ffff20
• peekViewResult.selectionForeground#181818
• peekViewTitle.background#d4d0cc
• peekViewTitleDescription.foreground#00a0c0
• peekViewTitleLabel.foreground#603028
• pickerGroup.border#7090b8
• pickerGroup.foreground#7090b8
• problemsErrorIcon.foreground#ff3050
• problemsInfoIcon.foreground#00a0c0
• problemsWarningIcon.foreground#f08000
• progressBar.background#00a0c0
• sash.hoverBorder#888480
• scmGraph.foreground1#0020e0
• scmGraph.foreground2#00a0c0
• scmGraph.foreground3#f8ffff
• scmGraph.foreground4#c88040
• scmGraph.foreground5#a02020
• scmGraph.historyItemHoverAdditionsForeground#00a000
• scmGraph.historyItemHoverDeletionsForeground#ff3050
• scmGraph.historyItemHoverLabelForeground#d4d0cc
• scmGraph.historyItemRefColor#74625c
• scmGraph.historyItemRemoteRefColor#503028
• scrollbar.shadow#00000000
• scrollbarSlider.activeBackground#00000030
• scrollbarSlider.background#00000020
• scrollbarSlider.hoverBackground#00000028
• selection.background#00000010
• settings.focusedRowBackground#ffffff20
• settings.modifiedItemIndicator#00a0c0
• settings.rowHoverBackground#ffffff20
• sideBar.background#c4c0bc
• sideBar.border#888480
• sideBar.dropBackground#00000010
• sideBar.foreground#585450
• sideBarSectionHeader.background#aca8a4
• sideBarTitle.background#a4a09c
• statusBar.background#b8b4b0
• statusBar.debuggingBackground#b8a080
• statusBar.debuggingForeground#585450
• statusBar.foreground#383430
• statusBar.noFolderBackground#888480
• statusBarItem.errorBackground#f02040
• statusBarItem.errorHoverBackground#ff6060
• statusBarItem.offlineBackground#00000020
• statusBarItem.prominentBackground#00a0c0
• statusBarItem.remoteBackground#84735c
• statusBarItem.remoteForeground#d4d0cc
• statusBarItem.remoteHoverBackground#705048
• statusBarItem.remoteHoverForeground#f8ffff
• statusBarItem.warningBackground#f08000
• statusBarItem.warningHoverBackground#ffc080
• symbolIcon.classForeground#503028
• symbolIcon.constantForeground#000008
• symbolIcon.fieldForeground#383430
• symbolIcon.functionForeground#b09480
• symbolIcon.methodForeground#c88040
• symbolIcon.namespaceForeground#0020e0
• symbolIcon.operatorForeground#a00080
• symbolIcon.structForeground#00a0c0
• tab.activeBackground#d4d0cc
• tab.border#a4a09c
• tab.inactiveBackground#c4c0bc
• terminal.ansiBlack#181818
• terminal.ansiBlue#284090
• terminal.ansiBrightBlack#503028
• terminal.ansiBrightBlue#a0b0e0
• terminal.ansiBrightCyan#ff8000
• terminal.ansiBrightGreen#60a040
• terminal.ansiBrightMagenta#b868b8
• terminal.ansiBrightRed#d05868
• terminal.ansiBrightWhite#f8ffff
• terminal.ansiBrightYellow#00a0c0
• terminal.ansiCyan#c04010
• terminal.ansiGreen#406040
• terminal.ansiMagenta#804080
• terminal.ansiRed#a02020
• terminal.ansiWhite#b8a080
• terminal.ansiYellow#005888
• terminal.background#d4d0cc
• terminal.border#888480
• terminalStickyScrollHover.background#e4e0dc
• textBlockQuote.background#c4c0bc
• textBlockQuote.border#d0a060
• textCodeBlock.background#d3d0cc
• textLink.activeForeground#006888
• textLink.foreground#006888
• textPreformat.background#c4c0bc
• textPreformat.foreground#603028
• titleBar.activeBackground#888480
• titleBar.activeForeground#d4d0cc
• titleBar.inactiveBackground#54504c
• toolbar.activeBackground#ffffff40
• toolbar.hoverBackground#ffffff20
• tree.inactiveIndentGuidesStroke#989490
• tree.indentGuidesStroke#787470
• widget.shadow#a8a4a0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).