글래스모피즘2 [why] 글래스모피즘(Glassmorphism)이 세련된 느낌을 주는 이유. 글래스모피즘은 최신 디자인 트렌드를 반영하는 스타일로,이미지의 분위기를 더 세련되게 만들어 줍니다. 글래스모피즘(Glassmorphism)이 모던하고 세련된 느낌을 주는 이유는 다음과 같은 디자인 특징들에 기반하고 있습니다: 투명성과 흐림 효과 (Frosted Glass Effect)글래스모피즘의 핵심은 반투명한 배경과 흐릿한 효과입니다.이는 마치 유리나 Frosted Glass처럼 보이는 효과로, 배경이 자연스럽게 흐려지면서 콘텐츠가 강조됩니다.이런 효과는 미니멀하고 세련된 느낌을 주기 때문에 복잡한 디자인 요소들을 단순화하고, 그 자체로도 아름다워 보입니다. 입체적인 느낌 (Depth and Layers)글래스모피즘은 시각적으로 깊이감을 만들어 줍니다.반투명한 레이어들이 배경을 비추고 있는 형.. 2024. 11. 29. [Css] 배경 blur 버튼 만들기 (애플 공식 홈 st. 글래스모피즘버튼 ) 버튼 뒤쪽에 blur 효과가 적용되어 버튼을 좀더 도드라져 보이게 합니다. 공식 애플 웹사이트를 방문했다가 위와같은 스타일의 버튼이 적용되어 있는 것을 보고 만들어 봤어요! 사실 이 스타일은 글래스모피즘 이라고 불립니다. 사용되는 css backdrop-filter 요소 뒤 영역에 흐림이나 색상 시프트 등 그래픽 효과를 적용할 수 있는 속성입니다. 요소 "뒤"에 적용하기 때문에, 효과를 확인하려면 요소나 요소의 배경을 적어도 반투명하게는 설정해야 합니다. 적용 방법 backdrop-filter: blur(2px); 버튼으로 만들기 결과 css .btn_blur { backdrop-filter: blur(4px); background-color: rgb(66 66 69/70%); border-radius:.. 2023. 11. 13. 이전 1 다음 728x90 반응형
