เครื่องมือสร้าง Glassmorphism
สร้างแผงกระจกฝ้าด้วย backdrop-filter ปรับความเบลอ ความโปร่งใส ความอิ่มตัว และเส้นขอบบนพื้นหลังจริง แล้วคัดลอก CSS
ตัวอย่างแบบเรียลไทม์
กระจกฝ้า
ข้อความบนกระจกต้องมีคอนทราสต์เพียงพอกับทุกส่วนของพื้นหลัง
พื้นหลังใช้สำหรับดูตัวอย่างเท่านั้นและจะไม่ถูกส่งออก
.glass {
background: rgba(255, 255, 255, 0.2);
-webkit-backdrop-filter: blur(12px) saturate(160%);
backdrop-filter: blur(12px) saturate(160%);
border: 1px solid rgba(255, 255, 255, 0.25);
border-radius: 20px;
box-shadow: 0 8px 32px rgba(15, 23, 42, 0.25);
}ข้อมูลทั้งหมดอยู่ในเบราว์เซอร์ของคุณ
เครื่องมือที่เกี่ยวข้อง
แหล่งอ้างอิงรูปแบบไฟล์
อัปเดตหน้าเครื่องมือเมื่อ: