Color Pickers in HTML allow the user to select and input a color.
Once submitted, the browser converts the input color into a string that represents it.
To add a color picker in an HTML page, use an <input>
tag with type = 'color'
.
The initial value can be set using the value
property. This value needs to be set in hexadecimal because colors are represented as six-digit hexadecimal values following a hashtag (#
). The first two digits represent the red component, followed by two for the green component, and then the last two for the blue component. These components represent a full RGB color. Following this format, #ff0000
is red, #00ff00
is green, #0000ff
is blue, and ##ffffff
is white. These three colors can be mixed to get more colors. For instance, #bdaa55
gives us a brownish shade.
The default color will be black or
#000000
if no initial value is entered.
This example demonstrates the usage of the <input type = 'color'>
tag. The initial value is set as #0000ff
, i.e., blue.