그림자 생성기

박스 섀도우 가이드

상자 그림자는 조명과 고도를 시뮬레이션하여 UI 요소에 깊이를 추가합니다. 잘 디자인된 그림자는 시각적 계층 구조를 만들고 인터페이스가 더욱 촉각적인 느낌을 갖게 합니다.

수평 오프셋, 수직 오프셋, 흐림, 확산, 색상 및 불투명도를 조정합니다. 캔버스 미리보기는 실시간으로 업데이트됩니다. 만족스러우면 CSS 코드를 복사하세요.

Pro Tips

• 그림자를 미묘하게 유지하세요. 작은 흐림 값으로 시작하세요. 지나치게 큰 그림자는 부자연스러워 보입니다.
• 따뜻한 디자인에는 따뜻한 톤의 그림자(갈색 또는 호박색)를 사용하고, 현대적이거나 기술적인 디자인에는 차가운 톤(푸른색)을 사용하세요.