OBS Studio'da Tarayıcı Kaynağını Şeffaf Hale Getirme

Yayınlanan: 2026-02-19

Yani OBS Studio'ya bir tarayıcı kaynağı eklediniz. Güzel. Ama şimdi çevresinde çirkin beyaz veya siyah bir kutu görüyorsunuz. Hoş değil. Merak etme. OBS'de tarayıcı kaynağınızı şeffaf hale getirmek düşündüğünüzden daha kolaydır. Sadece doğru ayarlara ihtiyacınız var. Ve belki bir veya iki küçük değişiklik.

TLDR: OBS Studio'da bir tarayıcı kaynağını şeffaf hale getirmek için web sayfanızın şeffaf bir arka planı olması ve OBS'nin arka plan rengini zorlamaması gerekir. Tarayıcı kaynağı özelliklerinde sayfa arka planını şeffaf olarak ayarlayın. Gerekirse kaplamanızın CSS'sini arka planı kullanacak şekilde düzenleyin: şeffaf; . İşiniz bittiğinde, kaplamanız akışınızla temiz bir şekilde karışacaktır.

İlk olarak, Tarayıcı Kaynağı Nedir?

OBS'deki bir tarayıcı kaynağı yerleşik bir mini web tarayıcısıdır. Web sitelerini doğrudan sahnenize yükler. Bu aşağıdakiler için mükemmeldir:

  • Uyarıları yayınla
  • Sohbet katmanları
  • Etkinlik listeleri
  • Özel HTML widget'ları
  • Akış etiketleri

OBS, bir web sitesinin ekran görüntüsünü almak yerine onu doğrudan yükler. Bu onu temiz ve keskin yapar. Ancak şeffaflık yalnızca web sitesinin kendisi buna izin verdiğinde işe yarar.

Anahtar fikir bu. OBS, sayfaya eklenen bir arka planı sihirli bir şekilde kaldıramaz.

1. Adım: OBS'ye Tarayıcı Kaynağı Ekleme

Henüz yapmadıysanız sıfırdan başlayalım.

  1. OBS Studio'yu açın.
  2. Kaynaklar panelinize gidin.
  3. + düğmesine tıklayın.
  4. Tarayıcı'yı seçin.
  5. Ne istersen onu adlandır.
  6. Tamam'ı tıklayın.

Şimdi URL'nizi URL alanına yapıştırın. Gerekirse genişliği ve yüksekliği ayarlayın. Daha sonra Tamam'ı tıklayın.

Artık tarayıcı kaynağınızın önizleme penceresinde göründüğünü görmelisiniz.

Sağlam bir arka plan varsa okumaya devam edin.

Resim postmeta'da bulunamadı

Adım 2: Web Sitesi Arka Planının Şeffaf Olduğundan Emin Olun

Bu en önemli adımdır.

Kaplama sayfanızın şeffaf bir arka planı olmalıdır. Sayfada beyaz, siyah veya herhangi bir düz renk kullanılıyorsa OBS bunu gösterecektir.

HTML veya CSS'yi kontrol ediyorsanız şunu ekleyin:

vücut {
  arka plan: şeffaf;
}

Veya daha da iyisi:

HTML, gövde {
  arka plan rengi: rgba(0, 0, 0, 0);
}

Bu tam şeffaflığı zorlar.

Üçüncü taraf bir uyarı veya yer paylaşımı hizmeti kullanıyorsanız ayarlarına bakın. Birçoğunun şöyle bir şey söyleyen bir onay kutusu vardır:

  • Şeffaf Arka Planı Etkinleştir
  • Arka Planı Devre Dışı Bırak
  • Özel CSS

Varsa açın.

Değilse, özel CSS enjekte edip edemeyeceğinizi kontrol edin. Bu genellikle sorunu çözer.

3. Adım: OBS Tarayıcı Kaynak Ayarlarını Kontrol Edin

OBS'de tarayıcı kaynağınıza sağ tıklayın.

Özellikler'i seçin.

Şimdi ayarlara dikkatlice bakın.

Emin olmak:

  • Doğru URL yapıştırıldı.
  • Genişlik ve Yükseklik kaplama boyutunuza uygundur.
  • Özel CSS kutusu varsa arka plan rengini zorlamaz.

Özel bir CSS alanı görürseniz şunları da ekleyebilirsiniz:

body { arka plan rengi: rgba(0,0,0,0) !important; }

Değişikliklerden sonra Tamam'ı tıklayın.

Her şey doğru ayarlanmışsa arka plan kaybolmalıdır.

Yaygın Sorun: Beyaz Arka Plan Hala Görünüyor

Bu çok sık oluyor.

İşte nedeni:

  • Web sitesinin varsayılan beyaz bir arka planı vardır.
  • CSS doğru şekilde uygulanmadı.
  • Kaplama platformu stili zorlar.

