Converts piped "preset" colors from global styles to their var() equivalents.

jt-format-color-preset.php

<?php

// Converts piped "preset" colors from global styles to their var() equivalents.
// Borrowed from `wp_render_elements_support_styles()`
function jt_format_color_preset( $color ) {
	
	if ( strpos( $color, 'var:preset|color|' ) !== false ) {
		$index = strrpos( $color, '|' ) + 1;
		$name  = substr( $color, $index );
		$color = "var(--wp--preset--color--$name)";
	}

	return esc_html( $color );
}

Usage:

background-color: <?= jt_format_color_preset( wp_get_global_styles( [ 'background', 'color' ] ) ) ?>;

// outputs:
// color: var( --wp--preset--color--{$name} );