diff --git a/examples/boxes/main.cpp b/examples/boxes/main.cpp
index 6958fd17..575a13b9 100644
--- a/examples/boxes/main.cpp
+++ b/examples/boxes/main.cpp
@@ -364,7 +364,7 @@ static void addColoredBorderRectangles1( QskLinearBox* parent, bool rounded )
     auto* box = new Box( parent );
     box->setBorderWidth( 20 );
     QskGradient gradient1( Qt::Vertical, { { 0.0, Qt::blue },
-                                           { 0.7, Qt::yellow },
+                                           { 0.9, Qt::yellow },
                                            { 1.0, Qt::darkRed } } );
     QskGradient gradient2( Qt::Vertical, { { 0.0, Qt::black },
                                            { 0.3, Qt::white },
diff --git a/src/nodes/QskBoxRendererRect.cpp b/src/nodes/QskBoxRendererRect.cpp
index 295ddde2..d20fd112 100644
--- a/src/nodes/QskBoxRendererRect.cpp
+++ b/src/nodes/QskBoxRendererRect.cpp
@@ -464,16 +464,15 @@ static inline void qskCreateBorder(
         ( line++ )->setLine( x1, y1, x2, y2, c );
     }
 
-    // ### can we make this easier somehow?
-    for( int i = gradientRight.stops().count() - 1; i >= 0; --i )
-//    for( const QskGradientStop& stop : gradientRight.stops() )
+    for( const QskGradientStop& stop : gradientRight.stops() )
     {
-        auto stop = gradientRight.stops().at( i );
         const Color c( stop.color() );
         const qreal x1 = in.right;
         const qreal x2 = out.right;
-        const qreal y1 = in.bottom + (1-stop.position()) * ( in.top - in.bottom );
-        const qreal y2 = out.bottom + (1-stop.position()) * ( out.top - out.bottom );
+        // ( 1 - stop.position() ) because we want to make the gradients go
+        // around the border clock-wise:
+        const qreal y1 = in.bottom + ( 1 - stop.position() ) * ( in.top - in.bottom );
+        const qreal y2 = out.bottom + ( 1 - stop.position() ) * ( out.top - out.bottom );
 
         ( line++ )->setLine( x1, y1, x2, y2, c );
     }