콘텐츠로 건너뛰기

CSS text-shadow 생성기

CSS text-shadow를 라이브 미리보기로 시각적으로 생성합니다. 다중 레이어 지원. 오프셋, 블러, 색상, 불투명도를 조정하세요. CSS 코드 복사. 무료, 100% 브라우저에서 실행.

미리보기

샘플 텍스트

CSS 출력

 

CSS text-shadow란?

text-shadow 속성은 텍스트에 그림자 효과를 추가합니다. 수평 오프셋, 수직 오프셋, 블러 반경, 색상의 4가지 값으로 정의됩니다. 쉼표로 구분하여 여러 그림자를 겹치면 빛남이나 네온 효과 등 복잡한 이펙트를 만들 수 있습니다.

구문

기본 구문text-shadow: offsetX offsetY blur color. 다중 그림자 — 쉼표로 구분하여 여러 그림자를 지정 가능. 먼저 작성한 그림자가 앞에 표시됩니다. 없음text-shadow: none으로 그림자를 비활성화.

디자인 팁

섬세한 그림자 — 작은 오프셋과 낮은 블러로 미묘한 입체감 연출. 빛남 효과 — 오프셋 0, 큰 블러 반경, 밝은 색상으로 네온 풍 효과. 레터프레스 — 1px 흰색 그림자를 아래에 배치하여 엠보싱 효과. 다중 레이어 — 여러 그림자를 겹쳐 풍부한 텍스트 이펙트 제작.

개인정보보호

모든 생성 처리는 브라우저에서 100% 실행됩니다. 데이터는 서버에 전송되지 않습니다.