messagesObject
Allows localization of the strings that are used in the widget.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
messages: {
apply: "Update",
cancel: "Discard"
}
})
</script>
messages.applyString
(default: "Apply")
Allows customization of the "Apply" button text.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
messages: {
apply: "Update"
}
})
</script>
messages.cancelString
(default: "Cancel")
Allows customization of the "Cancel" button text.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
messages: {
cancel: "Discard"
}
})
</script>
messages.clearColorString
(default: "Clear color")
Allows customization of the Clear Color button label.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
clearButton: true,
messages: {
clearColor: "Remove Color"
}
});
</script>
messages.previewInputString
Overrides the messages.hex property. Legacy option.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
messages: {
previewInput: "Edit Color"
}
})
</script>
messages.contrastRatioString
(default: "Contrast ratio")
Allows customization of the "Contrast ratio" text in the contrast tool.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
contrastTool: true,
messages: {
contrastRatio: "Color Contrast"
}
});
</script>
messages.failString
(default: "Fail")
Allows customization of the "Fail" text in the contrast tool.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
contrastTool: true,
messages: {
fail: "Poor"
}
});
</script>
messages.passString
(default: "Pass")
Allows customization of the "Pass" text in the contrast tool.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
contrastTool: true,
messages: {
pass: "Good"
}
});
</script>
messages.gradientString
(default: "Gradient view")
Allows customization of the Gradient view button.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
views: ["gradient", "palette"],
messages: {
gradient: "Color Gradient"
}
});
</script>
messages.paletteString
(default: "Palette view")
Allows customization of the Palette view button.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
views: ["gradient", "palette"],
messages: {
palette: "Color Palette"
}
});
</script>
messages.toggleFormatString
(default: "Toggle format")
Allows customization of the toggle format button's title in the Gradient's input editor.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
messages: {
toggleFormat: "Switch Format"
}
});
</script>
messages.redString
(default: "Red")
Allows customization of the rgb's red input's aria-label in the Gradient's input editor.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
format: "rgb",
messages: {
red: "Red Component"
}
});
</script>
messages.greenString
(default: "Green")
Allows customization of the rgb's green input's aria-label in the Gradient's input editor.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
format: "rgb",
messages: {
green: "Green Component"
}
});
</script>
messages.blueString
(default: "Blue")
Allows customization of the rgb's blue input's aria-label in the Gradient's input editor.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
format: "rgb",
messages: {
blue: "Blue Component"
}
});
</script>
messages.alphaString
(default: "Alpha")
Allows customization of the rgb's alpha input's aria-label in the Gradient's input editor.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
opacity: true,
messages: {
alpha: "Transparency"
}
});
</script>
messages.hexString
(default: "HEX")
Allows customization of the hex input's aria-label in the Gradient's input editor.
Example
<input id="colorpicker" type="color" />
<script>
$("#colorpicker").kendoColorPicker({
format: "hex",
messages: {
hex: "Hexadecimal"
}
});
</script>