UTILS.
เป็นส่วนตัวตั้งแต่เริ่ม
⬛

เครื่องมือสร้าง CSS Box Shadow

ออกแบบ box-shadow แบบเห็นภาพพร้อมพรีวิวสดและคัดลอก CSS ได้ทันที

ไฟล์ของคุณอยู่ในอุปกรณ์นี้

ไฟล์ประมวลผลในเบราว์เซอร์และไม่ถูกอัปโหลด เว็บไซต์จะดาวน์โหลดโค้ดและทรัพยากรที่จำเป็นต่อเครื่องมือ ไม่ต้องมีบัญชีและไม่มีตัวติดตาม

ใช้ปุ่มดาวน์โหลดเพื่อบันทึกเครื่องมือนี้เป็นไฟล์ HTML ไฟล์เดียวสำหรับใช้ออฟไลน์

ความเป็นส่วนตัว →

เกี่ยวกับเครื่องมือนี้

สร้าง CSS box-shadow แบบเห็นภาพด้วยการเลื่อนแถบควบคุมสำหรับ offset, blur, spread, สี และความทึบ แล้วคัดลอกกฎที่พร้อมใช้งานได้ทันที ทุกอย่างอัปเดตแบบสดและทำงานในเบราว์เซอร์ของคุณทั้งหมด

คำถามที่พบบ่อย

ค่า spread ทำอะไร?
Spread จะขยาย (ค่าบวก) หรือย่อ (ค่าลบ) เงาก่อนที่จะใส่ blur ทำให้เงาใหญ่ขึ้นหรือกระชับกว่าตัวองค์ประกอบ
เงาแบบ inset คืออะไร?
Inset จะวาดเงาไว้ภายในองค์ประกอบแทนที่จะอยู่ด้านนอก เหมาะสำหรับปุ่มที่ดูเหมือนถูกกดหรือแสงเรืองด้านใน

เครื่องมือเพิ่มเติม