diff --git a/lib/components/term.tsx b/lib/components/term.tsx
index f0e56a6d..16846184 100644
--- a/lib/components/term.tsx
+++ b/lib/components/term.tsx
@@ -131,9 +131,15 @@ export default class Term extends React.PureComponent<TermProps> {
     this.termWrapperRef?.appendChild(this.termRef);
 
     if (!props.term) {
+      const needTransparency = Color(props.backgroundColor).alpha() < 1;
       let useWebGL = false;
       if (props.webGLRenderer) {
-        if (!isWebgl2Supported()) {
+        if (needTransparency) {
+          console.warn(
+            'WebGL Renderer has been disabled since it does not support transparent backgrounds yet. ' +
+              'Falling back to canvas-based rendering.'
+          );
+        } else if (!isWebgl2Supported()) {
           console.warn('WebGL2 is not supported on your machine. Falling back to canvas-based rendering.');
         } else {
           // Experimental WebGL renderer needs some more glue-code to make it work on Hyper.