ตัวสร้างนิวมอร์ฟิซึม

เกี่ยวกับ ตัวสร้างนิวมอร์ฟิซึม

Neumorphism Generator ออกแบบลุค “soft UI” ที่นูนออกมาอย่างนุ่มนวล: องค์ประกอบที่ดูเหมือนถูกกดออกมา — หรือกดจม — เข้าไปในพื้นผิวด้านหลัง เลือกสีพื้นฐานสีเดียว แล้วเครื่องมือจะคำนวณส่วนที่เหลือให้ เพราะเอฟเฟกต์นี้จะได้ผลก็ต่อเมื่อองค์ประกอบและพื้นหลังใช้สีเดียวกัน และความลึกทั้งหมดมาจาก box-shadow สองด้านที่ตรงข้ามกัน

สไลเดอร์ควบคุมรูปทรง: ขนาด รัศมีขอบ ระยะของเงา ความเข้ม และความเบลอ โหมดรูปทรงสี่แบบ — flat, concave, convex และ pressed — สลับ gradient ภายในและทิศทางเงา ส่วนตัวเลือกทิศทางแสงจะย้ายจุดไฮไลต์ไปยังมุมใดมุมหนึ่งในสี่มุม เพื่อให้เข้ากับแสงในดีไซน์ของคุณ

โดยค่าเริ่มต้น สีเงินอ่อนและเงาเข้มจะคำนวณจากสีพื้นฐาน แต่โหมดแมนนวลให้คุณตั้งค่าเองทั้งสองสี CSS ที่สร้างขึ้น — background, radius และ box-shadow คู่ — พร้อมคัดลอกได้ในคลิกเดียว

วิธีใช้ ตัวสร้างนิวมอร์ฟิซึม

1. เลือกสีพื้นฐาน — จะถูกใช้กับทั้งองค์ประกอบและแคนวาสด้านหลัง
2. เลือกรูปทรง: flat, concave, convex หรือ pressed
3. ตั้งค่ามุมของแหล่งกำเนิดแสงเพื่อควบคุมตำแหน่งของไฮไลต์
4. ปรับขนาด รัศมีขอบ ระยะ ความเข้ม และความเบลอด้วยสไลเดอร์
5. เปิดใช้สีเงาแบบแมนนวลหากต้องการปรับแต่งโทนสว่างและเข้มที่คำนวณไว้เอง
6. คัดลอก CSS แล้ววางลงบนองค์ประกอบของคุณ

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