I'm wondering how I can set the color of this text:
<p style="font-size: 30px; color: #222;" class="txt>Text example</p>
to the value selected on this color wheel:
<input type="color" value="#f6f82" id="colorPicker">
If the value of the color wheel changes, the text should adjust so the color is set to the value of the color wheel, how can this be done?
It's just a matter of updating the style of text onchange of input.
add onchange attribute to the input field which can call a JavaScript method.
Define the JS method to get the value from input and set the text style.
const setTextColor = (value) => {
document.querySelector('.txt').style.color = value;
};
<input type="color" value="#f6f82" id="colorPicker" onchange=setTextColor(value)>
<p style="font-size: 30px; color: #222;" class="txt">Text example</p>