Dusk Forge — readable code, clear selections

Three VS Code themes for React, TypeScript, Node.js and SQL: Dark, Light, and High Contrast. Includes code previews, editable snippets and tools to diagnose highlighting settings.

Install from Marketplace

New in 1.6.0

• Dusk Forge High Contrast adds a deeper editor background, visible focus and panel borders, brighter line numbers and outlined active lines. It is optional; existing theme selections remain unchanged. This is not a certification of every accessibility state.
• Run Dusk Forge: Get Started for a four-step walkthrough: choose a theme, preview code, diagnose highlighting and explore tools.
• Check Highlighting now lists which user, workspace, folder and language configuration layers contain overrides. Theme selector keys are reported for review, not assumed to apply.
• Open Highlighting Settings opens modified settings for review. Nothing is reset automatically.

New in 1.5.1

• Stronger blue selection backgrounds in Dark and Light, with a quieter selection when the editor loses focus.
• Clearer matching-text borders, selection markers in the minimap and distinct primary/secondary cursor colours on supported VS Code versions.
• Dusk Forge: Copy with Syntax Highlighting uses VS Code's formatted-copy command. Select code, then use the Command Palette or the editor context menu. Colours survive only in destinations that support HTML/rich-text paste. Plain-text editors cannot retain them.
• User/workspace workbench.colorCustomizations can override these theme colours. Check existing overrides if the update looks unchanged.

New in 1.5.0

• Run Dusk Forge: Preview Code to open an editable, unsaved React, Angular, Express, PostgreSQL or JSON sample in your editor. Samples are never executed and require no database connection.
• Choose Choose Theme after opening a sample, or run Dusk Forge: Choose Color Theme, then select Dusk Forge Dark or Dusk Forge Light. The normal VS Code picker previews colours and lets you cancel.
• Developer Setup now links to previews, theme selection and highlighting checks.
• Check Highlighting includes guidance for JSX language modes, semantic overrides and custom token colours. It reads settings without changing them.
• Type dferror in JS, TS, JSX or TSX for an Express error middleware starting point. Register it after routes and review it before use.

Dusk Forge — React, JSX & TypeScript themes

Dark and light VS Code themes with distinct JSX text, HTTP method colours and practical coding snippets.

Install Dusk Forge · Report a problem

New in 1.4.1

In <p>dasdasdasd</p>, the visible text now uses soft rose in Dark and deep berry in Light. Tags, props and JavaScript expressions retain their own colour roles. Nested and multiline JSX is covered in React JavaScript and TypeScript grammars.

• Web snippets now appear in JSX and TSX as well as JS and TS.
• Current File Problems detects files changed while the picker was open, avoiding stale locations.
• Check Highlighting displays semantic customization switches instead of treating the editor setting as the final answer.

Rendered from the actual theme and VS Code grammars; not a live editor screenshot.

Two coordinated VS Code themes for developers: Dusk Forge Dark and Dusk Forge Light.

Dark uses deep slate surfaces with warm amber, teal, blue and lavender syntax. Light uses soft off-white surfaces with darker ink colours, rather than simply inverting the dark palette.

MERN, MEAN and PostgreSQL

• React / Next.js: component types, props, hooks, strings and control flow use consistent colour roles.
• Angular: TypeScript decorators, classes, properties and HTML attributes have distinct colours. Angular-specific template syntax relies on the Angular language extension.
• Express / Node.js: HTTP method scopes are preserved alongside regular JavaScript and TypeScript highlighting.
• MongoDB: JSON document keys and JavaScript object properties use blue, separate from green string values and purple constants. This release does not parse MongoDB queries or assign special colours to individual aggregation operators.
• SQL / PostgreSQL: explicit rules cover statement keywords, SQL types, constraints, functions and parameter scopes. PostgreSQL dollar-quoted strings are covered when the installed grammar exposes those scopes.

A theme styles scopes supplied by VS Code and language extensions; it does not install a database client or language server. SQL inside JavaScript strings remains string-coloured unless another extension provides embedded SQL scopes.

Install and select

Search for Dusk Forge by Yasowant Nayak, or run:

ext install yasowant.ember-dusk-yasowant

Open Preferences: Color Theme and select Dusk Forge Dark or Dusk Forge Light. Existing users of the Dusk Forge theme retain the dark theme through its stable theme ID.

Built for reading code

