diff --git a/examples/Parameters/ExampleUIParameters.cpp b/examples/Parameters/ExampleUIParameters.cpp
index 3af11eac..7b5e2c49 100644
--- a/examples/Parameters/ExampleUIParameters.cpp
+++ b/examples/Parameters/ExampleUIParameters.cpp
@@ -19,6 +19,11 @@
 
 START_NAMESPACE_DISTRHO
 
+/**
+  We need the Color class from DGL.
+ */
+using DGL_NAMESPACE::Color;
+
 /**
   We need the rectangle class from DGL.
  */
diff --git a/examples/States/ExampleUIStates.cpp b/examples/States/ExampleUIStates.cpp
index 2e0ae031..4d271fc9 100644
--- a/examples/States/ExampleUIStates.cpp
+++ b/examples/States/ExampleUIStates.cpp
@@ -1,6 +1,6 @@
 /*
  * DISTRHO Plugin Framework (DPF)
- * Copyright (C) 2012-2019 Filipe Coelho <falktx@falktx.com>
+ * Copyright (C) 2012-2021 Filipe Coelho <falktx@falktx.com>
  *
  * Permission to use, copy, modify, and/or distribute this software for any purpose with
  * or without fee is hereby granted, provided that the above copyright notice and this
@@ -15,9 +15,15 @@
  */
 
 #include "DistrhoUI.hpp"
+#include "Color.hpp"
 
 START_NAMESPACE_DISTRHO
 
+/**
+  We need the Color class from DGL.
+ */
+using DGL_NAMESPACE::Color;
+
 /**
   We need the rectangle class from DGL.
  */
@@ -146,48 +152,74 @@ protected:
     */
     void onDisplay() override
     {
+        const GraphicsContext& context(getGraphicsContext());
+
         const uint width = getWidth();
         const uint height = getHeight();
+        const uint minwh = std::min(width, height);
+        const uint bgColor = getBackgroundColor();
 
         Rectangle<double> r;
 
-        r.setWidth(width/3 - 6);
-        r.setHeight(height/3 - 6);
+        // if host doesn't respect aspect-ratio but supports ui background, draw out-of-bounds color from it
+        if (width != height && bgColor != 0)
+        {
+            const int red   = (bgColor >> 24) & 0xff;
+            const int green = (bgColor >> 16) & 0xff;
+            const int blue  = (bgColor >>  8) & 0xff;
+            Color(red, green, blue).setFor(context);
+
+            if (width > height)
+            {
+                r.setPos(height, 0);
+                r.setSize(width-height, height);
+            }
+            else
+            {
+                r.setPos(0, width);
+                r.setSize(width, height-width);
+            }
+
+            r.draw(context);
+        }
+
+        r.setWidth(minwh/3 - 6);
+        r.setHeight(minwh/3 - 6);
 
         // draw left, center and right columns
         for (int i=0; i<3; ++i)
         {
-            r.setX(3 + i*width/3);
+            r.setX(3 + i*minwh/3);
 
             // top
             r.setY(3);
 
             if (fParamGrid[0+i])
-                glColor3f(0.8f, 0.5f, 0.3f);
+                Color(0.8f, 0.5f, 0.3f).setFor(context);
             else
-                glColor3f(0.3f, 0.5f, 0.8f);
+                Color(0.3f, 0.5f, 0.8f).setFor(context);
 
-            r.draw();
+            r.draw(context);
 
             // middle
-            r.setY(3 + height/3);
+            r.setY(3 + minwh/3);
 
             if (fParamGrid[3+i])
-                glColor3f(0.8f, 0.5f, 0.3f);
+                Color(0.8f, 0.5f, 0.3f).setFor(context);
             else
-                glColor3f(0.3f, 0.5f, 0.8f);
+                Color(0.3f, 0.5f, 0.8f).setFor(context);
 
-            r.draw();
+            r.draw(context);
 
             // bottom
-            r.setY(3 + height*2/3);
+            r.setY(3 + minwh*2/3);
 
             if (fParamGrid[6+i])
-                glColor3f(0.8f, 0.5f, 0.3f);
+                Color(0.8f, 0.5f, 0.3f).setFor(context);
             else
-                glColor3f(0.3f, 0.5f, 0.8f);
+                Color(0.3f, 0.5f, 0.8f).setFor(context);
 
-            r.draw();
+            r.draw(context);
         }
     }