Use a small offset and soft blur for a quiet surface shadow.
로컬 CSS box-shadow 생성기
실시간 미리보기로 CSS box-shadow를 만드세요
두 개의 그림자 레이어를 조정하고 카드에서 결과를 확인한 뒤 인터페이스에 쓸 box-shadow CSS를 복사하세요.
* 모든 처리는 브라우저에서 진행됩니다. 그림자 값은 업로드되지 않습니다.
CSS 준비 완료
box-shadow: 0px 12px 28px 0px rgba(23, 32, 29, 0.18);ShadowBox
QUICK GUIDE
레이어 하나씩 깊이를 만드세요
Add a second, lighter layer when one shadow cannot describe the depth you want.
Use negative spread to keep a soft shadow close to the component edge.
Try inset for pressed controls or an inner border effect.
FAQ
Box-shadow questions
What is the order of box-shadow values?
The output uses optional inset, X offset, Y offset, blur radius, spread radius, and color.
Why use two layers?
Multiple shadows can create a more natural elevation by combining a close dark edge with a wider soft shadow.
Does ShadowBox change my page?
No. The preview is local to this page and the generated declaration is plain CSS you can copy.