Much Better Comments

Give comments nine distinct, customizable colors across dozens of languages using a single symbol.

//! Important               — coral red
// @ Annotation             — purple
// # Section                — blue
// $ Cost or performance    — green
// % Progress               — yellow
// ^ Improvement            — orange
// & Related information    — cyan
// * Remember this          — pink
// ? Question               — blue gray

These labels are suggestions; symbols can mean whatever you like. Spaces or tabs between // and the symbol are optional. The first symbol determines the color from // to the end of that comment. An inline comment leaves the preceding code unchanged.

Language support

JavaScript, TypeScript, JSX, and TSX retain the original parser. Other languages use the TextMate syntax grammar and comment configuration supplied by VS Code or an installed language extension. Support grows with your installed language extensions, without downloading grammars or sending your code anywhere.

Verified with 37 additional built-in language/file-type grammars (all nine markers in each):

Use the language's own comment delimiter followed by any of ! @ # $ % ^ & * ?. For example, Python's blue marker is # # Section, and SQL's green marker is -- $ Cost.

Only grammar-classified comments are eligible. Ordinary strings, multiline strings, shell heredocs, and code remain unchanged. In newly supported languages, a marker on the opening line of a block comment colors that comment span on that line, stopping before subsequent code; it does not color the whole multiline block. JavaScript/TypeScript keep their existing line-comment-only behavior.

Additional languages need an installed extension that supplies both a TextMate grammar with comment scopes and a comment configuration. Plain text, standard JSON, and languages without those definitions are left unchanged. Accuracy follows the installed grammar, including its handling of embedded languages and incomplete syntax. Shebangs such as #!/bin/sh are ignored; use # ! with a space for a first-line exclamation comment.

Install locally

1. In VS Code, open the Command Palette.
2. Select Extensions: Install from VSIX....
3. Choose the Much Better Comments .vsix release file.
4. Open a JavaScript or TypeScript file and try the examples above.

Publisher: ShreemauliRaut. Extension ID: ShreemauliRaut.much-better-comments. If you installed an earlier Color Comments build (local-preview.color-comments or ShreemauliRaut.color-comments), uninstall it before installing this release to avoid duplicate decorations.

Settings

Settings retain the colorComments prefix so existing color preferences continue to work.

Search Much Better Comments in VS Code Settings. Turn highlighting on or off with colorComments.enabled, or override colors in Settings JSON:

{
  "colorComments.colors": {
    "!": "#FF5555",
    "?": "#70BFFF"
  }
}

Each value must be a six-digit hex color. Unspecified markers use their defaults. Colors can be adjusted for light themes and personal contrast needs. Other extensions that color comments may override or compete with these decorations.

Development

The extension uses TypeScript, compiled to JavaScript, with the VS Code decoration API. No server or API key is required. It makes no network requests and collects no telemetry.

npm ci
npm run check
npm test
npm run build
npm run package

Open this folder in VS Code and press F5 to launch an Extension Development Host. Open examples/demo.js in the new window to inspect the colors. Requires VS Code 1.96 or newer. Use Node.js 22 or newer for development.

See the included PUBLISHING.md file to publish under your own account.

The grammar coverage tests use a local VS Code installation when available. Set VSCODE_GRAMMAR_ROOT to its resources/app/extensions directory on other platforms; those integration checks are explicitly skipped when unavailable.