• Distinct colours for keywords, strings, functions, types, properties and constants.
• Readable comments, restrained surfaces, visible keyboard focus and active tabs.
• Search match borders, selection overlays, bracket colours and inlay hints.
• Coordinated Git decorations, diffs, diagnostics, terminal colours and autocomplete menus.
• TextMate syntax highlighting by default, with optional semantic colour definitions for supported language extensions.

All configured syntax and semantic foreground colours meet a measured contrast ratio of at least 4.5:1 against their base editor background. This does not certify every UI state or colour-vision accessibility. Highlighting also depends on the language extension and user overrides.

HTTP methods

The included grammar injections assign distinct scopes to supported HTTP patterns:

Supported patterns include common router calls, fetch method strings, axios calls, Next.js route handlers and .http files. The method names remain visible, so colour is an additional cue. Both themes default to grammar highlighting so generic language-server method colours do not overwrite these distinct HTTP colours.

React hook, Next.js API and use client / use server scopes are preserved from the previous release.

Palette

Feedback

Report an issue with your language, a small code example and the highlighting you expected.

License

MIT

HTTP colours troubleshooting

Version 1.2.2 fixes the default semantic overlay that made HTTP methods share the same function colour. After updating, run Developer: Reload Window and select Dusk Forge Dark or Dusk Forge Light.

If your user or workspace settings explicitly force semantic highlighting on, use this theme-specific setting in your VS Code settings JSON:

"editor.semanticTokenColorCustomizations": {
  "[Dusk Forge Dark]": { "enabled": false },
  "[Dusk Forge Light]": { "enabled": false }
}

Merge these entries into any existing setting rather than replacing your other customizations. Semantic highlighting is optional: turning it on can override the method-specific grammar colours. This does not disable IntelliSense, type checking or diagnostics.

Version 1.3.0 developer improvements

• Safer HTTP matching: ordinary cache.get('/users'), Map.get() and .delete() are no longer treated as HTTP based only on a slash-prefixed argument.
• Known HTTP receivers (such as router, app, axios, apiClient) and router.route('/users').get(...).post(...) chains have method-specific colours. Multiline call arguments are covered. Arbitrary aliases are intentionally not guessed; HTTP matching is a grammar heuristic, not type analysis.
• React component tokens stay teal, props blue and hooks distinct. Angular decorator names use purple, separate from blue attributes; Angular template intelligence still requires Angular Language Service.
• Debug stack-frame, exception, merge-conflict and diff borders now have explicit colours.
• Restrained highlight overlays preserve syntax contrast in selected, searched and changed code. Light comments are darker for readability.

Previews

These are rendered examples from the actual theme and VS Code grammars, not live editor screenshots. Your font, settings and installed language extensions may change the appearance.

Try the sample workspace

Open examples in VS Code to compare Express routes, React, Angular, MongoDB-style JSON and PostgreSQL. The examples are highlighting fixtures, not a bundled runnable application. No database or secrets are required.

Test and report issues

Run npm ci and npm test; see test instructions for grammar locations. The automated suite covers real VS Code grammars and contrast over editor overlays. It does not certify every UI combination or replace real-project testing.

For a useful report include your VS Code/extension version, language mode, active theme, minimal code sample and output from Developer: Inspect Editor Tokens and Scopes. Check user/workspace token overrides before reporting. Never include credentials.

Developer toolkit (1.4.0)

Open the Command Palette and type Dusk Forge:

• Check Highlighting: read the active theme, language mode and highlighting settings, then show troubleshooting guidance. No settings are changed.
• Developer Setup: guidance for built-in JavaScript/TypeScript support, ESLint, Angular, SQL and snippets. Extension links open their details page; nothing is installed automatically.
• Current File Problems: list existing errors and warnings from installed language tools, navigate to one, and open the normal Quick Fix picker. No fixes are automatically applied.
• Show Quick Fixes: show available fixes at the cursor for you to review.
• Open Problems Panel: open VS Code's workspace Problems view.

Snippets: type df and trigger suggestions, or use Snippets: Insert Snippet.

Review snippet placeholders and adapt them to your project. The query snippet requires an existing database client and async context. Snippets do not install libraries or execute queries.

The toolkit runs only when its commands are invoked. It has no network requests, telemetry, database access or background project scanning. Diagnostics and fixes come from installed language tools; Dusk Forge does not independently discover application bugs. A clean Problems list is not proof that code is correct.