<script src="//msrt-integration-api.fittingbox.com/index.js" type="text/javascript"></script>

<div class='wrapper'>
<div id="msrt-container"></div>
</div>
#msrt-container {
  width:350px;
  height:700px;
}

.wrapper{
  padding-top:5rem;
  display: grid;
  place-content : center;
}
const mainColor = document.getElementById('mainColor'); 
const buttonTextColor = document.getElementById('buttonTextColor'); 
const instructionColor = document.getElementById('instructionColor'); 
const colorWrong = document.getElementById('colorWrong'); 
const colorMid = document.getElementById('colorMid'); 
const colorValid = document.getElementById('colorValid'); 


const params = {
  apiKey: "SQ_cbzexAd-qSl_fq9tMt16h4PL6LYjc6vi5TZIQQy_rKFDywr29rA",
};

window.onload = function () {
  fitmixInstance = Msrt.createWidget("msrt-container",
    {...params,
    onGetResultPd: (result) => console.log('onGetResultPd: ', result),
    onTooManyErrors: () => console.log('onTooManyErrors')});
};
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.