CSS Clip Path

Hazır ve özel clip-path şekilleri, canlı önizleme. WebKit öneki, boyut kontrolü, kopyala veya indir.

GizliTarayıcıdaAnındaLimitsiz

Özel değer

Önizleme boyutu 160px

CSS çıktısı

clip-path: polygon(25% 6%, 75% 6%, 100% 50%, 75% 94%, 25% 94%, 0 50%);
-webkit-clip-path: polygon(25% 6%, 75% 6%, 100% 50%, 75% 94%, 25% 94%, 0 50%);

Tip: polygon · 58 karakter

clip-path ve -webkit-clip-path çıktı verir. Özel mod geçerli clip-path fonksiyon dizelerini kabul eder.

Önizleme

Nasıl çalışır

Hazır şekil seç

Daire, altıgen, yıldız, ok ve diğer hazır clip-path şekillerinden birini seçin.

Veya özel CSS gir

polygon, circle, inset veya path() için özel modu açıp herhangi bir clip-path değeri yapıştırın.

CSS kopyala

Gradyanlar üzerinde önizleyin, boyutu ayarlayın, clip-path.css kopyalayın veya indirin.

Neden clip-path?

clip-path ekstra görsel olmadan belirgin düzenler ve avatarlar oluşturur: kartlar ve hero bölümleri için kullanışlı. CSS Clip Path, Easy24’ün geliştirici araçlarından biridir. Normal kullanımda girdin bu sekmede kalır; Easy24 bu içeriği işlemek için yüklemez. Bu aracın günlük ücretsiz plan tavanı yoktur; istediğin kadar kullan. Tipik akış: Hazır şekil seç veya özel clip-path değeri gir, önizle, CSS'i kopyala veya indir. Takip adımı yaygınsa sayfada ilgili araçlar ve ters dönüşümler görünür.

Neden bu araç

On hazır şekil
Özel clip-path girişi
Gradyanlı canlı önizleme
WebKit öneki dahil
Ayarlanabilir önizleme boyutu
Sınırsız kullanım: günlük limit yok

Sorular

CSS Clip Path ne yapar?

Bir öğeyi görsel olarak şekle kesen CSS clip-path kuralları üretir.

Bu tam SVG editörü mü?

Hayır. Hazır şablonlar ve clip-path fonksiyonları için metin alanı sunar: Bézier düzenleme değil.

Neden -webkit-clip-path dahil?

Safari bazı clip-path kullanımlarında önekli özellikten hâlâ faydalanır.

Hangi şekiller polygon() kullanır?

Altıgen, elmas, yıldız, ok, üçgen ve mesaj balonu preset'leri polygon noktaları kullanır.

Easy24 işine yaradıysa kahve ısmarla

Araçlar ücretsiz kalır. Teşekkür etmek istersen tek seferlik bağış yapabilirsin.

Kahve ısmarla

CSS Clip Path ne zaman kullanılır

CSS Clip Path, birkaç dakikalığına açıp işi bitirip kapattığınız ve yükleme izi bırakmayan araçlardan biridir. Hazır ve özel clip-path şekilleri, canlı önizleme. Daha hızlı ilerlemek için ön ayarları kullanın, tasarım sistemi veya bilet tam sayı istediğinde değerleri ince ayarlayın. CSS Clip Path Easy24’te iki dilli olduğu için araç davranışı değişmeden aynı iş akışı İngilizce veya Türkçe çalışır. Buradaki gizlilik varsayılanı tarayıcı önceliklidir: bu iş akışı için süre dolmasını bekleyen bir Easy24 belge gelen kutusu yoktur. Bu sayfanın günlük ücretsiz plan tavanı yoktur; istediğiniz kadar çalıştırabilirsiniz. Bitince ihtiyacınız olanı indirin veya kopyalayın, sonra sekmeyi kapatın. Sayfadaki ilgili araçlar ters dönüşüm veya komşu format gibi yaygın takip adımlarını kapsar. Easy24’te araç sayfaları İngilizce ve Türkçe senkron tutulur; davranış aynı kalır.

Benzer Geliştirici araçları

Tümünü gör

JSON Biçimlendirici

Geliştirici

JSON'u tarayıcıda güzelleştir, küçült, doğrula ve anahtarları sırala. 2 veya 4 boşluk girinti, dosya içe aktarma ve indirme.

Aç

Meta Etiket Üretici

Geliştirici

SEO başlık, açıklama, Open Graph, Twitter Card ve canonical etiketlerini canlı sosyal önizleme ile oluştur. Tarayıcıda çalışır.

Aç

CSS Gradyan Oluşturucu

Geliştirici

Doğrusal ve radyal CSS gradyanları tasarla; üç renk durağına kadar. Canlı önizleme, hazır şablonlar, hex girişi, kopyala veya indir.

Aç