Title: WP_Theme_JSON::convert_custom_properties
Published: August 8, 2023
Last modified: February 24, 2026

---

# WP_Theme_JSON::convert_custom_properties( string $value ): string

## In this article

 * [Description](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#description)
 * [Parameters](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#parameters)
 * [Return](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#return)
 * [Source](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#source)
 * [Related](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#related)
 * [Changelog](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#changelog)

[ Back to top](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#wp--skip-link--target)

This function’s access is marked private. This means it is not intended for use 
by plugin or theme developers, only by core. It is listed here for completeness.

This is used to convert the internal representation of variables to the CSS representation.

## 󠀁[Description](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#description)󠁿

For example, `var:preset|color|vivid-green-cyan` becomes `var(--wp--preset--color--
vivid-green-cyan)`.

## 󠀁[Parameters](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#parameters)󠁿

 `$value`stringrequired

The variable such as var:`preset|color|vivid`-green-cyan to convert.

## 󠀁[Return](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#return)󠁿

 string The converted variable.

## 󠀁[Source](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#source)󠁿

    ```php
    private static function convert_custom_properties( $value ) {
    	$prefix     = 'var:';
    	$prefix_len = strlen( $prefix );
    	$token_in   = '|';
    	$token_out  = '--';
    	if ( str_starts_with( $value, $prefix ) ) {
    		$unwrapped_name = str_replace(
    			$token_in,
    			$token_out,
    			substr( $value, $prefix_len )
    		);
    		$value          = "var(--wp--$unwrapped_name)";
    	}

    	return $value;
    }
    ```

[View all references](https://developer.wordpress.org/reference/files/wp-includes/class-wp-theme-json.php/)
[View on Trac](https://core.trac.wordpress.org/browser/tags/6.9.4/src/wp-includes/class-wp-theme-json.php#L4289)
[View on GitHub](https://github.com/WordPress/wordpress-develop/blob/6.9.4/src/wp-includes/class-wp-theme-json.php#L4289-L4304)

## 󠀁[Related](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#related)󠁿

| Used by | Description | 
| [WP_Theme_JSON::resolve_custom_css_format()](https://developer.wordpress.org/reference/classes/wp_theme_json/resolve_custom_css_format/)`wp-includes/class-wp-theme-json.php` |

Given a tree, converts the internal representation of variables to the CSS representation.

  |

## 󠀁[Changelog](https://developer.wordpress.org/reference/classes/wp_theme_json/convert_custom_properties/?output_format=md#changelog)󠁿

| Version | Description | 
| [6.3.0](https://developer.wordpress.org/reference/since/6.3.0/) | Introduced. |

## User Contributed Notes

You must [log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fdeveloper.wordpress.org%2Freference%2Fclasses%2Fwp_theme_json%2Fconvert_custom_properties%2F)
before being able to contribute a note or feedback.