Tailwind 클래스 변환기
CSS 선언이나 Tailwind 클래스를 붙여 넣고 방향을 선택한 뒤 각 항목의 매핑과 미매칭 결과를 확인하세요.
선언이나 클래스를 붙여 넣고 변환하세요.
매핑됨
미매칭
내장 Tailwind v4 하위 집합만 사용하며 사용자 테마와 v3 차이는 읽지 않습니다.
사용 방법
사용 방법
- CSS 선언이나 Tailwind 클래스를 붙여 넣습니다.
- 변환 방향과 임의 값 또는 px-to-rem 옵션을 선택합니다.
- 각 매핑과 미매칭 항목을 확인한 뒤 결과를 복사합니다.
제한된 Tailwind v4 매핑
일반적인 간격, 색상, 타이포그래피, 표시, flex, grid, 테두리, 둥근 모서리, 그림자, 위치 선언을 로컬에서 매핑합니다. 사용자 테마와 Tailwind v3 차이는 읽지 않습니다.
조용히 누락하지 않음
모든 선언과 클래스를 매핑됨 또는 미매칭으로 표시합니다. 지원되지 않는 값은 p-[13px] 같은 임의 값 유틸리티로 출력할 수도 있습니다.
로컬 처리
파싱과 변환은 브라우저에서 실행됩니다. 스타일시트, 프로젝트 설정 또는 붙여 넣은 내용을 업로드하지 않습니다.
자주 묻는 질문
더 알아보기
tailwind.config를 불러오나요?
아니요. 사용자 테마나 Tailwind v3 차이는 읽지 않으며 내장 매핑은 Tailwind v4의 일부입니다.
지원되지 않는 선언은 버려지나요?
아니요. 미매칭 목록에 남으며 속성이 지원되는 경우 임의 값을 사용할 수 있습니다.
전체 스타일시트를 변환할 수 있나요?
선언 행과 클래스 토큰은 받지만 선택자, 중첩 규칙, 전체 스타일시트는 처리하지 않습니다.