SVG ToolsLesson 187Preview gratis
SVG Wave Generator
Lesson ini bagian dari Web Developer Tools · Semua level
Ringkasan
SVG Wave Generator membuat bentuk gelombang dengan path SVG untuk dipakai sebagai pembatas section atau latar belakang. Kurva biasanya dibentuk dengan perintah C untuk cubic Bezier atau Q untuk quadratic Bezier, lalu ditutup ke bawah agar bisa diisi warna. Dengan viewBox dan preserveAspectRatio yang tepat, gelombang tetap responsif di berbagai lebar layar.
Poin kunci
- Path gelombang memakai kurva C atau Q
- Titik kontrol menentukan tinggi dan kemiringan gelombang
- Tutup path ke bawah agar area dapat di-fill
- viewBox membuat koordinat fleksibel
- preserveAspectRatio="none" membuat gelombang meregang mengikuti lebar
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.