Glassmorphism CSS Generator - Glass UI

PHOTO EMBED

Sat Jul 02 2022 12:24:12 GMT+0000 (UTC)

Saved by @peterteszary #css

/* Background styles */
body {
    background-image: url('https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100');
    background-position: center;
}


/* Glassmorphism card effect */
.card {
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}


/* Generated by https://generator.ui.glass/ */
content_copyCOPY

https://ui.glass/generator/