ตัวสร้างเงาสวยงามและกล่องแก้ว

ออกแบบเงาสมจริง (Box Shadow) และเอฟเฟกต์กระจก (Glassmorphism Backdrop Blur) ปรับความเบลอ ความฟุ้ง พร้อมโค้ด CSS สำเร็จรูป

ทำงานบนเครื่องคุณ 100% (ข้อมูลปลอดภัย ไม่ส่งขึ้นเซิร์ฟเวอร์)

ออกแบบเงาและเอฟเฟกต์กระจก CSS

ตัวสร้างเงาสวยงามและกล่องแก้ว (Shadow & Glass)

ออกแบบเงาสมจริง (Box Shadow) และเอฟเฟกต์กระจก (Glassmorphism Backdrop Blur) ปรับความเบลอ ความฟุ้งกระจาย ความโปร่งแสง พร้อมกล่องพรีวิวและโค้ด CSS

เลือกเอฟเฟกต์ (Effect Mode)

แกน X (Horizontal)10px

แกน Y (Vertical)10px

ความเบลอ (Blur)25px

การกระจาย (Spread)-5px

ความโปร่งแสง (Opacity)20%

สีของเงา (Shadow Color)

Box Shadow Preview

โค้ด CSS สำเร็จรูป (CSS Code)

box-shadow: 10px 10px 25px -5px rgba(0, 0, 0, 0.2);

เลือกโหมดเอฟเฟกต์ระหว่าง 'เงาสมจริง (Box Shadow)' หรือ 'กล่องแก้ว (Glassmorphism)'
ปรับแถบเลื่อนแกน X, Y, ความเบลอ, การกระจายตัว และความโปร่งแสงตามต้องการ
กล่องพรีวิวตรงกลางจะแสดงผลลัพธ์เอฟเฟกต์ให้เห็นแบบเรียลไทม์
กดปุ่ม 'คัดลอกโค้ด' ด้านล่างเพื่อนำโค้ด CSS ไปวางในโปรเจกต์ของคุณได้ทันที

⭐ ให้คะแนนเครื่องมือนี้

4.7

/ 5.0

รีวิว