I am trying to use a random color generated from an array to style various elements in my design. Specifically, I want to apply this color to certain elements but am unsure how to do so.
For example, I know how to make a heading red like this:
const element = <h1 style={{ color: 'red' }}>Hello world</h1>
However, I would like to dynamically assign the color variable like this (note: this code is incorrect, it's just for illustrative purposes)
const colorvar="red"
const element = <h1 style={{ color: {colorvar} }}>Hello world</h1>
If anyone has a solution or suggestion, please help me out.