0

เครื่องกำเนิดเงากล่อง CSS

สร้างโค้ดกล่องเงา CSS ด้วยสายตา: แถบเลื่อนสำหรับออฟเซ็ต เบลอ กระจาย สีด้วยความทึบ โหมดแทรก และสูงสุดสี่เลเยอร์พร้อมการแสดงตัวอย่างแบบสด

0px
4px
12px
0px
0.25
กำลังประมวลผล... 0%

ผลลัพธ์

การประกาศเงากล่องมีส่วนที่เคลื่อนไหวได้หกส่วน ได้แก่ ออฟเซ็ต X และ Y, การเบลอ, การแพร่กระจาย, สี และคีย์เวิร์ดที่ใส่ไว้ซึ่งเป็นทางเลือก - และวิธีเดียวที่จะทำให้สิ่งเหล่านั้นถูกต้องคือการเห็นพวกมัน ตัวสร้างนี้วางทุกส่วนไว้บนแถบเลื่อนและแสดงผลบนการ์ดแสดงตัวอย่างในขณะที่คุณลาก ดังนั้นบรรทัด CSS ที่ด้านล่างจึงเป็นสิ่งที่คุณกำลังมองหาเสมอ

เงาในโลกแห่งความเป็นจริงนั้นไม่ค่อยมีชั้นเดียว รายการเลเยอร์ช่วยให้คุณซ้อนเงาได้มากถึงสี่เงาในการประกาศครั้งเดียว: เส้นสีเข้มที่แน่นหนาสำหรับคำจำกัดความของขอบ บวกกับการล้างแบบกว้างที่นุ่มนวลสำหรับการยกระดับ หรือคู่แสงและความมืดที่นิยามนิวมอร์ฟิซึม เลือกเลเยอร์ที่จะแก้ไข ลบเลเยอร์ที่คุณไม่ต้องการออก และการอัปเดตค่าเงาของกล่องที่รวมกันนั้นใช้งานได้จริง

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

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