Skip to main content

CSS Glassmorphism Oluşturucu

Canlı önizleme ve CSS çıktısıyla buzlu cam UI efektleri oluşturun. Şeffaflık, bulanıklık, kenarlık ve gölge ayarlarını ince ayarlayın.

Önizleme

Glassmorphism

Önizleme

Kontroller

10px
0.25
180%
0.18
16px
#ffffff

CSS kodu

background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(10px) saturate(180%);
-webkit-backdrop-filter: blur(10px) saturate(180%);
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 16px;
Aracı paylaş
📖

Nasıl Kullanılır

Step 1

Parametreleri Ayarlayın

Parametreleri Ayarlayın

Opaklık, bulanıklık ve kenarlığı ayarlayın

Step 2

Önizleyin

Önizleyin

Cam efektini gerçek zamanlı görün

Step 3

Kopyalayın

Kopyalayın

Kullanmak için CSS kodunu kopyalayın

Özellikler

Bulanıklık Kontrolü

Backdrop-filter bulanıklık miktarını ayarlayın

Arka Plan Özelleştirme

Arka plan resmini veya rengini özelleştirin

Kenarlık ve Gölge

Cam tarzı kenarlık ve gölge yapılandırın

FAQ

Buzlu cama benzer yarı saydam efektlerle bir UI tasarım trendi.