Dynamic CSS in WordPress

functions.php

<?php
/**
 * Load dynamic CSS stylesheet in WordPress. There are 4 steps:
 *
 * 1. Enqueue dynamic stylesheet on front end or add inline CSS if in Customizer.
 * 2. Get the dynamic CSS with AJAX calls.
 * 3. Generate CSS using PHP variables.
 * 4. Minify CSS after before loading.
 */

add_action( 'wp_enqueue_scripts', 'prefix_dynamic_css_output' );
/**
 * Enqueues dynamic CSS on frontend or adds inline styles if in Customizer.
 *
 * @since  1.0.0
 *
 * @return void
 */
function prefix_dynamic_css_output() {
	$handle = 'prefix';

	if ( is_customize_preview() ) {
		
		// Add inline styles if in Customizer.
		$css = prefix_generate_css();
		wp_register_style( $handle, false );
		wp_enqueue_style( $handle );
		wp_add_inline_style( $handle, $css );

	} else {
		
		// Load external stylesheet.
		wp_enqueue_style(
			$handle,
			admin_url( 'admin-ajax.php' ) . '?action=prefix_dynamic_css&wpnonce=' . wp_create_nonce( 'dynamic-css-nonce' ),
			[],
			'1.0.0',
			'all'
		);
	}
}

add_action( 'wp_ajax_prefix_dynamic_css', 'prefix_dynamic_css' );
add_action( 'wp_ajax_nopriv_prefix_dynamic_css', 'prefix_dynamic_css' );
/**
 * Load the dynamic CSS with ajax (if nonce is ok).
 *
 * @since 1.0.0
 *
 * @return void
 */
function prefix_dynamic_css() {
	$nonce = $_REQUEST['wpnonce'];

	if ( ! wp_verify_nonce( $nonce, 'dynamic-css-nonce' ) ) {
		die( esc_html__( 'Invalid nonce.', 'textdomain' ) );

	} else {
		header( 'Content-type: text/css; charset: UTF-8' );
		echo prefix_generate_css();
	}

	exit;
}

/**
 * Generates the CSS output.
 *
 * Uses HEREDOC string to make it easier to add PHP variables in CSS string.
 *
 * @since 1.0.0
 *
 * @return string
 */
function prefix_generate_css() {
	$body_background_color = get_option( 'body_background_color', 'blue' );

	$css = <<<CSS
body {
	background-color: $body_background_color !important;
}
CSS;

	return prefix_minify_css( $css );
}

/**
 * Quick and dirty way to mostly minify CSS with PHP.
 *
 * @since  1.0.0
 * @author Gary Jones
 *
 * @param string $css CSS to minify.
 *
 * @return string Minified CSS
 */
function prefix_minify_css( $css ) {
	$css = preg_replace( '/\s+/', ' ', $css );
	$css = preg_replace( '/(\s+)(\/\*(.*?)\*\/)(\s+)/', '$2', $css );
	$css = preg_replace( '~/\*(?![\!|\*])(.*?)\*/~', '', $css );
	$css = preg_replace( '/;(?=\s*})/', '', $css );
	$css = preg_replace( '/(,|:|;|\{|}|\*\/|>) /', '$1', $css );
	$css = preg_replace( '/ (,|;|\{|}|\(|\)|>)/', '$1', $css );
	$css = preg_replace( '/(:| )0\.([0-9]+)(%|em|ex|px|in|cm|mm|pt|pc)/i', '${1}.${2}${3}', $css );
	$css = preg_replace( '/(:| )(\.?)0(%|em|ex|px|in|cm|mm|pt|pc)/i', '${1}0', $css );
	$css = preg_replace( '/0 0 0 0/', '0', $css );
	$css = preg_replace( '/#([a-f0-9])\\1([a-f0-9])\\2([a-f0-9])\\3/i', '#\1\2\3', $css );

	return trim( $css );
}

See https://github.com/seothemes/dynamic-stylesheet for an improved version.