사용 방법
- 분할 제어를 사용하여 box-shadow와 drop-shadow 모드 사이를 선택하세요.
- 첫 번째 그림자 레이어에 대해 X 오프셋, Y 오프셋, blur, 확산, 색상을 조정하세요.
- '+ 레이어'를 클릭하여 여러 그림자를 쌓고 각각을 독립적으로 구성하세요.
- 라이브 그림자 미리보기 상자에서 결합된 효과를 미리보세요.
- 생성된 CSS 선언을 출력 섹션에서 복사하여 스타일시트에 붙여넣으세요.
예제
- offsetY=4, blur=12, 확산=0, 색상=rgba(0,0,0,0.15)를 설정하면 표준 카드 그림자를 생성합니다: box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.15).
- offsetY=1, blur=3, 색상=rgba(0,0,0,0.08)로 두 번째 레이어를 추가하면 material 스타일 UI에서 인기 있는 계층식 깊이 효과가 생성됩니다.