CSS Clip-Path Shape Generator
Buat poligon, bintang, lencana, segi enam, dan bentuk chevron dengan geometri klip-path CSS moden.
Berjalan dalam pelayar anda. Fail anda tidak pernah meninggalkan peranti. Lihat cara menyemaknya
…
Cara melakukannya
- 1Langkah 1: buka CSS Clip-Path Shape Generator dan masukkan data anda
Taip nombor atau teks anda, tambah fail, atau pilih pilihan yang diperlukan. Tiada apa-apa dimuat naik: semuanya kekal dalam pelayar anda.
- 2Langkah 2: apa yang dilakukan CSS Clip-Path Shape Generator
Buat poligon, bintang, lencana, segi enam, dan bentuk chevron dengan geometri klip-path CSS moden.
- 3Langkah 3: baca keputusan dan bandingkan
Keputusan muncul serta-merta. Ubah satu nilai untuk melihat bagaimana jawapan berubah, kemudian simpan angka yang sesuai dengan kes anda.
- 4Langkah 4: salin atau simpan
Salin keputusan atau muat turun. Untuk keputusan penting, sahkan dengan sumber rasmi atau penasihat.
Tentang alat ini
Clip-path membolehkan pemaju memotong elemen HTML dan imej ke dalam poligon geometri yang tepat dan bentuk tanpa memerlukan topeng Photoshop atau SVG. Pilih dari preset popular, memeriksa topeng render secara real time, dan salin koordinat poligon CSS tulen siap untuk pengeluaran.
Petua untuk hasil terbaik
Sebelum bermula, luangkan seketika untuk membaca pilihan dan cuba alat dengan contoh kecil dahulu. Semuanya berjalan dalam pelayar pada peranti anda sendiri; tiada apa yang anda taip atau tambah dimuat naik dan menutup tab memadam semuanya. Jika sesuatu tidak kelihatan betul, muat semula halaman dan cuba lagi atau gunakan pautan laporan pada halaman ini untuk memberitahu kami apa yang tidak kena. Jika hasil masih kelihatan salah, ubah satu nilai pada satu masa untuk melihat ruang mana yang paling berpengaruh. Tanda halaman ini jika anda akan menggunakannya semula.
Ringkasnya
- Kategori: Imej
- Berjalan dalam pelayar, tanpa pendaftaran, tanpa muat naik.
- Maklumat yang anda masukkan kekal pada peranti anda.
- Tersedia dalam banyak bahasa.
- Kandungan disemak kali terakhir:
Soalan lazim
Apakah CSS Clip-path?
The `clip-path` CSS property creates a clipping region that determines which parts of an element or image are visible.
Bentuk yang termasuk sebagai praset?
Setkan semula termasuk segitiga, segi enam, bintang 5 titik, lencana diskaun produk, chevron navigasi, dan topeng bulat.
Bolehkah saya klip gambar dan video dengan ini?
Yes. Apply the generated clip-path CSS rule to any `<img>`, `<video>`, `<div>`, or card component in your stylesheet.
Adakah jalur klip mempengaruhi hitbox elemen yang boleh diklik?
Dalam penyemak imbas moden, hanya kawasan elemen yang kelihatan dan tidak dipotong yang bertindak balas terhadap peristiwa penyelip pointer dan klik.