Contoh SVG
- Hal Sebelumnya Perubahan Graden Radial SVG
- Hal Berikutnya Panduan Rujukan SVG
Coba sendiri contoh ini
Contoh di bawah ini akan memasukkan kode SVG langsung ke dalam kode HTML.
Firefox, Internet Explorer 9, Google Chrome, Opera dan Safari semua mendukung hal ini.
Contoh SVG
Bentuk dasar SVG
- Bola
- Persegipan
- Segiempat yang tak terlihat
- Segiempat dengan kekeruhan 2
- Segiempat dengan sudut yang berbujur
- Eliips
- Tiga eliips yang bertumpuk
- Dua eliips
- Garis
- Poligon dengan tiga sisi
- Poligon dengan empat sisi
- Bintang
- Bintang lainnya
- Jalur
- Jalur lainnya
- Jalur
- Garis kuadratik
- Tulis tulisan
- Teks berputar
- Teks berbaris
- Teks yang bertindak seperti tautan
- Mendefinikan warna jalur, teks atau garis kontur (stroke)
- Mendefinikan lebar jalur, teks atau garis kontur (stroke-width)
- Mendefinikan jenis akhiran jalur yang terbuka (stroke-linecap)
- Mendefinikan garis bercabang (stroke-dasharray)
Pendip filter SVG
- feGaussianBlur - Efect abur
- feOffset - Mengoffset sebuah segiempat, lalu menggabungkan gambar asli ke atas gambar yang di offset
- feOffset - Mengaburkan gambar yang di offset
- feOffset - Membuat bayangan hitam
- feOffset - Mengelilingi bayangan dengan warna tertentu
- Filter feBlend
- Filter 1
- Filter 2
- Filter 3
- Filter 4
- Filter 5
- Filter 6
Gradien SVG
- Eliips dengan transisi linear horizontal dari kuning ke merah
- Eliips dengan transisi linear vertical dari kuning ke merah
- Eliips dan teks dengan transisi linear horizontal dari kuning ke merah
- Eliips dengan transisi radial dari putih ke biru
- Eliips yang mempunyai transisi radial dari putih ke biru
Miscellaneous SVG
- Segiempat yang menghilang berulang-ulang dalam 5 saat
- Segiempat berwarna yang berubah dan bertambah berterusan
- Tiga segiempat berwarna yang berubah
- Pindah teks menurut laluan gerakan
- Pindah, putar dan skala teks menurut laluan gerakan
- Pindah, putar dan skala teks menurut laluan gerakan + persegi panjang yang bertambah berwarna
- Pindah, putar dan skala teks menurut laluan gerakan
- Hal Sebelumnya Perubahan Graden Radial SVG
- Hal Berikutnya Panduan Rujukan SVG
