เจเนเรเตอร์คลื่น SVG

วิธีใช้ เจเนเรเตอร์คลื่น SVG

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

1. เลือกจำนวนชั้น (1-5) ในตัวเลือก 「จำนวนชั้น」 ชั้นต่าง ๆ จะวาดจากหลังไปหน้า ชั้นใหม่จึงวาดทับชั้นก่อนหน้า
2. เลือกสีเริ่มต้นและสีสุดท้ายของไล่เฉดด้วยตัวเลือกสีสองตัว — ทุกชั้นใช้ไล่เฉดเชิงเส้นชุดนี้ร่วมกัน
3. ปรับแต่งแต่ละชั้นด้วยสไลเดอร์สี่ตัว: 「ความสูงเส้นฐาน」เลื่อนคลื่นขึ้นลง 「แอมพลิจูด」กำหนดความสูงของยอดคลื่น 「ความยาวคลื่น」คุมระยะแนวนอนระหว่างยอด 「ความเนียน」เบลนด์จากเส้นซิกแซกตรง ๆ (0%) ไปจนถึงเส้นโค้งเบซิเยร์ลูกศูนย์แบบไซน์เต็มรูป (100%)
4. กด 「สุ่ม」 เพื่อสร้างคอมโบใหม่ของจำนวนชั้น รูปทรง และสี ได้ทันทีจนกว่าจะเจอแบบที่ถูกใจ
5. กด 「ดาวน์โหลด SVG」 เพื่อบันทึกไฟล์ .svg หรือ 「คัดลอกโค้ด」 เพื่อเอามาร์กอัป SVG ฉบับเต็มเข้าคลิปบอร์ด พร้อมวางลงไฟล์ HTML หรือเครื่องมือออกแบบใดก็ได้ทันที

ทำเส้นแบ่งส่วนของเว็บ ให้วาง SVG ไว้ระหว่างสองบล็อกแล้วปล่อยให้ยืดเต็มความกว้าง 100% — viewBox จะรักษาเส้นโค้งให้ไม่บิดเบี้ยวทุกขนาด ความเนียนต่ำคู่กับคลื่นสั้นจะได้อารมณ์วาดมือ ส่วนเนียนเต็มที่คู่กับคลื่นยาวจะเหมือนทะเลสงบ