สร้างเงากล่อง CSS ที่สวยงามได้อย่างง่ายดาย

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

Preview

เงากล่อง

ปรับแต่งฉันเอง

เอาต์พุต CSS

box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);

การควบคุมเงา

Position

0px
4px

Size

6px
-1px

Color

10%

Options

Presets

เงานุ่ม

เงาปานกลาง

เงาหนัก

เงาภายใน

เส้นทแยงมุมคมชัด

เค้าร่างเรืองแสง

เงาคู่

เอฟเฟกต์ยก

วิธีใช้

การควบคุมพื้นฐาน

  • ปรับออฟเซ็ตแนวนอนเพื่อเลื่อนเงาไปทางซ้ายหรือขวา
  • ปรับออฟเซ็ตแนวตั้งเพื่อเลื่อนเงาขึ้นหรือลง
  • เพิ่มรัศมีเบลอเพื่อทําให้เงานุ่มขึ้น
  • Use รัศมีการแพร่กระจายเพื่อเพิ่มหรือลดขนาดโดยรวมของเงา
  • เปลี่ยนColor and Opacityเพื่อปรับแต่งลักษณะเงา

คุณสมบัติขั้นสูง

  • Enable เงาแทรกเพื่อสร้างเอฟเฟ็กต์เงาภายใน
  • Use เงาหลายเงาสําหรับเอฟเฟกต์ที่ซับซ้อนมากขึ้น
  • บันทึกและโหลดPresetsเพื่อการเข้าถึงเงาที่คุณชื่นชอบอย่างรวดเร็ว
  • Click เงาสุ่มเพื่อแรงบันดาลใจ
  • คัดลอกโค้ด CSS ที่สร้างขึ้นแล้ววางลงในโปรเจ็กต์ของคุณ

Related Tools

ตัวย่อขนาด CSS

บีบอัดและเพิ่มประสิทธิภาพโค้ด CSS ของคุณด้วยความแม่นยําระดับมืออาชีพ

สร้างการแปลง CSS3 ได้อย่างง่ายดาย

เครื่องมือที่ทรงพลังและใช้งานง่ายสําหรับการสร้างการแปลง CSS3 ที่ซับซ้อนโดยไม่ต้องเขียนโค้ด แสดงภาพการเปลี่ยนแปลงแบบเรียลไทม์และคัดลอก CSS ที่สร้างขึ้นเพื่อใช้ในโครงการของคุณ

Less to CSS Converter

แปลงโค้ด Less ของคุณเป็น CSS รวดเร็ว ง่ายดาย และปลอดภัย

ตัวแก้ไข JSON

แก้ไข Big JSON อย่างง่ายดาย - รวดเร็วและราบรื่น

เครื่องกําเนิดไฟฟ้า HMAC

สร้างการย่อย HMAC ได้อย่างง่ายดาย

Convert JSON to Text Effortlessly

แปลงข้อมูล JSON ของคุณเป็นข้อความธรรมดาที่จัดรูปแบบได้ด้วยคลิกเดียว รวดเร็ว ปลอดภัย และใช้เบราว์เซอร์อย่างสมบูรณ์