diff --git a/src/browser/renderer/shared/TextureAtlas.ts b/src/browser/renderer/shared/TextureAtlas.ts
index c50bda23..b73e7009 100644
--- a/src/browser/renderer/shared/TextureAtlas.ts
+++ b/src/browser/renderer/shared/TextureAtlas.ts
@@ -277,7 +277,7 @@ export class TextureAtlas implements ITextureAtlas {
   }
 
   private _getBackgroundColor(bgColorMode: number, bgColor: number, inverse: boolean, dim: boolean): IColor {
-    if (this._config.allowTransparency || (inverse && !color.isOpaque(this._config.colors.foreground))) {
+    if (this._config.allowTransparency) {
       // The background color might have some transparency, so we need to render it as fully
       // transparent in the atlas. Otherwise we'd end up drawing the transparent background twice
       // around the anti-aliased edges of the glyph, and it would look too dark.
diff --git a/src/browser/services/ThemeService.ts b/src/browser/services/ThemeService.ts
index 2411ce85..91a72f5e 100644
--- a/src/browser/services/ThemeService.ts
+++ b/src/browser/services/ThemeService.ts
@@ -122,7 +122,8 @@ export class ThemeService extends Disposable implements IThemeService {
    */
   private _setTheme(theme: ITheme = {}): void {
     const colors = this._colors;
-    colors.foreground = parseColor(theme.foreground, DEFAULT_FOREGROUND);
+    colors.foreground = color.opaque(parseColor(theme.foreground, DEFAULT_FOREGROUND));
+    console.warn("xterm.js is not fully support foreground colors with transparent, so it will the foreground colors alpha channel to 255.")
     colors.background = parseColor(theme.background, DEFAULT_BACKGROUND);
     colors.cursor = parseColor(theme.cursor, DEFAULT_CURSOR);
     colors.cursorAccent = parseColor(theme.cursorAccent, DEFAULT_CURSOR_ACCENT);