디자인
CSS 박스 그림자 생성기
박스 그림자 시각적 디자인
사용 방법
프리셋 또는 단일 레이어로 시작한 후, 깊이를 위한 레이어를 추가하세요. inset을 토글하여 눌린/뉴모픽 효과를 적용하세요. 쉼표로 구분된 값을 box-shadow에 복사하세요.
FAQ
여러 그림자를 겹칠 수 있나요?
예. 레이어를 추가해 부드러운 주변 그림자와 선명한 접촉 그림자를 결합하거나 색상 글로우를 겹칠 수 있습니다. 각 레이어에는 별도의 오프셋, 흐림, 확산, 색상 및 inset 전환 옵션이 있습니다.
프리셋은 어떤 기능을 하나요?
원클릭 시작점으로 Stripe 스타일 카드 입체감, 뉴모피즘 돌출/눌림, Material 깊이, 부드러운 글로우를 제공합니다. 적용한 뒤 슬라이더로 조정하세요.
출력은 어떻게 사용하나요?
box-shadow 줄을 CSS에 복사하세요. 여러 레이어는 브라우저가 요구하는 형식 그대로 쉼표로 구분됩니다.
마지막 업데이트: