JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id="myDiv"></div>

JavaScript

var trace1 = {
  type: 'scatter',
  mode: 'markers',
  y: [2, 1, 3],
  marker: {
    size: 20,
    color: [1, 2, 3],
    showscale: true
  },
  error_y: {
     type:'data',
     array: [0.5, 0.7, 0.5],
     color: [1, 2, 3]
  }
}

function update_errorbars() {
    // get colors from data points
    rgbs = Plotly.d3.selectAll('.points .point').data().map(d => d.mcc)

    // apply colors to errorbars
    Plotly.d3.selectAll('.yerror').style('stroke', (d,i) => rgbs[i])
}


Plotly.newPlot('myDiv', [trace1])

myDiv.on('plotly_relayout', update_errorbars)

update_errorbars()