Tepi awan
Gratis, tanpa daftar, berjalan di peramban Anda.
Busur yang sama dengan gelombang bergelombang tetapi jauh lebih sedikit dan jauh lebih dalam, yang membuatnya berhenti terbaca sebagai tepi hias dan mulai terbaca sebagai objek — tepatnya, sebagai awan. Bagus di atas footer atau di bawah hero ketika Anda ingin sesuatu yang ramah alih-alih netral.
Pengaturan di baliknya
| Generator | Gelombang |
|---|---|
| Titik | 5 |
| Amplitudo | 82% |
| Keacakan | 0% |
| Garis dasar | 50% |
| Lapisan | 1 |
| Kehalusan | 100% |
| Benih | 301 |
Yang perlu diketahui
- Busur sedikit tapi besar: makin sedikit tonjolannya, makin ia terbaca sebagai bentuk ketimbang hiasan tepi.
- Padukan dengan warna lembut; pada skala ini warna pekat mendominasi seluruh bagian.
- Hanya 295 bita untuk bentuk sebesar ini.
Berapa bita biayanya
Bentuk persis ini berukuran 295 bita sebagai SVG dan 456 bita sebagai latar CSS — data URI-nya lebih besar karena pengodean persen memakan tiga karakter untuk setiap karakter yang dilolosinya. Kedua angka itu untuk bentuk yang ditampilkan di atas, dengan ketelitian koordinat dua desimal.
| Format | Ukuran |
|---|---|
| SVG | 295 B |
| Latar CSS | 456 B |
| clip-path CSS | 487 B |
Awal dari SVG untuk Tepi awan
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" preserveAspectRatio="none"><path d="M-288 160A144 99.71 0 0 1 0 160A144 99.71 0 0 1 288 160A144 99.71 0 0 1 576 160A144 99.71 0 0 1 864 160A144 99.71 0 0 1 1152 160A144 99.71 0 0 1 1440 160L1440 320L-288 320Z" fill="#4f46e5"/></svg>Lebih rinci
Coba yang satu ini dibalik tegak dengan lengkungnya dipotong ke dalam. Lima busur yang sama yang terbaca sebagai awan menggantung akan terbaca sebagai deretan ceruk ketika ia menggigit ke atas ke dalam isian — dan itu pembatas yang benar-benar berbeda dari empat pengaturan yang sama.
Pertanyaan
Bagaimana saya mengubah Tepi awan setelah mendapatkannya?
Buka generatornya, klik Tepi awan di baris prasetel, lalu geser apa saja. Prasetel adalah titik awal, bukan kunci — semua penggeser tetap aktif, dan kotak benih menerima kata kalau Anda lebih suka menamai bentuk Anda daripada menomorinya.
Apakah akan terlihat sama lain kali?
Ya, selama benihnya sama. Yang ini benih 301 dengan 5 titik. Generatornya deterministik, jadi pengaturan itu menghasilkan ulang kurva yang persis sama di perangkat mana pun.
Bisakah saya memakai warna lain?
Bisa — warna diterapkan saat ekspor, tidak dipanggang ke dalam geometrinya. Pratinjau di atas memakai warna bawaan alat ini; pilih warna Anda di generator dan SVG, latar CSS, serta clip-path akan mengikuti.
Setiap angka dan setiap bentuk di halaman ini dihasilkan dengan menjalankan generatornya saat build, jadi semuanya menggambarkan alat yang sebentar lagi Anda pakai, bukan versi yang pernah ada.