CSS 그림자에서 Tailwind로
일반 그림자 → shadow / shadow-lg. 고유 그림자 → arbitrary.
자주 쓰는 그림자는 대응이 분명합니다. 은은한 높이는 shadow, 뚜렷한 입체감은 shadow-lg입니다. 여러 겹이거나 색이 들어간 브랜드 그림자는 임의 값이 되므로 원본과 나란히 놓고 확인하세요.
스케일 그림자
부드러운 box-shadow는 대개 shadow / shadow-md입니다. 단계가 많은 브랜드 그림자는 대개 shadow-[…]입니다.
필터
drop-shadow와 filter는 항상 1:1이 아닙니다. 유틸리티를 강요하기 전에 메모를 읽으세요.
정직한 elevation
변환기가 검토를 요청하면 “가장 가까운 shadow” 대신 brackets로 정확한 값을 유지하세요.
사용해보기
.example { display: flex; gap: 1rem; padding: 1rem; }
신뢰 메모: 결과를 시각적으로 확인하세요. 변환기는 초안용 도우미입니다.