สร้างเงากล่อง 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 ของคุณด้วยความแม่นยําระดับมืออาชีพ
Less to CSS Converter
แปลงโค้ด Less ของคุณเป็น CSS รวดเร็ว ง่ายดาย และปลอดภัย
ตัวสร้างการเปลี่ยน CSS3
การเปลี่ยนความทึบที่ราบรื่น
เครื่องคํานวณความน่าจะเป็น
คํานวณความน่าจะเป็นสําหรับสถานการณ์ต่างๆ ด้วยเครื่องคํานวณความน่าจะเป็นที่ครอบคลุมของเรา
ตัวแปลง CSS เป็น LESS
แปลงโค้ด CSS ของคุณให้เป็น LESS ด้วยตัวแปร การซ้อน และอื่นๆ รวดเร็ว ง่ายดาย และปลอดภัย
SHA-512/224 เครื่องคํานวณแฮช
สร้างแฮช SHA-512/224 อย่างรวดเร็วและง่ายดาย