CSS와 Tailwind 비교
클래식 CSS는 복잡한 선택자와 애니메이션에 강합니다. Tailwind는 시각 결정을 마크업 옆에 둡니다. 대부분 팀은 둘 다 씁니다.
기존 CSS와 Tailwind는 경쟁이 아니라 강점이 다른 도구입니다. 복잡한 선택자와 애니메이션은 CSS가, 시각적 판단을 마크업 옆에 두는 일은 Tailwind가 낫습니다. 경계에 놓인 부분은 팀 상황에 맞춰 판단하세요.
CSS에 남을 때
복잡한 애니메이션, print, 많은 노드를 가로지르는 선택자는 CSS가 편한 경우가 많습니다. Tailwind는 마크업과 스타일이 함께 움직이는 컴포넌트 UI에서 빛납니다.
싸우지 않고 비교하기
전역 reset이 아니라 card나 toolbar를 번역하세요. 변환기 메모를 읽고 토큰·임의값·수동 CSS를 고르세요.
팀 기준
페이지 전체를 옮기기 전에 스케일과 예외를 합의하세요. “대결”은 운영 문제이지 신앙이 아닙니다.
사용해보기
.example { display: flex; gap: 1rem; padding: 1rem; }
신뢰 메모: 결과를 시각적으로 확인하세요. 변환기는 초안용 도우미입니다.