<input> - color


HTML DOM Input Color object


Input Color object

The Input Color object is new in HTML5.

Input Color objects represent HTML <input> elements with the type="color" attribute.

Note: Internet Explorer or Safari browsers do not support the use of the type="color" attribute on the <input> element.

Access the Input Color object

You can use the getElementById() function to access <input> elements with the type="color" attribute:

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

 Try It! 

Tip: You can also access the Input Color object through the form's elements collection .

Create an Input Color object

You can use the document.createElement() method to create an <input> element with the type="color" attribute:

var x = document.createElement("INPUT");
x.setAttribute("type", "color");

 Try It! 

Input Color Object Attribute

AttributeDescription
autocompleteSets or returns the value of the autocomplete property of the color picker.
autofocusSets or returns whether the color picker gets focus when the page loads.
defaultValueSets or returns the default value of the color picker.
disabledSets or returns whether the color picker is available.
formReturns a reference to the form that contains the color picker.
listReturns a reference to the datalist containing the color picker.
nameSets or returns the value of the color picker name property.
typeReturns the form element type of the color picker.
valueSets or returns the value of the color picker's value property.

Standard Properties and Events

Input Color objects also support standard properties and events .


Related articles

HTML Tutorial: HTML Forms

HTML Reference Manual: HTML <input> Tag

HTML Reference Manual: HTML <input> type attribute