CSS to JS 스타일 객체 변환기

사용법

1. 입력 상자에 CSS 선언을 붙여넣습니다.
2. 각 속성은 camelCase로, 각 값은 문자열로 따옴표 처리됩니다.
3. 출력 상자에서 생성된 스타일 객체를 복사합니다.

자주 묻는 질문

속성 이름은 어떻게 변환되나요?

하이픈 속성은 camelCase가 됩니다(font-size → fontSize). 벤더 접두사는 React 규칙을 따릅니다: -webkit-는 Webkit, -ms-는 소문자 ms로 유지됩니다.

CSS 사용자 정의 속성은 어떻게 되나요?

--main-color 같은 변수는 이름을 유지하고 따옴표 키가 됩니다. React가 이를 그대로 적용하기 때문입니다.

값이 숫자로 변환되나요?

아니요. 모든 값은 따옴표 문자열로 출력되며 항상 유효합니다. 단위 없는 숫자 값을 원하면 따옴표를 직접 제거하세요.

제 CSS가 어딘가로 전송되나요?

아니요. 변환은 전적으로 브라우저에서 이루어지며 아무것도 업로드되지 않습니다.

관련 도구