CSS 글래스모피즘 생성기
CSS 글래스모피즘(유리 효과)을 라이브 미리보기로 생성합니다. 블러, 불투명도, 배경색, 보더, 그림자를 조정하세요. CSS 코드 복사. 무료, 100% 브라우저에서 실행.
미리보기
Glassmorphism
10px
20%
30%
CSS 출력
참고
글래스모피즘이란?
글래스모피즘은 반투명 유리 같은 효과를 가진 UI 디자인 스타일입니다. backdrop-filter: blur()를 사용하여 배경을 흐리게 하고, 반투명 배경색과 미묘한 보더를 결합하여 유리 같은 외관을 만들어냅니다.
브라우저 지원
backdrop-filter는 모든 주요 최신 브라우저에서 지원됩니다. Chrome, Edge, Safari, Firefox의 최신 버전에서 사용 가능합니다. 오래된 브라우저를 위해 @supports 규칙을 사용하여 반투명 배경색으로 폴백하는 것을 권장합니다.
개인정보보호
모든 생성 처리는 브라우저에서 100% 실행됩니다. 데이터는 서버에 전송되지 않습니다.