Pagebuilder field type color

field_color.tpl

<div class="field type-<?= $field['type'] ?>" data-field="<?= $name ?>">
    <?php if (!empty($field['caption'])): ?> 
        <div class="field-name"><?= $field['caption'] ?></div>
    <?php endif; ?> 

	<input type="text" <?php if($value){ echo('style="background-color:'.$value.'"'); } ?> name="contentblocks_<?= $name ?>" value="<?= htmlentities($value) ?>" oninput="this.setAttribute('value', this.value)" onfocus="this.setAttribute('type', 'color')" onblur="this.setAttribute('type', 'text'); this.style.backgroundColor=this.value">

    <?php if (!empty($field['note'])): ?> 
        <div class="field-note"><?= $field['note'] ?></div>
    <?php endif; ?>
</div>

Place .tpl in assets/plugins/pagebuilder/tpl
Use in pagebuilder config like any text field

'hex' => [
                'caption' => 'Цвет',
                'type'    => 'color',
            ],