PWA İkon Oluşturucu (Ücretsiz, Hızlı ve Gizli)

PWA uygulamanız için gereken maskelenebilir ve standart ikonları oluşturun.

Önce gizlilik

  • Dosyalar tarayıcını asla terk etmez
  • Sunucuya yükleme yok
  • Tüm işlem cihazında yerel olarak yapılır

PWA İkonu Nedir ve 'Maskable Icon' Neden Gereklidir?

PWA ikonu, bir web sitesi bir mobil cihazın veya masaüstü bilgisayarın ana ekranına 'yüklendiğinde' görünen uygulama simgesidir. Standart bir web sitesinden farklı olarak PWA'lar, bir manifest.json dosyası aracılığıyla kendilerini sisteme tanıtırlar. Bu dosyada yer alan 'pwa icon size' (genellikle 192x192 ve 512x512) değerleri, uygulamanın hangi ikonları kullanacağını belirler. Ancak son yıllarda Android ekosistemine eklenen 'Maskable Icons' kavramı işleri biraz değiştirdi. Maskable bir ikon, ana logonun etrafında yeterli bir 'güvenli alan' (safe zone) barındıran, böylece sistem tarafından farklı şekillerde kırpılsa bile logonun kesilmediği bir yapıdır. Bir 'PWA Generator' kullanmadan bu güvenli alanı manuel ayarlamak oldukça zordur. Aracımız, hem standart ikonları hem de modern maskable varyasyonları sizin için saniyeler içinde hazırlayarak, PWA'nızın Google Play veya Apple'ın native uygulamaları kadar kaliteli görünmesini sağlar.

Neden Pixes.app PWA Icon Generator?

Tam Google Chrome ve W3C Uyumluluğu: Lighthouse testlerinden tam puan almanız için her ikonun isimlendirmesini ve boyutunu standartlara göre ayarlıyoruz.. İkon eksikliği nedeniyle PWA kurulum hatası alma riskini sıfıra indirin.

Manifest.json Desteği: Sadece imajları değil, o imajları sisteme tanıtacak JSON kodlarını da hazırlıyoruz.. Kopyala-yapıştır yaparak teknik dokümantasyonla uğraşmaktan kurtulun.

Hız ve Sadelik: Üyelik, e-posta veya ücret yok. Sadece saniyeler içinde en yüksek kaliteli PWA paketini teslim ediyoruz.. Geliştirme akışınızı kesintiye uğratmadan ikon ihtiyacınızı çözün.

3 Adımda Profesyonel PWA İkon Paketi Oluşturma

Kod yazmanıza veya manifest dosyasıyla boğuşmanıza gerek yok. PWA ikon projenizi tarayıcınızdan nasıl tamamlayacağınızı öğrenin.

  1. Ana İkonunuzu (512x512) Yükleyin: Tasarımınızın en net halini seçin. En iyi sonuçlar için 512x512 piksel boyutunda, kare ve yüksek kaliteli bir PNG dosyası yükleyin. 'Görsel Seç' diyerek veya sürükleyerek işlemi başlatın.
  2. Maskable ve Standart Boyutlandırma: Logonuz yüklendiğinde aracımız aynı anda; 192x192 (Genel), 512x512 (Splash Screen) ve 'maskable-icon-512x512' gibi temel dosyaları üretir. Siz sadece tek bir tuşa basarsınız, geri kalanı algoritmalarımız halleder.
  3. Manifest Snipet'ını Kopyalayın ve İndirin: İşlem bittiğinde manifest.json dosyanızın içine yapıştırmanız gereken ikon dizisini (icons array) sizin için oluşturuyoruz. 'Kodları Kopyala' butonuna basarak işinizi saniyeler içinde bitirin ve tüm paketi ZIP olarak indirin.

PWA İkonları İçin Profesyonel İpuçları

Lighthouse Skorunuzu Artırın: Chrome Lighthouse testi hem 192x192 hem de 512x512 piksellik iki ana ikon ve en az bir tane 'maskable' ikon bekler. Aracımız bu üçlü seti otomatik sunarak PWA skorunuzu zirveye taşır.

Arka Plan Rengi Seçimi: PWA yüklendiğinde görünen splash screen'de ikonunuzun etrafında bir arka plan rengi seçilir (background_color). İkonunuzun şeffaf (transparent) bir PNG olması, bu rengin her türlü cihaz temasında (Koyu/Açık Mod) düzgün görünmesini sağlar.

Logo Etrafındaki Marj (Safe Zone): Android'in ikonu daire şeklinde kırpabileceğini unutmayın. Logonuzun tam merkezde ve kenarlardan en az %10 içeride olduğundan emin olun. Pixes.app bunu 'maskable' seçeneğinde sizin yerinize kontrol eder.

PWA İkon Aracımızı Kimler Kullanmalı?

Frontend ve Full-Stack Geliştiriciler: React, Vue veya Angular projelerinizi PWA'ya dönüştürürken ikon boyutlandırarak vakit kaybetmeyin. Manifest uyumlu seti saniyeler içinde alın.

📱 Mobil Öncelikli (Mobile-First) Girişimler: Uygulamanızı marketlere (App Store/Google Play) çıkarmadan önce PWA olarak yayınlayıp test ederken en profesyonel ikonlara sahip olun.

🛒 E-Ticaret ve SaaS Şirketleri: Kullanıcılarınızın sitenize 'tek tıkla' ulaşmasını sağlamak (Ana Ekrana Ekle) için güven veren ve kaliteli bir uygulama simgesi oluşturun.

Gizlilik Odaklı Projeler: Tüm süreç %100 tarayıcı tarafında bittiği için, gizli tutmanız gereken marka tasarımlarınızı sızdırma korkusu olmadan işleyin.

Bu araç nasıl kullanılır?

  1. Tasarımınızın en net halini seçin. En iyi sonuçlar için 512x512 piksel boyutunda, kare ve yüksek kaliteli bir PNG dosyası yükleyin. 'Görsel Seç' diyerek veya sürükleyerek işlemi başlatın.
  2. Logonuz yüklendiğinde aracımız aynı anda; 192x192 (Genel), 512x512 (Splash Screen) ve 'maskable-icon-512x512' gibi temel dosyaları üretir. Siz sadece tek bir tuşa basarsınız, geri kalanı algoritmalarımız halleder.
  3. İşlem bittiğinde manifest.json dosyanızın içine yapıştırmanız gereken ikon dizisini (icons array) sizin için oluşturuyoruz. 'Kodları Kopyala' butonuna basarak işinizi saniyeler içinde bitirin ve tüm paketi ZIP olarak indirin.

İlgili araçlar

SSS

PWA için hangi dosya formatı en iyisidir?
Standart ve zorunlu olan format PNG'dir. Şeffaf PNG dosyaları her türlü arka plan rengine uyum sağladığı için en çok tercih edilenidir.
'Maskable' ikon ne işe yarar?
Android cihazlar uygulama ikonlarını farklı şekillerde (kare, daire, squircke) gösterebilir. Maskable ikon, ikonun her şekilde düzgün görünmesini garantileyen bir özelliktir.
Manifest.json'a hangi ikonları eklemeliyim?
En azından 192x192 ve 512x512 piksellik ikonları eklemelisiniz. Aracımız size kopyalamanız için tam bir JSON listesi verir.
PWA ikonum yüklemeden sonra neden görünmüyor?
Bunun sebebi genellikle manifest.json'da belirtilen dosya yollarının yanlış olmasıdır. İkonları 'images' gibi bir klasöre koyuyorsanız yolların başına '/images/' eklediğinizden emin olun.