Hızlı düzeltmeler:

  1. Tarayıcı kaynağını yenileyin (sağ tıklayın → Yenile).
  2. OBS'yi yeniden başlatın.
  3. Tarayıcı önbelleğini temizleyin (tarayıcı kaynak özelliklerinin içinde).

Evet, önbellek sorunlara neden olabilir. Özellikle CSS'yi değiştirdikten sonra.

Bonus İpucu: Şeffaflık için PNG ve WebM kullanın

Tarayıcı kaynağınız resimler veya animasyonlar görüntülüyorsa bunların şeffaflığı desteklediğinden emin olun.

En iyi formatlar:

  • Resimler için PNG
  • Video için alfa kanallı WebM
  • GIF (sınırlı kalite, ancak çalışıyor)

MP4 kullanıyorsanız şeffaflık çalışmayacaktır. MP4 alfa kanallarını desteklemez.

Bu bir OBS sorunu değil. Bu bir format sınırlamasıdır.

Ya Web Sitesini Düzenleyemiyorsanız?

Bazen sayfayı kontrol edemezsiniz.

Belki bir widget'tır. Veya CSS seçeneği olmayan üçüncü taraf bir araç.

Hala seçenekleriniz var.

1. Seçenek: Chroma Key'i kullanın

Arka plan parlak yeşil veya başka bir düz renkse onu kaldırabilirsiniz.

  1. Tarayıcı kaynağını sağ tıklayın.
  2. Filtreler'i seçin.
  3. + öğesine tıklayın.
  4. Chroma Key'i seçin.

Arka plan kaybolana kadar ayarları yapın.

Bu, parlak yeşil arka planlarda en iyi sonucu verir.

Ama mükemmel değil. İnce ayrıntılar zarar görebilir.

Resim postmeta'da bulunamadı

Seçenek 2: Kırpın

OBS'de kaynağın kenarlarını sürüklerken ALT tuşunu basılı tutun.

Bu, çerçevenin bazı kısımlarını kırpar.

İstenmeyen arka plan kenarlarını bu şekilde gizleyebilirsiniz.

Çok basit. Ve hızlı.

Gelişmiş Yöntem: Özel HTML Kaplamaları İçin

Kendi kaplamalarınızı oluşturursanız şeffaflık kolaydır.

HTML'nizi şu şekilde başlatın:

<!DOCTYPEhtml>
<html>
<kafa>
<stil>
  HTML, gövde {
    kenar boşluğu: 0;
    dolgu: 0;
    arka plan: şeffaf;
    taşma: gizli;
  }
</style>
</head>
<gövde>

<!-- İçeriğiniz burada -->

</body>
</html>

Bu, kenar boşluklarını kaldırır ve sayfanın temiz ve tamamen şeffaf kalmasını sağlar.

Ayrıca şunu eklemekten kaçının:

  • Arka plan resimleri
  • Arka plan degradeleri
  • Varsayılan tema renkleri

Minimum düzeyde tutun.

Gerisini OBS halledecektir.

Performans İpuçları

Şeffaflık harika. Ancak tarayıcı kaynakları CPU'yu kullanabilir.

İşleri düzgün tutun:

  • Küçük kaplama boyutları kullanın.
  • Gereksiz animasyonları devre dışı bırakın.
  • Gerekmiyorsa kare hızını düşürün.
  • Ağır JavaScript'ten kaçının.

Bir kaplamanın gecikmesi durumunda bu bir şeffaflık sorunu olmayabilir. Çok karmaşık olabilir.

Hızlı Şeffaflık Kontrol Listesi

Bir şeyler yolunda gitmiyorsa şu listeye göz atın:

  • Web sitesinin arka planı şeffaf olarak ayarlandı mı?
  • arka planı kullandınız mı: şeffaf; CSS'de mi?
  • Kaynağı yeniledin mi?
  • Önbelleği temizledin mi?
  • Resim formatları şeffaflığı destekliyor mu?
  • OBS güncel mi?

Sorunların çoğu beş dakikadan kısa sürede çözülür.

Şeffaflık Neden Önemlidir?

Şeffaf kaplamalar profesyonel görünür.

Sahnenize karışırlar.

Çirkin kutular yok.

Garip sınırlar yok.

Uyarılarınız oyun veya kamera üzerinde doğal olarak gezinir.

Ve akışınız anında daha temiz görünür.

Küçük detay. Büyük fark.

Son Düşünceler

OBS Studio'da bir tarayıcı kaynağını şeffaf hale getirmek karmaşık değildir.

İlk başta gizemli geliyor.

Altın kuralı unutmayın:

Şeffaflık web sitesinin kendisinden gelmelidir.

OBS, sayfanın çıktısını tam olarak gösterecektir. Daha fazlası değil. Daha az değil.

CSS'niz şeffaf bir arka plan kullandığında, OBS sihri otomatik olarak yapar.

Şimdi gidip şu kaplamaları temizle.

Yayınınız bunu hak ediyor.