FREE Web Template Download
HTML CSS JAVASCRIPT SQL PHP BOOTSTRAP JQUERY ANGULARJS TUTORIALS REFERENCES EXAMPLES Blog
 

Input Color value Property

Input Color Object Reference Input Color Object

Example

Change the color of a color picker:

document.getElementById("myColor").value = "#FF8040";
Try it Yourself »

Definition and Usage

The value property sets or returns the value of the value attribute of a color picker.

The value attribute specifies the color for the color picker.

Note: If nothing is specified, the default color is #000000 (black).


Browser Support

Property
value Yes 10.0 Yes Yes Yes

Note: The <input type="color"> element does not show any colorpicker in Internet Explorer and Safari.


Syntax

Return the value property:

colorObject.value

Set the value property:

colorObject.value=#hexvalue

Property Values

Value Description
#hexvalue Specifies a color for the color picker.

The value must be a hexadecimal (hex) value: 3 double digit numbers, starting with a # sign (like #FF8040).

Note: Color keywords (like "red" or "blue") are not allowed.

Note: Default color is #000000 (black).

Technical Details

Return Value: A String, representing a color

More Examples

Example

Get the color of a color picker:

var x = document.getElementById("myColor").value;

The result of x will be:

#ff0080
Try it Yourself »

Example

An example that shows the difference between the defaultValue and value property:

var x = document.getElementById("myColor");
var defaultVal = x.defaultValue;
var currentVal = x.value;
Try it Yourself »

Related Pages

HTML tutorial: HTML Colors

HTML tutorial: HTML Color Values (HEX)

HTML reference: HTML <input> value attribute


Input Color Object Reference Input Color Object