디자인( CSS) · 로컬에서 실행됨

접근 가능한 CSS 글래스모피즘 생성기

대체 색상, 배경 블러, 테두리, 반경 및 그림자 값을 사용하여 반투명 패널을 구성하고, 제어된 로컬 배경 위에서 대비를 미리 보세요.

결과

준비 완료. 작업 데이터는 이 브라우저에 유지됩니다.

이 도구가 유용한 이유

명시적인 대체값을 유지하고 프로덕션 디자인 시스템에 들어가기 전에 효과를 검토하면서 서리가 낀 내비게이션 패널이나 오버레이를 조정하세요.

브라우저는 유효성이 검증된 16진수 색상을 제한된 알파 채널로 변환하고, 접두사가 붙은 표준 blur 선언을 생성하며, 팔레트 선택을 외부로 전송하지 않습니다.

읽기 쉬운 플로팅 도구 모음을 위해 24퍼센트 불투명도의 짙은 남색 패널에 18픽셀 블러와 은은한 흰색 테두리를 적용한 미리보기.

계산은 결정적이며, 잘못된 입력을 조용히 변경하는 대신 유효성 검사 오류를 설명합니다.

입력과 출력은 이 탭에 그대로 유지됩니다. 복사와 다운로드는 서버 업로드 없이 브라우저 API를 통해 이루어집니다.

각 실행은 해당 도구 모드, 타임스탬프, 입력/출력 크기를 보고하므로 변환된 데이터를 감사할 수 있습니다.