Shadow Forge

สร้างเงากล่อง CSS แบบเห็นภาพ

ออกแบบเงากล่องสวยงามด้วยเครื่องมือแก้ไขแบบเห็นภาพ เพิ่มเงาหลายชั้น ปรับแต่ง offset, blur, spread และความทึบ คัดลอกโค้ด CSS ได้ทันที

16px

ชั้นเงา

ความทึบ30%
Offset X0px
Offset Y4px
เบลอ15px
กระจาย0px

โค้ด CSS

box-shadow: 0px 4px 15px 0px rgba(99, 102, 241, 0.3);

เทมเพลตเงา

วิธีสร้างเงากล่อง CSS

1

1. เพิ่มชั้นเงา

เริ่มด้วยเงาหนึ่งอันหรือเพิ่มหลายชั้น แต่ละชั้นสามารถมีสี offset, blur, spread และความทึบของตัวเอง

2

2. ปรับแต่งแต่ละชั้น

ปรับ offset รัศมี blur, spread และความทึบ สลับโหมด inset สำหรับเงาภายใน ลองใช้เทมเพลตเพื่อเป็นแรงบันดาลใจ

3

3. คัดลอก CSS

คัดลอกโค้ด CSS ที่สร้างขึ้นด้วยคลิกเดียวแล้ววางลงใน stylesheet ของคุณ ใช้งานได้กับเบราว์เซอร์สมัยใหม่ทั้งหมด

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

ตัวสร้างเงากล่อง CSS นี้ใช้ฟรีหรือไม่?

ใช่ ฟรี 100% ไม่มีข้อจำกัด สร้างเงาได้มากเท่าที่ต้องการโดยไม่ต้องสมัครสมาชิก

สามารถเพิ่มเงาหลายชั้นได้หรือไม่?

ได้! คุณสามารถเพิ่มเงาหลายชั้นและปรับแต่งแต่ละชั้นได้อิสระ ช่วยให้สร้างเอฟเฟกต์เงาซ้อนที่ซับซ้อนเช่น Material Design หรือ neumorphism

เงา inset คืออะไร?

เงา inset ปรากฏภายในองค์ประกอบแทนที่จะอยู่ภายนอก สร้างเอฟเฟกต์เรืองแสงภายในหรือถูกกด สลับปุ่ม Inset บนชั้นเงาใดก็ได้

ข้อมูลของฉันปลอดภัยหรือไม่?

แน่นอน ทุกอย่างทำงานในเบราว์เซอร์ของคุณ ไม่มีข้อมูลใดถูกส่งไปยังเซิร์ฟเวอร์ใดๆ

สำรวจเครื่องมืออื่นๆ

ดาวน์โหลดปกคลิป YouTube

ดาวน์โหลดปกคลิป YouTube คุณภาพสูง (1080p) ทันที

ตัวสร้างโค้ดฝัง YouTube

สร้างโค้ดฝัง YouTube แบบรีสปอนซิฟพร้อมตัวอย่างสด

ตัวสร้าง QR Code

สร้าง QR Code สำหรับ URL, ข้อความ, WiFi และอีเมล ดาวน์โหลดเป็น PNG หรือ SVG

ตัวสร้างรหัสผ่าน

สร้างรหัสผ่านแบบสุ่มทันที ปลอดภัยด้วยการเข้ารหัส

ตัวจัดรูปแบบ JSON

จัดรูปแบบ ตรวจสอบ และทำให้ข้อมูล JSON สวยงามพร้อมการไฮไลท์ไวยากรณ์

บีบอัดรูปภาพ

บีบอัดรูปภาพออนไลน์โดยไม่สูญเสียคุณภาพ รองรับ JPEG, PNG และ WebP

ตัวเข้ารหัส/ถอดรหัส Base64

เข้ารหัสและถอดรหัส Base64 ทันที แปลงข้อความและไฟล์เป็น Base64

ตัวสร้างชุดสี

สร้างชุดสีสวยงามด้วยโหมดฮาร์โมนี ดึงสีจากรูปภาพ

ตัวสร้างไล่สี CSS

สร้างไล่สี CSS สวยงาม ไล่สีเชิงเส้น วงกลม และกรวย

ตัวนับตัวอักษร

นับตัวอักษร คำ ประโยค และย่อหน้า ตรวจสอบจำกัดโซเชียลมีเดียและความหนาแน่นคำสำคัญ