Use CSS var names instead of hex codes for colors in inspect code view

Select a component, then click on the Inspect pane and look at the generated code. It will contain entries like:

/* gray-262_20/gray-262_20-33 */
background: #494C65;

Developers won’t use this code. They will use the CSS variable names as defined under Design – Color Styles.

Desired output:

background: var(--gray-262_20-33);

Please fix. Thanks.

4 Likes