Using ACF Color Picker field values in facet choices

<?php
// If you are using an ACF Color Picker field as facet data source,
// you can use the color value (hex or rgb(a)) to give a (background) color to the facet choice.
// It is important to use the facet_display_value for the color, and not the facet_value, 
// because the facet_value will be hashed into a random string of numbers due to unsafe URL characters.
// Note: for fSelect facets, you need to use esc_html() around the label output in L11, otherwise the HTML will be stripped out.
// More info: https://facetwp.com/help-center/using-facetwp-with/advanced-custom-fields/#using-a-color-picker-field

add_filter( 'facetwp_facet_display_value', function( $label, $params ) {
  if ( 'my_color_facet' == $params['facet']['name'] ) { // Replace 'my_color_facet' with the name of your color picker based facet.
    $val = $params['row']['facet_display_value']; // Use the display value here to get the unhashed hex or rgb(a) color value.
    $label = '<span style="background-color:' . $val . ';">' . $label . '</span>'; // Add a span to the facet choice with the color as CSS background color.
  }
  return $label;
}, 20, 2 );