Custom Field for Selecting Color per post.
Meta key is “color_meta_key”

function color_add_meta_box() {
$posttypes = ['post']; // you can add multiple post types here with commas '',''
foreach ($posttypes as $posttype) {
add_meta_box(
'color_meta_box_id',
'Color Meta Box',
'color_meta_box_html',
$posttype
);
}
}
add_action('add_meta_boxes', 'color_add_meta_box');
function load_color_picker_script() {
wp_enqueue_style( 'wp-color-picker' );
wp_enqueue_script( 'wp-color-picker' );
add_action( 'admin_footer', 'color_picker_init_script' );
}
add_action( 'admin_enqueue_scripts', 'load_color_picker_script' );
function color_meta_box_html($post) {
wp_nonce_field('color_meta_box_nonce', 'color_custom_nonce');
$value = get_post_meta($post->ID, 'color_meta_key', true);
echo '<label for="color_field">Color : </label> <br>';
echo '<input type="text" id="color_field" name="color_field" value="' . esc_attr($value) . '" class="my-color-field" />';
}
function color_picker_init_script() {
?>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('.my-color-field').wpColorPicker();
});
</script>
<?php
}
function color_save_postdata($post_id) {
if (!isset($_POST['color_custom_nonce'])) {
return;
}
if (!wp_verify_nonce($_POST['color_custom_nonce'], 'color_meta_box_nonce')) {
return;
}
if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
return;
}
if (isset($_POST['post_type']) && !current_user_can('edit_post', $post_id)) {
return;
}
if (!isset($_POST['color_field'])) {
return;
}
$my_data = sanitize_hex_color($_POST['color_field']);
update_post_meta($post_id, 'color_meta_key', $my_data);
}
add_action('save_post', 'color_save_postdata');
Check this Metabox PHP Code Generator if you need it https://sinanisler.com/codex/create-custom-metabox-for-wordpress-post-types/
Recently made this code for the WooCommerce site for our agency geopard digital client.