Rehberler ve Makaleler
Geliştiriciler ve tasarımcilar için vektör ve 3D ikon kütüphanesi
Web siteleri, mobil uygulamalar ve arama motorlari için net vektör ikonlari tasarlamayi, iyilestirmeyi, cevirmeyi ve yayinlamayi ogrenin.
SVG mi PNG mi: Hangi Formatı Kullanmalısınız?
Web sitesi ikonları, logolar ve arayüzler için SVG kullanın çünkü vektör çizgiler her ekranda net kalır. E-posta imzaları veya sabit pikselli görseller için PNG tercih edin.
CSS ile SVG İkonları Nasıl Hareketlendirilir?
Satır içi SVG etiketine bir CSS sınıfı ekleyin ve transform veya stroke-dasharray keyframe kuralları uygulayın. Canlı düzenleyicimiz JavaScript olmadan akıcı animasyonlar üretir.
SVG İkonları Figma da veya Tarayıcıda Nasıl Düzenlenir?
SVG Nexus tan SVG kodunu kopyalayıp doğrudan Figma veya Illustrator tuvaline yapıştırın ya da Vektör Stüdyomuzda tarayıcı üzerinden düzenleyin.
SVG İkonları React, Next.js ve Vue da Nasıl Kullanılır?
Herhangi bir ikon sayfasında React TSX veya Vue 3 sekmesini seçerek Tailwind CSS ve currentColor uyumlu hazır bileşen kodunu kopyalayın.
Satir ici SVG ve resim etiketi
Uzerine gelince renk değişimi ve CSS animasyonu gerekiyorsa satir ici SVG veya bileşen kullanin. İkonun resim aramasinda cikmasini istiyorsaniz genislik, yukşeklik ve alternatif metinle resim etiketi kullanin.
Gradyan ve kirpma kimlik cakismalarini onleyin
Çok renkli setler paint0_linear gibi ic kimlikleri tekrar kullanir. Ayni sayfada iki ikon ayni kimligi paylasirsa yanlis gradyan cizilir. SVG Nexus her ic kimlige ikon bazinda kendi alanini verir.
Erisilebilir ikonlar ve RTL aynalama
Susleme amacli ikonlari aria-hidden ve focusable false ile gizleyin. Yalnizca ikon iceren dugmelere net bir aria-label verin. Sagdan sola diller için oklari yatay olarak cevirin.
Ucuncu taraf SVG dosyalarini temizleyin
SVG bir XML biçimidir, bu yüzden güvenilmeyen dosyalar betik ve olay isleyicileri tasiyabilir. Betik dugumlerini kaldirin ve SVG dosyalarini siki güvenlik politikasi ve nosniff basligi ile sunun.
Pratik SVG Rehberleri ve Eğitimleri
SVG mi PNG mi: Hangi Formatı Kullanmalısınız?
Web sitesi ikonları, logolar ve arayüzler için SVG kullanın çünkü vektör çizgiler her ekranda net kalır. E-posta imzaları veya sabit pikselli görseller için PNG tercih edin.
CSS ile SVG İkonları Nasıl Hareketlendirilir?
Satır içi SVG etiketine bir CSS sınıfı ekleyin ve transform veya stroke-dasharray keyframe kuralları uygulayın. Canlı düzenleyicimiz JavaScript olmadan akıcı animasyonlar üretir.
SVG İkonları Figma da veya Tarayıcıda Nasıl Düzenlenir?
SVG Nexus tan SVG kodunu kopyalayıp doğrudan Figma veya Illustrator tuvaline yapıştırın ya da Vektör Stüdyomuzda tarayıcı üzerinden düzenleyin.
SVG İkonları React, Next.js ve Vue da Nasıl Kullanılır?
Herhangi bir ikon sayfasında React TSX veya Vue 3 sekmesini seçerek Tailwind CSS ve currentColor uyumlu hazır bileşen kodunu kopyalayın.