title: Color transition Framerjs
body: <p>I want to create a seamless transition between two background colors using Framer.js</p>
  
  <p>I have tried below code which moves the white square 500px and then when it reaches the end it switch instantly to "red". No smooth transition of the color.</p>
  
  <p>Any ideas on how to solve this? </p>
  
  <pre><code>layerA=new Layer()
  
  layerA.states.add
      first: {backgroundColor:"#ffffff"}
  
  layerA.states.add
      second: {backgroundColor:"red",x:500}
  
  layerA.states.switchInstant("first")
  layerA.states.switch("second")
  </code></pre>