Black Lives Matter. Please consider donating to Black Girls Code today.

Color of "name" field in popup

An example plot data is:

  var trace2 = {
      x: ['Product A', 'Product B', 'Product C'],
      y: [30, 34, 33],
      type: 'scatter',
      text: ['27% market share', '24% market share', '19% market share'],
      name: 'TEST 2',
      marker: {
          color: 'rgb(158,202,225)',
          opacity: 1.0

when I hover over a marker on the figure I see the ‘TEST 2’ beside it but it is in the same color as the marker. How can I make that text black (rather than the marker color)?

I tried the textfont dictionary keyword but it didn’t let me change the “name” color. I also tried changing the font dictionary keyword and it didn’t do what I wanted.


That’s no way to change the hover labels fonts - unfortunately.

I’d recommend subscribing to for the latest development info.