diff --git a/h2d/domkit/BaseComponents.hx b/h2d/domkit/BaseComponents.hx
index ac71067fa8..1489b07101 100644
--- a/h2d/domkit/BaseComponents.hx
+++ b/h2d/domkit/BaseComponents.hx
@@ -351,6 +351,33 @@ class CustomParser extends domkit.CssValue.ValueParser {
 		}
 	}
 
+	public function transitionColorAdjust(col1: h3d.Matrix.ColorAdjust, col2: h3d.Matrix.ColorAdjust, t: Float) {
+		inline function defaultValues(col: h3d.Matrix.ColorAdjust) {
+			var c : h3d.Matrix.ColorAdjust = { saturation: 0, lightness: 0,	hue: 0,	contrast: 0, gain: { color: 0, alpha: 0 } };
+			if (col != null) {
+				if (col.saturation != null) c.saturation = col.saturation;
+				if (col.lightness != null) c.lightness = col.lightness;
+				if (col.hue != null) c.hue = col.hue;
+				if (col.contrast != null) c.contrast = col.contrast;
+				if (col.gain != null) c.gain = col.gain;
+			}
+			return c;
+		}
+
+		var col1 = defaultValues(col1);
+		var col2 = defaultValues(col2);
+		return {
+			saturation: hxd.Math.lerp(col1.saturation, col2.saturation, t),
+			lightness: hxd.Math.lerp(col1.lightness, col2.lightness, t),
+			hue: hxd.Math.lerp(col1.hue, col2.hue, t),
+			contrast: hxd.Math.lerp(col1.contrast, col2.contrast, t),
+			gain: {
+				color: transitionColor(col1.gain.color, col2.gain.color, t),
+				alpha: hxd.Math.lerp(col1.gain.alpha, col2.gain.alpha, t)
+			}
+		};
+	}
+
 	public function parseColorAdjust(value:CssValue) : h3d.Matrix.ColorAdjust {
 		if( value.match(VIdent("none")) )
 			return null;
@@ -578,7 +605,7 @@ class DrawableComp extends ObjectComp implements domkit.Component.ComponentDecl<
 
 	@:p(colorF) @:t(colorF) #if domkit_drawable_color var color #else var tint #end : h3d.Vector4;
 	@:p(auto) var smooth : Null<Bool>;
-	@:p(colorAdjust) var colorAdjust : Null<h3d.Matrix.ColorAdjust>;
+	@:p(colorAdjust) @:t(colorAdjust) var colorAdjust : Null<h3d.Matrix.ColorAdjust>;
 	@:p var tileWrap : Bool;
 
 	static function #if domkit_drawable_color set_color #else set_tint #end( o : h2d.Drawable, v ) {