کد های css

#glass-object {
    border-radius: 25px;
    backdrop-filter: blur(10px);
    padding: 2rem;
    box-shadow: 0 2px 10px rgb(0 0 0 / 10%), 0 10px 15px rgb(0 0 0 / 20%);
    box-sizing: border-box;
    background-image: linear-gradient(45deg, rgba(66,60,90,0.6), rgba(66,60,90,0.6));
    width: 100%;
    height: 100%;
    mix-blend-mode: hard-light;
}
#text-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
#glass-container {
    position: relative;
    width: 100%;
    height: 80px;
}

کد های html

<div id="glass-container">
    <div id="text-layer">
        This is your glass effect.
    </div>
    <div id="glass-object"></div>
</div>