### HTML

    <script src="https://cdn.jsdelivr.net/npm/a-color-picker@1.2.1/dist/acolorpicker.min.js"></script>
    <textarea id="editor"></textarea>

### JavaScript

    const editor = new Jodit('#area_editor', {
      buttons: 'brush'
    });

    // After open will add custom buttn in default color-picker
    editor.e.on('afterGenerateColorPicker', (form, extra) => {
      // Make button
      const elm = editor.create.fromHTML('<button class="jodit-ui-button">Custom</button>');
      Jodit.ns.Dom.detach(extra);

      extra.appendChild(elm);

      //
      let selectedColor = null;
      //
      elm.addEventListener('click', () => {
        // On Click - show dialog witch color-pciker
        const dialog = Jodit.Alert('', 'Select custom color', () => {
          // On Ok apply this color
          if (!selectedColor) {
            return;
          }
          //
          const style = new Jodit.ns.Style({
            style: {
              color: Jodit.ns.Helpers.colorToHex(selectedColor)
            }
          });
          //
          style.apply(editor);
        });
        // Init custom color picker for dialog's content element
        AColorPicker
          .from(dialog.dialogbox_content.firstChild)
          .on('change', (picker, color) => {
            selectedColor = color;
          });
      });
    });