a11y.skipToMainContent
1

ตัวสร้างกล่องเงา

สร้างช่องสีช่อง CSS ด้วยภาพ — คือออฟเซ็ต, เบลอ, กระจาย, สี, ความทึบแสง, และภาพสะท้อนสด.

px
px
px
px
%

Preview

CSS

Was this tool helpful?
Send output to:
Advertisement

How to use Box Shadow Generator

  1. ปรับแถบเลื่อนสําหรับปรับค่า X/ Y, เบลอ, กระจาย, สี, ความทึบแสง.
  2. สลับอินเซ็ตกับเงาภายใน.
  3. รับทราบ ซีเอสเอส.

อะไรคือ?

สืบค้นทุกคุณสมบัติของช่อง CSS บัตรตัวอย่างแสดงให้เห็นว่า เงาของคุณจะเป็นยังไง คัดลอกบรรทัด CSS เมื่อคุณเสร็จแล้ว

Advertisement

FAQ

รัศมีที่กระจายตัวคืออะไร?
การแพร่กระจายด้านบวกจะมีขนาดเงา ก่อนที่จะเบลอลบหดตัว การรวมค่าลบ แพร่กระจายด้วยออฟเซ็ต สําหรับเงาที่สะอาด.
ฉันจะเพิ่มเงาหลายกล่อง ในเวลาเดียวกันได้หรือไม่?
ใช่ เพิ่มชั้นเงามากมายตามที่คุณต้องการ มันรวมกันเป็นคุณสมบัติแบบเดียวจุลภาค ที่แยกเป็นกล่องเงา CSS ที่คุณคัดลอกได้.
แล้วกล่องเช็คชุดล่ะ?
Inset วาดเงาภายในองค์ประกอบแทนภายนอกสร้างผลกระทบของการกดหรือ sunching องค์ประกอบของคุณ.

Related tools

Author

MW
Marcus Webb"The DevTool Craftsman"

Full-Stack Developer & Tools Architect

Marcus has been writing code since the dial-up era. He has contributed to open-source developer tools, built CI/CD pipelines for startups, and debugged production incidents at 3 AM more times than he would like to admit. His philosophy is that the best developer tool is the one that gets out of your way, and he writes about practical tooling that helps teams ship faster with fewer headaches.

Advertisement