Contrast Theme
Publisher: John DuganThemes in package: 1
Blissful editing for VS Code
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.background#191919
- activityBar.foreground#D0D0D0
- activityBarBadge.background#F8F8F2
- activityBarBadge.foreground#191919
- breadcrumb.activeSelectionForeground#D0D0D0
- breadcrumb.focusForeground#8C8C8A
- breadcrumb.foreground#6D6D6D
- breadcrumbPicker.background#292928
- button.background#00A4F3
- button.foreground#FFFFFF
- button.hoverBackground#0093DA
- debugExceptionWidget.background#F3002B
- debugExceptionWidget.border#F3002B
- debugToolBar.background#3D3D3C
- diffEditor.insertedTextBackground#00A78A40
- diffEditor.removedTextBackground#A7001D40
- dropdown.border#50504F
- editor.background#191919
- editor.findMatchBackground#DA0093
- editor.findMatchHighlightBackground#8E005F
- editor.findRangeHighlightBackground#50504F4D
- editor.foreground#F8F8F2
- editor.hoverHighlightBackground#333332
- editor.inactiveSelectionBackground#3D3D3C
- editor.lineHighlightBackground#1F1F1E
- editor.lineHighlightBorder#292928
- editor.rangeHighlightBackground#50504F4D
- editor.selectionBackground#50504F
- editor.selectionHighlightBackground#3D3D3C
- editor.wordHighlightBackground#333332
- editor.wordHighlightStrongBackground#DA0093
- editorBracketMatch.background#333332
- editorBracketMatch.border#50504F
- editorCodeLens.foreground#6D6D6D
- editorCursor.foreground#D0D0D0
- editorError.foreground#F3002B
- editorGroup.dropBackground#00000040
- editorGroupHeader.tabsBackground#191919
- editorGutter.addedBackground#00F3C9
- editorGutter.deletedBackground#F3002B
- editorGutter.modifiedBackground#F3C900
- editorHint.foreground#A9B9B0
- editorHoverWidget.background#333332
- editorHoverWidget.border#333332
- editorIndentGuide.activeBackground#50504F
- editorIndentGuide.background#333332
- editorInfo.foreground#00F3C9
- editorLineNumber.foreground#50504F
- editorLink.activeForeground#8C8C8A
- editorMarkerNavigation.background#1F1F1E
- editorMarkerNavigationError.background#F3002B
- editorMarkerNavigationWarning.background#F3C900
- editorOverviewRuler.addedForeground#00F3C9
- editorOverviewRuler.currentContentForeground#00F3C9
- editorOverviewRuler.deletedForeground#F3002B
- editorOverviewRuler.errorForeground#F3002B
- editorOverviewRuler.findMatchForeground#DA0093
- editorOverviewRuler.incomingContentForeground#00A4F3
- editorOverviewRuler.infoForeground#00F3C9
- editorOverviewRuler.modifiedForeground#F3C900
- editorOverviewRuler.rangeHighlightForeground#50504F
- editorOverviewRuler.selectionHighlightForeground#8C8C8A
- editorOverviewRuler.warningForeground#F3C900
- editorOverviewRuler.wordHighlightForeground#8C8C8A
- editorOverviewRuler.wordHighlightStrongForeground#DA0093
- editorRuler.foreground#333332
- editorSuggestWidget.border#292928
- editorSuggestWidget.foreground#D0D0D0
- editorSuggestWidget.highlightForeground#F8F8F2
- editorSuggestWidget.selectedBackground#3D3D3C
- editorWarning.foreground#F3C900
- editorWhitespace.foreground#333332
- editorWidget.background#292928
- editorWidget.border#3D3D3C
- errorForeground#F3002B
- extensionButton.prominentBackground#00A4F3
- extensionButton.prominentForeground#FFFFFF
- extensionButton.prominentHoverBackground#0093DA
- focusBorder#B2B2B1
- gitDecoration.conflictingResourceForeground#FF41C1
- gitDecoration.deletedResourceForeground#F3002B
- gitDecoration.ignoredResourceForeground#8C8C8A
- gitDecoration.modifiedResourceForeground#F3C900
- gitDecoration.untrackedResourceForeground#00F3C9
- input.border#50504F
- inputOption.activeBorder#B2B2B1
- list.activeSelectionBackground#191919
- list.activeSelectionForeground#F8F8F2
- list.dropBackground#333332
- list.errorForeground#F3002B
- list.focusBackground#191919
- list.highlightForeground#F8F8F2
- list.hoverBackground#191919
- list.inactiveSelectionBackground#191919
- list.inactiveSelectionForeground#D0D0D0
- list.warningForeground#F3C900
- menu.background#292928
- menu.foreground#8C8C8A
- menu.selectionBackground#191919
- menu.selectionForeground#D0D0D0
- menubar.selectionBackground#292928
- menubar.selectionForeground#D0D0D0
- merge.currentContentBackground#0074604D
- merge.currentHeaderBackground#007460
- merge.incomingContentBackground#0070A74D
- merge.incomingHeaderBackground#0070A7
- notification.background#3D3D3C
- notification.buttonBackground#00A4F3
- notification.buttonForeground#FFFFFF
- notification.buttonHoverBackground#0093DA
- notification.errorBackground#F3002B
- notification.errorForeground#42000C
- notification.foreground#F8F8F2
- notification.infoBackground#00F3C9
- notification.infoForeground#007460
- notification.warningBackground#F3C900
- notification.warningForeground#746000
- notificationCenterHeader.background#3D3D3C
- notificationCenterHeader.foreground#B2B2B1
- notificationLink.foreground#00A4F3
- notifications.background#292928
- notifications.border#3D3D3C
- notifications.foreground#F8F8F2
- panel.background#191919
- panel.border#3D3D3C
- panelTitle.activeBorder#00A4F3
- panelTitle.activeForeground#FFFFFF
- panelTitle.inactiveForeground#8C8C8A
- peekView.border#00A4F3
- peekViewEditor.background#0B0B0B
- peekViewEditor.matchHighlightBackground#DA0093
- peekViewResult.background#292928
- peekViewResult.fileForeground#F8F8F2
- peekViewResult.lineForeground#D0D0D0
- peekViewResult.matchHighlightBackground#8E005F
- peekViewResult.selectionBackground#0B0B0B
- peekViewResult.selectionForeground#F8F8F2
- peekViewTitle.background#00A4F3
- peekViewTitleDescription.foreground#FFFFFF
- peekViewTitleLabel.foreground#FFFFFF
- pickerGroup.border#50504F
- pickerGroup.foreground#8C8C8A
- sideBar.background#292928
- sideBar.foreground#8C8C8A
- sideBarSectionHeader.background#3D3D3C
- sideBarSectionHeader.foreground#B2B2B1
- statusBar.background#191919
- statusBar.debuggingBackground#F34F00
- statusBar.debuggingForeground#F8F8F2
- statusBar.foreground#878787
- statusBar.noFolderBackground#191919
- statusBar.noFolderForeground#878787
- statusBarItem.activeBackground#000000
- statusBarItem.hoverBackground#0B0B0B
- statusBarItem.remoteBackground#191919
- statusBarItem.remoteForeground#878787
- tab.activeBorder#00A4F3
- tab.border#191919
- tab.hoverBackground#191919
- tab.inactiveBackground#292928
- tab.inactiveForeground#B2B2B1
- tab.unfocusedActiveBorder#191919
- tab.unfocusedActiveForeground#D0D0D0
- tab.unfocusedInactiveForeground#8C8C8A
- titleBar.activeBackground#191919
- titleBar.activeForeground#878787
- titleBar.inactiveBackground#191919
- titleBar.inactiveForeground#878787
- walkThrough.embeddedEditorBackground#0B0B0B
- welcomePage.buttonBackground#292928
- welcomePage.buttonHoverBackground#0B0B0B
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #6D6D6D | — |
| string.quoted | #FBDFB5 | — |
| constant.numeric | #D0D0D0 | — |
| constant.language | #D77676 | — |
| keyword.operator | #FF5E5E | — |
| punctuation.definition.binding-pattern, meta.import punctuation.definition.block | #FF5E5E | — |
| keyword.control | #FF5E5E | — |
| storage.type | #FBDFB5 | italic |
| storage.modifier | #FBDFB5 | italic |
| variable.language | #E9FDAC | — |
| support.function | #C9E9E0 | — |
| punctuation.separator, punctuation.terminator | #D0D0D0 | — |
| string.regexp, string.regexp keyword.control, string.regexp keyword.operator | #FBDFB5 | — |
| string.regexp punctuation.definition.string | #A9B9B0 | — |
| string.regexp keyword.other | #FF5E5E | — |
| entity.name.function | #8CDAFF | — |
| punctuation.definition.parameters, punctuation.definition.arguments | #C9E9E0 | normal |
| meta.parameters | — | italic |
| variable.parameter | #D0D0D0 | — |
| variable.function, meta.function-call entity.name.function, meta.method-call entity.name.function | #C9E9E0 | — |
| entity.name.type.class, entity.other.inherited-class, support.class | #B8FCB1 | — |
| meta.tag.sgml, meta.tag.sgml variable.language, meta.tag.sgml punctuation.definition.tag | #FFCC32 | — |
| meta.tag.preprocessor, meta.tag.preprocessor entity.name.tag, meta.tag.preprocessor punctuation.definition.tag | #FFCC32 | — |
| entity.name.tag | #FF5E5E | — |
| punctuation.definition.tag | #D0D0D0 | — |
| entity.other.attribute-name | #8CDAFF | — |
| meta.tag.metadata.script entity.name.tag, meta.tag.metadata.script punctuation.definition.tag | #B8FCB1 | — |
| #B8FCB1 | — | |
| support.type.property-name | #F8F8F2 | — |
| meta.property-value | #FBDFB5 | — |
| punctuation.section | #D0D0D0 | — |
| variable.css, variable.scss | #FFE082 | — |
| punctuation.definition.entity, punctuation.definition.attribute-selector | #8CDAFF | — |
| meta.attribute-selector | #FBDFB5 | — |
| keyword.control.at-rule, keyword.control.at-rule punctuation | #FBDFB5 | italic |
| meta.at-rule support.function | #8CDAFF | — |
| meta.at-rule.mixin variable.scss, meta.at-rule.function variable.scss | #D0D0D0 | italic |
| meta.at-rule.mixin support.constant, meta.at-rule.mixin variable.parameter, meta.at-rule.function support.constant, meta.at-rule.function variable.parameter | #FBDFB5 | italic |
| meta.at-rule.mixin constant.numeric, meta.at-rule.function constant.numeric | — | italic |
| keyword.control.at-rule.include, keyword.control.at-rule.include punctuation | #FF5E5E | normal |
| meta.at-rule.function punctuation.section | #C9E9E0 | — |
| meta.at-rule.return | #D0D0D0 | — |
| meta.at-rule.return punctuation.definition.begin.bracket, meta.at-rule.return punctuation.definition.end.bracket | #D0D0D0 | — |
| meta.at-rule.include entity.name.function, meta.at-rule.include punctuation, meta.property-value punctuation.section.function | #C9E9E0 | — |
| punctuation.definition.interpolation | #D77676 | — |
| punctuation.definition.map | #D77676 | — |
| comment storage.type, comment punctuation.definition.block | #6D6D6D | normal |
| punctuation.definition.block, punctuation.definition.dictionary | #A9B9B0 | — |
| meta.brace.square, punctuation.definition.array | #D77676 | — |
| meta.brace.round | #C9E9E0 | — |
| punctuation.accessor | #FF5E5E | — |
| support.variable.dom, support.class.console, support.type.object | #FFE082 | — |
| support.variable.property.js | #E9FDAC | — |
| support.class.js, support.class.builtin.js | #8CDAFF | — |
| meta.function-call support.class.builtin.js, new.expr entity.name.type.js | #C9E9E0 | — |
| support.class.js | #F8F8F2 | — |
| string.template.js, punctuation.definition.string.template | #FBDFB5 | — |
| meta.template.expression | #F8F8F2 | — |
| punctuation.definition.template-expression | #D77676 | — |
| punctuation.support.type.property-name | #B2B2B1 | — |
| punctuation.section.embedded | #A9B9B0 | — |
| punctuation.definition.begin.bracket.round, punctuation.definition.end.bracket.round | #C9E9E0 | — |
| variable.other.php | #F8F8F2 | — |
| meta.function.parameter | #D0D0D0 | italic |
| punctuation.section.array | #D77676 | — |
| keyword.other.new | #FF5E5E | — |
| keyword.other.sql, keyword.other.DML.sql, keyword.other.alias.sql | #FF5E5E | — |
| keyword.other.DDL.create.II.sql | #D77676 | — |
| entity.name.section, punctuation.definition.heading | #FFE082 | — |
| punctuation.definition.quote.begin.markdown, punctuation.definition.list.begin.markdown | #C9E9E0 | — |
| markup punctuation | #FF5E5E | — |
| markup.fenced_code.block.markdown | #C9E9E0 | — |
| string.other.link | #8CDAFF | — |
| markup.underline.link | #6D6D6D | — |
| string.other.link.description.title | #D0D0D0 | — |
| meta.link punctuation | #B2B2B1 | — |
| meta.image punctuation | #B2B2B1 | — |
| keyword.other.special-method.dockerfile | #FF5E5E | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...