ออกแบบ CSS box-shadow พร้อม preview แบบสด รองรับหลาย layer
ดีไซน์box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.25);
ปรับ slider offset แนวนอนและแนวตั้ง
ตั้ง blur radius และ spread radius
เลือกสีเงาด้วย color picker
สลับ inset shadow ถ้าต้องการเอฟเฟกต์เงาด้านใน
คัดลอก CSS box-shadow ที่สร้างและวางในสไตล์ชีทของคุณ
สร้างเงาการยกตัวที่นุ่มนวลสำหรับ component การ์ดใน UI เว็บโดยไม่ต้องลองผิดลองถูกใน code editor
ออกแบบเอฟเฟกต์ปุ่มกด หรือยกตัวโดยใช้ inset หรือ outer shadow เพื่อให้ element ที่โต้ตอบได้รู้สึกสัมผัสได้
รวม box shadow หลายอัน (สว่างและมืด) เพื่อสร้างสไตล์ดีไซน์ neumorphism ที่นุ่มนวล
สร้าง box shadow สไตล์แสงเรืองสำหรับ focus ring บน form input เพื่อปรับปรุง accessibility และ visual feedback
Box Shadow Generator มีอินเทอร์เฟซลากและวางแบบภาพเพื่อออกแบบ CSS box shadow และคัดลอกโค้ด CSS ที่พร้อมวางทันที
ค้นหาและแปลงรหัสสี HEX, RGB, HSL สำหรับงานดีไซน์
สร้าง CSS gradient แบบ linear หรือ radial เลือก 2-5 สี พร้อมคัดลอกโค้ด
ออกแบบมุมโค้งแต่ละด้านของกล่อง พร้อมแสดงผลและโค้ด
สร้างชุดสีที่เข้ากันจากสีหลัก 1 สี
ดู Tailwind color palette ทั้งหมด คลิกเพื่อคัดลอก
ตรวจสอบ safe zone สำหรับ TikTok, Reels และ Shorts เพื่อให้คอนเทนต์ไม่โดนบัง