Tailwind 클래스를 넣었는데 스타일이 안 먹을 때

이런 증상이라면

className="bg-red-500" 같은 걸 넣었는데 화면에 전혀 반영이 안 됩니다. 어떤 클래스는 되고 어떤 클래스는 무시되기도 합니다.

흔한 원인 (가능성 순)

1Tailwind가 그 파일을 스캔 목록에 안 넣었다코드

tailwind.config의 content 경로에 해당 파일 위치가 없으면, Tailwind가 그 클래스를 "안 쓰는 것"으로 보고 최종 CSS에서 빼버립니다.

2클래스명을 문자열로 조립했다코드

`bg-${color}-500`처럼 동적으로 만들면 Tailwind가 빌드 시점에 그 클래스를 못 찾아 생성하지 않습니다. 완성된 클래스명을 그대로 써야 합니다.

3다른 CSS나 우선순위에 밀렸다코드

전역 CSS·컴포넌트 라이브러리 스타일이 더 강해 덮어쓰거나, 클래스 충돌로 무시될 수 있습니다.

개발 중엔 됐는데 배포하면 스타일이 사라져요.

content 경로 누락이 배포(프로덕션 빌드)에서만 드러나는 전형적 증상입니다. 안 쓰는 걸로 판단해 빼버리기 때문이며, 경로를 정확히 넣으면 해결됩니다.

동적으로 색을 바꾸고 싶은데요.

완성된 클래스명들을 미리 매핑해두고 그중에서 고르거나, 인라인 style을 쓰는 방식이 안전합니다.

위를 다 해봤는데도, 또는 AI(Cursor·Claude)한테 물어봐도 계속 같은 에러라면 — 에러 로그를 붙여넣으면 60초 안에 진짜 원인을 짚어드려요.