Skip to main content


dhtmlxColorPicker allows you to apply different languages to its interface. You just need to translate the corresponding strings for ColorPicker labels and tooltips and apply a ready locale to the component.

Default locale#

The default locale for ColorPicker looks like this:

var en = {    cancel: "Cancel",    select: "Select",    rightClickToDelete: "Right click to delete",    customColors: "Custom colors",    addNewColor: "Add new color"};

Custom locale#

To use a different locale, your need to:

  • define necessary language settings: provide translations for the labels of colors' elements in all available formats as well as for the buttons:
var de = {    cancel: "Abbrechen",    select: "Wählen",    rightClickToDelete: "Rechtsklick zu entfernen",    customColors: "Seine Farben",    addNewColor: "Neue Farbe hinzufügen"}
  • apply the language settings by calling the dhx.i18n.setLocale() method before ColorPicker initialization:
dhx.i18n.setLocale("colorpicker", de);var colorpicker = new dhx.ColorPicker();

Related sample: Colorpicker. Localization