Yuvarlatılmış Köşe Görsel Düzenleyici

Herhangi bir görsele yuvarlatılmış köşeler veya tam daire kırpma ekleyin. Eğriyi ayarlamak için yarıçap kaydırıcısını kullanın. Çıktı, şeffaf köşelere sahip PNG'dir — gerçekten yuvarlatılmıştır, beyaz dolgu ile taklit edilmemiştir. Profil fotoğrafları, uygulama ekran görüntüleri, tasarım maketleri ve daha yumuşak görsel kenarları istediğiniz her yerde kullanışlıdır.

Tasarımda yuvarlatılmış köşeler neden önemlidir

Yuvarlatılmış köşeler modern arayüzlerde her yerde — uygulama simgeleri (iOS %20 köşe yarıçapı kullanır), profil fotoğrafları (çoğu platform dairesel gösterir), kart düzenleri, mesajlaşma uygulamalarındaki görsel önizlemeleri. Yuvarlatılmış köşeli bir arayüze yerleştirilen kare kenarlı bir fotoğraf uyumsuz görünür. Görseli kaynakta önceden yuvarlatmak, hedefte CSS hilelerine gerek kalmadan temiz bir şekilde oturmasını sağlar.

Çıktı, köşeleri gerçekten şeffaf (alfa kanalı = 0) olan şeffaf bir PNG'dir. Herhangi bir arka plana — açık, koyu, degrade — yerleştirin ve köşeler doğru görünsün.

Bir görselin köşeleri nasıl yuvarlatılır

1. Görselinizi bırakın. JPG, PNG, WebP, HEIC. Ücretsiz olarak 50 MP'ye kadar.
2. Yarıçap kaydırıcısını sürükleyin. 0 = kare (değişiklik yok), %50 = hap şekli, %100 = tam daire. Canlı önizleme sonucu gösterir.
3. Belirli bir görünüm istiyorsanız bir hazır ayar seçin:
   • iOS Uygulama Simgesi — %22,5 yarıçap (iOS 7+ standardı)
   • Material Design — %12 yarıçap
   • Yumuşak Kart — %8 yarıçap (tipik kart arayüzü)
   • Hap — %50 yarıçap
   • Daire — %100 yarıçap (önce otomatik olarak kareye kırpar)
4. PNG'yi indirin. Şeffaf köşeler, alfa kanallı PNG-24 çıktısı.

Yuvarlatılmış köşeler vs daire kırpma vs arka plan kaldırma

Yuvarlatılmış köşeler (bu araç): görselin tamamı kalır; yalnızca köşeler yuvarlatılır. Kartlar, uygulama ekran görüntüleri, tasarım önizlemeleri için kullanın.

Daire kırpma (bu araç, %100 yarıçap): görsel bir daire haline gelir. Profil fotoğrafları için kullanın.

Arka Plan Kaldırma: konuyu keser, arka planı tamamen kaldırır. Farklı bir işlem — geometrik değil, serbest biçimli şeffaf bir şekil üretir.

Doğru yarıçap için ipuçları

Hedefinizin arayüzüyle eşleştirin. Görseli bir Material Design kartına koyuyorsanız %12 yarıçap kullanın. Bir iOS uygulamasına koyuyorsanız %22,5 kullanın. Genel bir "yumuşak kart" görünümü için %8 nötr görünür.

Büyük görseller daha büyük yarıçap gerektirir. 1000×1000 piksel bir görselde 8 piksellik köşeler neredeyse yuvarlatılmış görünmez. %8 (= 80 piksel) köşelerle kasıtlı görünür. Mutlak piksel yerine yüzde kaydırıcısını kullanın.

Dairesel çıktı için (profil fotoğrafları), kaynak görsel önce otomatik olarak kareye kırpılır. Kırpılan alan varsayılan olarak ortalanır; görünür dairede belirli bir alan istiyorsanız yeniden konumlandırmak için sürükleyin.