I wrote this code yesterday and I noticed that input type color value attribute value does not work with direct color name.But work fine with hex value. Why?
<! --- Not Working--->
<input type="color" value="red">
<! --- Working --->
<input type="color" value="#ff0000">
Because the specification requires it.
The value attribute, if specified and not empty, must have a value that is a valid simple color.
A string is a valid simple color if it is exactly seven characters long, and the first character is a U+0023 NUMBER SIGN character (#), and the remaining six characters are all ASCII hex digits, with the first two digits representing the red component, the middle two digits representing the green component, and the last two digits representing the blue component, in hexadecimal.
<input type="color" value="red"> //Incorrect format value="red"
<input type="color" value="#ff0000"> //Correct format value="#ff0000"
The value must be in seven-character hexadecimal notation, meaning the "#" character followed by two digits each representing red, green, and blue, like this: #rrggbb. If you have colors that are in any other format (such as CSS color names or CSS color functions such as rgb() or rgba()), you'll have to convert them to hexadecimal before setting the value.