🌺 Coral Bloom

A warm, expressive dark VS Code theme built around coral, pink, blue, green, orange, and lavender syntax colors.

Coral Bloom brings together a carefully composed warm palette on a near-black background, giving your editor an elegant, organic feel that stays comfortable during long coding sessions.

Two variants are included, both using the exact same syntax colors:

• Coral Bloom — warm near-black background (#0F0C08)
• Coral Bloom Midnight — cool navy-black background (#0C0F16), for a different mood with the same semantic palette

Screenshots

JavaScript

TypeScript

HTML

CSS

Coral Bloom Midnight

Same syntax colors on a cool navy-black background.

Design Philosophy

• Warm dark foundation — The editor background (#0F0C08) is a warm near-black, not a cold neutral gray
• Coral-led semantic accents — Coral is the primary accent color, used for keywords, tag names, and critical UI elements
• Semantic token architecture — Every token type has a deliberate color assignment based on its role, not its appearance
• Visual hierarchy — Keywords → functions → variables/properties → strings → numbers/literals → types/classes
• Readability first — Colors are intentionally balanced so nothing is harsh or oversaturated

Features

• 🎨 Six-color semantic palette — coral, pink, blue, green, orange, and lavender
• 📝 Language-specific TextMate scopes — precise scope rules for each language, not generic catch-alls
• 🔤 Full JavaScript & TypeScript support — keywords, functions, function calls, variables, parameters, properties, classes, types, decorators, template strings, and more
• 🌐 HTML support — tag names, attributes, attribute values, entities, doctype, comments
• 🎯 CSS / SCSS support — element/class/ID/pseudo selectors, properties, values, functions, variables, units
• 📋 JSON support — property names distinct from string values
• 📖 Markdown support — headings, bold, italic, links, code, blockquotes, lists
• 🔲 Bracket pair colorization — coordinated with the Coral Bloom palette
• 🔀 Git decorations — added, modified, deleted, untracked, conflicting
• ⚠️ Diagnostics — error, warning, info, hint with translucent backgrounds
• 🖥️ Complete workbench theming — sidebar, activity bar, tabs, status bar, panels, inputs, buttons

Color Palette

Supported Languages

Coral Bloom provides detailed, language-specific syntax highlighting for:

• JavaScript / TypeScript
• JSX / TSX
• HTML
• CSS / SCSS
• JSON
• Markdown

The theme degrades gracefully in other TextMate-based languages.

Installation

From the VS Code Marketplace

1. Open VS Code
2. Go to the Extensions view (Ctrl+Shift+X / Cmd+Shift+X)
3. Search for Coral Bloom
4. Click Install

Manual Installation (VSIX)

1. Download the .vsix file
2. Open VS Code
3. Open the Command Palette (Ctrl+Shift+P / Cmd+Shift+P)
4. Run Extensions: Install from VSIX...
5. Select the downloaded file

Activation

1. Open the Command Palette (Ctrl+Shift+P / Cmd+Shift+P)
2. Run Preferences: Color Theme
3. Select Coral Bloom

Or use the keyboard shortcut: Ctrl+K Ctrl+T / Cmd+K Cmd+T

Recommended Settings

For the best experience, add these to your settings.json:

{
  "editor.bracketPairColorization.enabled": true,
  "editor.semanticHighlighting.enabled": false,
  "editor.fontLigatures": true
}

Feedback & Support

• Issues & Bugs: GitHub Issues
• Feature Requests: Open an issue with the enhancement label
• Questions: Open a discussion on the GitHub repository

License

MIT License

Credits

Designed and built by Mohammed Hasanfatta.

Coral Bloom is an independent standalone theme — it is not part of any other theme family.