Coral Bloom
Publisher: Mohammed HasanfattaThemes in package: 2
A warm, expressive dark VS Code theme built around coral, pink, blue, green, orange, and lavender syntax colors.
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.background#0C0F16
- activityBar.border#1B212C
- activityBar.foreground#EE7E71
- activityBar.inactiveForeground#7F7770
- activityBarBadge.background#EE7E71
- activityBarBadge.foreground#0C0F16
- badge.background#EE7E71
- badge.foreground#0C0F16
- breadcrumb.activeSelectionForeground#EDE9E5
- breadcrumb.focusForeground#EDE9E5
- breadcrumb.foreground#7F7770
- button.background#EE7E71
- button.foreground#0C0F16
- button.hoverBackground#EC6687
- button.secondaryBackground#1B212C
- button.secondaryForeground#EDE9E5
- debugToolBar.background#12161F
- diffEditor.insertedTextBackground#81D19215
- diffEditor.removedTextBackground#C4567015
- dropdown.background#12161F
- dropdown.border#1B212C
- dropdown.foreground#EDE9E5
- editor.background#0C0F16
- editor.findMatchBackground#F3B36B44
- editor.findMatchHighlightBackground#F3B36B33
- editor.foreground#EDE9E5
- editor.inactiveSelectionBackground#EE7E7122
- editor.lineHighlightBackground#12161F
- editor.lineHighlightBorder#17100C00
- editor.selectionBackground#EE7E7133
- editor.selectionHighlightBackground#EE7E7122
- editor.wordHighlightBackground#EC668722
- editor.wordHighlightStrongBackground#EC668733
- editorBracketHighlight.foreground1#99918B
- editorBracketHighlight.foreground2#99918B
- editorBracketHighlight.foreground3#99918B
- editorBracketHighlight.foreground4#99918B
- editorBracketHighlight.foreground5#99918B
- editorBracketHighlight.foreground6#99918B
- editorBracketHighlight.unexpectedBracket.foreground#EE7E71
- editorBracketMatch.background#EE7E7122
- editorBracketMatch.border#EE7E71
- editorCursor.foreground#EC6687
- editorError.background#EE7E7122
- editorError.foreground#EE7E71
- editorGroupHeader.tabsBackground#0F131B
- editorGroupHeader.tabsBorder#1B212C
- editorGutter.addedBackground#81D192
- editorGutter.deletedBackground#C45670
- editorGutter.modifiedBackground#F3B36B
- editorHint.foreground#81D192
- editorHoverWidget.background#0F131B
- editorHoverWidget.border#1B212C
- editorIndentGuide.activeBackground1#EE7E7166
- editorIndentGuide.background1#EE7E7126
- editorInfo.background#74A0F822
- editorInfo.foreground#74A0F8
- editorLineNumber.activeForeground#EDE9E5
- editorLineNumber.foreground#7F7770
- editorOverviewRuler.border#1B212C
- editorRuler.foreground#1B212C
- editorSuggestWidget.background#0F131B
- editorSuggestWidget.border#1B212C
- editorSuggestWidget.highlightForeground#EE7E71
- editorSuggestWidget.selectedBackground#EE7E7133
- editorWarning.background#F3B36B22
- editorWarning.foreground#F3B36B
- editorWhitespace.foreground#7F777055
- editorWidget.background#0F131B
- editorWidget.border#1B212C
- focusBorder#EE7E71
- gitDecoration.addedResourceForeground#81D192
- gitDecoration.conflictingResourceForeground#EE7E71
- gitDecoration.deletedResourceForeground#C45670
- gitDecoration.ignoredResourceForeground#7F7770
- gitDecoration.modifiedResourceForeground#F3B36B
- gitDecoration.untrackedResourceForeground#81D192
- icon.foreground#7F7770
- input.background#12161F
- input.border#1B212C
- input.foreground#EDE9E5
- input.placeholderForeground#7F7770
- inputOption.activeBackground#EE7E7133
- inputOption.activeBorder#EE7E71
- keybindingLabel.background#12161F
- keybindingLabel.border#1B212C
- keybindingLabel.foreground#EDE9E5
- list.activeSelectionBackground#EE7E7133
- list.activeSelectionForeground#EDE9E5
- list.focusBackground#1B212C
- list.highlightForeground#EE7E71
- list.hoverBackground#12161F
- list.hoverForeground#EDE9E5
- list.inactiveSelectionBackground#12161F
- list.inactiveSelectionForeground#EDE9E5
- minimap.selectionHighlight#EE7E7133
- notificationCenter.border#1B212C
- notifications.background#0F131B
- notifications.border#1B212C
- notifications.foreground#EDE9E5
- panel.background#0F131B
- panel.border#1B212C
- panelTitle.activeBorder#EE7E71
- panelTitle.activeForeground#EDE9E5
- panelTitle.inactiveForeground#7F7770
- peekView.border#EE7E71
- peekViewEditor.background#0F131B
- peekViewResult.background#0F131B
- peekViewTitle.background#12161F
- peekViewTitleDescription.foreground#7F7770
- peekViewTitleLabel.foreground#EDE9E5
- progressBar.background#EE7E71
- scrollbar.shadow#00000044
- scrollbarSlider.activeBackground#7F777066
- scrollbarSlider.background#7F777022
- scrollbarSlider.hoverBackground#7F777044
- settings.headerForeground#EDE9E5
- settings.modifiedItemIndicator#EE7E71
- sideBar.background#0F131B
- sideBar.border#1B212C
- sideBar.foreground#EDE9E5
- sideBarSectionHeader.background#12161F
- sideBarSectionHeader.foreground#EDE9E5
- sideBarTitle.foreground#EDE9E5
- statusBar.background#12161F
- statusBar.border#1B212C
- statusBar.debuggingBackground#EE7E71
- statusBar.debuggingForeground#0C0F16
- statusBar.foreground#7F7770
- statusBar.noFolderBackground#12161F
- statusBarItem.hoverBackground#1B212C
- tab.activeBackground#0C0F16
- tab.activeBorderTop#EE7E71
- tab.activeForeground#EDE9E5
- tab.border#1B212C
- tab.hoverBackground#1B212C
- tab.inactiveBackground#0F131B
- tab.inactiveForeground#7F7770
- terminal.ansiBlack#0C0F16
- terminal.ansiBlue#74A0F8
- terminal.ansiBrightBlack#7F7770
- terminal.ansiBrightBlue#74A0F8
- terminal.ansiBrightCyan#74A0F8
- terminal.ansiBrightGreen#81D192
- terminal.ansiBrightMagenta#9B91F8
- terminal.ansiBrightRed#EE7E71
- terminal.ansiBrightWhite#EDE9E5
- terminal.ansiBrightYellow#F3B36B
- terminal.ansiCyan#74A0F8
- terminal.ansiGreen#81D192
- terminal.ansiMagenta#9B91F8
- terminal.ansiRed#EE7E71
- terminal.ansiWhite#EDE9E5
- terminal.ansiYellow#F3B36B
- terminal.foreground#EDE9E5
- textLink.activeForeground#81D192
- textLink.foreground#74A0F8
- titleBar.activeBackground#0C0F16
- titleBar.activeForeground#EDE9E5
- titleBar.border#1B212C
- titleBar.inactiveBackground#0C0F16
- titleBar.inactiveForeground#7F7770
- walkThrough.embeddedEditorBackground#0F131B
- welcomePage.tileBackground#0F131B
- welcomePage.tileBorder#1B212C
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, comment.line, comment.line.double-slash, comment.block, comment.block.documentation, comment.block.html, comment.block.css | #6E655E | italic |
| keyword, keyword.control, keyword.control.conditional, keyword.control.loop, keyword.control.flow, keyword.control.trycatch, keyword.control.switch, keyword.control.default | #EE7E71 | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as | #EE7E71 | — |
| storage.type, storage.modifier | #EE7E71 | — |
| keyword.operator, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.arithmetic, keyword.operator.logical, keyword.operator.ternary, keyword.operator.spread, keyword.operator.rest, keyword.operator.optional, keyword.operator.type.annotation, keyword.operator.relational, keyword.operator.new, keyword.operator.expression.typeof, keyword.operator.expression.instanceof, keyword.operator.expression.void, keyword.operator.expression.delete, keyword.operator.expression.in, keyword.operator.expression.of, keyword.operator.expression.keyof, keyword.operator.expression.is | #EC6687 | — |
| entity.name.function, support.function, meta.definition.method entity.name.function | #EC6687 | — |
| meta.function-call entity.name.function, entity.name.function.call, support.function.builtin, support.function.console, support.function.dom, support.function.math | #EC6687 | — |
| meta.method-call entity.name.function, meta.function-call.method entity.name.function | #EC6687 | — |
| variable, variable.other.readwrite, variable.other.readwrite.alias | #74A0F8 | — |
| variable.parameter, meta.parameters variable, meta.parameter variable | #74A0F8 | — |
| variable.other.object | #74A0F8 | — |
| variable.other.property, variable.object.property, meta.object-literal.key, variable.other.enummember | #74A0F8 | — |
| variable.other.constant | #74A0F8 | — |
| entity.name.type.class, entity.name.class, entity.name.type.interface, support.class, entity.other.inherited-class | #9B91F8 | — |
| entity.name.type, entity.name.type.enum, entity.name.type.alias, entity.name.type.module, support.type, support.type.primitive | #9B91F8 | — |
| meta.decorator, meta.decorator entity.name.function, meta.decorator variable.other.readwrite, punctuation.decorator | #9B91F8 | — |
| string, string.quoted, string.quoted.single, string.quoted.double | #81D192 | — |
| string.template, string.template.js, string.template.ts | #81D192 | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, meta.template.expression | #74A0F8 | — |
| constant.numeric, constant.numeric.decimal, constant.numeric.integer, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal, constant.numeric.float | #F3B36B | — |
| constant.language.boolean, constant.language.boolean.true, constant.language.boolean.false | #F3B36B | — |
| constant.language.null, constant.language.undefined | #F3B36B | — |
| constant.language.json | #F3B36B | — |
| string.regexp | #81D192 | — |
| constant.character.escape | #F3B36B | — |
| punctuation, punctuation.definition, punctuation.accessor, punctuation.separator, punctuation.terminator, meta.brace.round, meta.brace.square, meta.brace.curly, punctuation.separator.comma, punctuation.terminator.statement | #99918B | — |
| entity.name.tag, entity.name.tag.html | #EE7E71 | — |
| punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end, punctuation.definition.tag.html | #99918B | — |
| entity.other.attribute-name, entity.other.attribute-name.html | #74A0F8 | — |
| constant.character.entity, constant.character.entity.html, punctuation.definition.entity.html | #F3B36B | — |
| meta.tag.metadata.doctype, meta.tag.metadata.doctype entity.name.tag, meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.other.attribute-name | #9B91F8 | — |
| entity.name.tag.css, entity.name.tag.scss | #EE7E71 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.scss | #EC6687 | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id.scss | #74A0F8 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-class.scss, entity.other.attribute-name.pseudo-element.scss | #9B91F8 | — |
| support.type.property-name.css, support.type.property-name.scss, meta.property-name.css, meta.property-name.scss, support.type.property-name.media.css | #74A0F8 | — |
| support.constant.property-value.css, support.constant.property-value.scss, meta.property-value.css, support.constant.color.css, support.constant.font-name.css | #81D192 | — |
| support.function.css, support.function.scss, support.function.calc.css, support.function.url.css, support.function.misc.css, support.function.gradient.css, support.function.transform.css, support.function.shape.css | #F3B36B | — |
| constant.numeric.css, constant.numeric.scss | #F3B36B | — |
| keyword.other.unit.css, keyword.other.unit.scss, keyword.other.unit.percentage.css | #F3B36B | — |
| variable.css, variable.scss, variable.argument.css | #9B91F8 | — |
| keyword.other.important.css, keyword.other.important.scss | #EE7E71 | — |
| entity.name.tag.reference.scss | #EE7E71 | — |
| keyword.control.at-rule.css, keyword.control.at-rule.scss, keyword.control.at-rule.media.css, keyword.control.at-rule.keyframes.css, keyword.control.at-rule.import.css, keyword.control.at-rule.include.scss, keyword.control.at-rule.mixin.scss, keyword.control.at-rule.extend.scss, keyword.control.at-rule.use.scss | #EE7E71 | — |
| support.type.property-name.json, support.type.property-name.json.comments | #74A0F8 | — |
| heading.1.markdown entity.name, heading.2.markdown entity.name, heading.3.markdown entity.name, heading.4.markdown entity.name, heading.5.markdown entity.name, heading.6.markdown entity.name, markup.heading, entity.name.section.markdown, punctuation.definition.heading.markdown | #EE7E71 | bold |
| markup.bold, markup.bold.markdown | #EC6687 | bold |
| markup.italic, markup.italic.markdown | #9B91F8 | italic |
| markup.underline.link, markup.underline.link.markdown, markup.underline.link.image.markdown | #74A0F8 | — |
| string.other.link.title.markdown, string.other.link.description.markdown | #81D192 | — |
| markup.inline.raw, markup.inline.raw.string.markdown, markup.fenced_code.block.markdown, markup.raw.block.markdown | #F3B36B | — |
| markup.quote, markup.quote.markdown | #9B91F8 | italic |
| punctuation.definition.list.begin.markdown, markup.list, beginning.punctuation.definition.list.markdown | #EC6687 | — |
| meta.separator.markdown | #6E655E | — |
| entity.name.tag.js, entity.name.tag.tsx, support.class.component.js, support.class.component.tsx | #9B91F8 | — |
| entity.name.tag.html.js, entity.name.tag.html.tsx | #EE7E71 | — |
| variable.language.this, variable.language.super | #EE7E71 | italic |
| markup.inserted | #81D192 | — |
| markup.deleted | #C45670 | — |
| markup.changed | #F3B36B | — |
| invalid, invalid.illegal | #EE7E71 | underline |
| invalid.deprecated | #9B91F8 | strikethrough |