JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://labrador.is/media/media/flower.js%20demos/js/RequestAnimationFrame.js"></script>
<script src="http://bgrins.github.io/TinyColor/tinycolor.js"></script>
<script src="http://sole.github.io/tween.js/build/tween.min.js"></script>

JavaScript

var from = {x: 0, y: {a: 0, b: 0}, z:[0, 0], color: "#000000"};
var to = {x: 10, y: {a: 20, b: 30}, z:[40, 50], color: "#ffffff"};
var speed = 2000;
var easing = TWEEN.Easing.Linear.None;
var delay = 0;
tweenWithObjectArrayAndColorSupport(from, to, speed, easing, delay);

function tweenWithObjectArrayAndColorSupport(from, to, speed, easing, delay) {
	var outFromTo = tweenSeperate(from, to); //Seperate the colors, array objects, and objects
											 //from the "from" and "to" objects.

	//Tween the remainder
	new TWEEN.Tween( from )
		.to( to, speed )
		.easing( easing )
		.delay(delay)
		.start();

	//Create Tweens for the separated values
	for (type in outFromTo.from) {
		for (attr in outFromTo.from[type]) {
			var vals = {"attr": attr, "type": type};
			createTween(vals, outFromTo.from[type][attr], outFromTo.to[type][attr], speed, easing, delay);
		}
	}
}

function tweenSeperate(from, to) {
	var vals = {};
	var objs = [from, to];
	for (o in objs) {
		var outColors = {};
		var outObjects = {};
		var outArrays = {};
		for (a in objs[o]) {
			if (typeof objs[o][a] == "string") {
				if (/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(objs[o][a])) {
					var t = tinycolor(objs[o][a])
					outColors[a] = t.toHsv();
					delete objs[o][a];
				}
			}
			if (Object.prototype.toString.call(objs[o][a]) == "[object Object]") {
				outObjects[a] = objs[o][a];
				delete objs[o][a];
			} else if (Object.prototype.toString.call(objs[o][a]) == "[object Array]") {
				outArrays[a] = {};
				var array = objs[o][a];
				delete objs[o][a];
				for (val in array) {
					outArrays[a][val] = array[val];
				}
			}
		}
		if (o == "0") vals.from = {"colors": outColors, "objects": outObjects, "arrays": outArrays};
		else vals.to = {"colors": outColors, "objects": outObjects, "arrays": outArrays};
	}
	return vals;
}

function createTween(vals, f, t, speed, easing, delay) {
	new TWEEN.Tween( f )
		.to( t, speed )
		.easing( easing )
		.onUpdate( function() {
			if (vals.type == "objects"...