diff --git a/MetaballsKit/Metaballs.swift b/MetaballsKit/Metaballs.swift
index cceb5f1..a679234 100644
--- a/MetaballsKit/Metaballs.swift
+++ b/MetaballsKit/Metaballs.swift
@@ -307,9 +307,9 @@ public class Field {
             // Create a transform matrix to handle it
             let dx = Float(size.x) / 2.0
             let dy = Float(size.y) / 2.0
-            let translate = Matrix3x3.translation(dx: dx, dy: dy)
+            let translate = Matrix3x3.translation(dx: -dx, dy: -dy)
             let rotate = Matrix3x3.rotation(angle: rotation)
-            let invTranslate = Matrix3x3.translation(dx: -dx, dy: -dy)
+            let invTranslate = Matrix3x3.translation(dx: dx, dy: dy)
             parameters.colorTransform = invTranslate * rotate * translate
             // Save the value to defaults
             defaults.colorRotation = rotation
diff --git a/MetaballsKit/Shaders.metal b/MetaballsKit/Shaders.metal
index ad1038a..b1ab61e 100644
--- a/MetaballsKit/Shaders.metal
+++ b/MetaballsKit/Shaders.metal
@@ -89,7 +89,8 @@ sampleToColorShader(RasterizerData in               [[stage_in]],
             out = singleColor(sample, target, feather, parameters.colors[0]);
             break;
         case Gradient2Horizontal: {
-            const float blend = in.position.x / parameters.size[0];
+            const float3 transformedColor = (parameters.colorTransform * float3(in.position.xy, 1.0));
+            const float blend = transformedColor.x / parameters.size[0];
             out = gradient2(sample, target, feather, blend, parameters.colors[0], parameters.colors[1]);
             break;
         }