CSS to JS Object: Free Online Converter

About CSS to JS Object Converter

Our free online tool facilitates the seamless conversion of raw CSS into React style JavaScript objects. With this tool, users can instantly convert CSS code into the equivalent React style object for inline styling in React applications.

How to Use?

• Enter the CSS code in the input box.
• If you want to strip the units such as "px", "rem" from numberic values, check the checkbox below, otherwise leave it as it is.
• Click on the Convert button.
• Copy the converted React style object.
• Click on the reset button to clear the input and try again.

Sample CSS Input 1

.selector {
  background-color: red;
  margin: 5px;
}

Sample CSS Input 2

Without the selector.

background-color: red; margin: 5px;

Sample JS Object Output 1

Without choosing Remove units from number value option.

{".selector":{"backgroundColor":"red","margin":"5px"}}

Sample JS Object Output 2

With Remove units from number value option.

{".selector":{"backgroundColor":"red","margin":5}}