avatar
Görüntü avatarları
Resimler kullanarak avatarları sergileyin. Bu avatarlar genellikle dairesel olup kullanıcı profil resimlerini gösterebilir.
Harf avatarları
Görüntüler mevcut değilse, kullanıcıları veya nesneleri temsil etmek için avatarların içinde harfler kullanın. Bu, baş harfleri göstermek için faydalı olabilir.
CUI CUI CUI
Simgeler avatarları
Avatarlar içinde simgeler kullanarak ölçeklenebilir vektör grafikler (SVG) ile görsel temsil sunun.
Yuvarlak avatarlar
Daha yumuşak, daha az köşeli bir görünüm sağlamak için .rounded sınıfını ekleyerek yuvarlak köşeleri olan avatarlar oluşturun.
CUI CUI CUI
Kare avatarlar
Daha keskin bir görünüm için köşeleri kaldırmak amacıyla .rounded-0 sınıfını kullanarak kare avatarlar oluşturun.
CUI CUI CUI
Boyutlar
Daha büyük veya daha küçük versiyonlar için avatarların boyutunu ayarlamak için .avatar-sm, .avatar-md, .avatar-lg ve .avatar-xl sınıflarını kullanın.
CUI CUI CUI CUI CUI
Yığılmış avatarlar
Bir grup kullanıcı veya öğeyi temsil etmek için bir yığın içinde birden fazla avatarı görüntüleyin, daha fazla avatar görüntülenemiyorsa ek sayıyı gösterin.
Durumlu avatarlar
Çevrimiçi veya çevrimdışı durumunu göstermek için avatarlar üzerine durum göstergesi ekleyin, kullanarak .avatar-status sınıfını kullanın.
CUI
Özelleştirme
CSS değişkenleri
Avatarlar, gerçek zamanlı özelleştirmeyi geliştirmek için .avatar üzerinde yerel CSS değişkenleri kullanır. CSS değişkenlerinin değerleri Sass ile ayarlanır, böylece Sass özelleştirmesi de desteklenmektedir.