Koyu arka planlar için logo nasıl beyaz yapılır?

Karanlık mod logosu, logonuzun siyah ya da koyu gri üzerinde net kalması için hazırlanmış bir sürümüdür: genellikle tamamen beyaz ya da koyu kısımları açık renge çevrilmiş marka renkleriniz. Bir tane hazırlamak için logonun koyu kısımlarını bir vektör düzenleyicide beyaza boyayın ya da dosyayı ücretsiz logoyu beyaz yapma aracına bırakın; ardından SVG ya da şeffaf PNG olarak kaydedin ve arka planın koyu olduğu her yerde kullanın.

Önce bir firmanın logosu mu gerekiyor? Ücretsiz Logo Finder logoyu web sitesi adresinden bulur ve koyu arka plana hazır şekilde beyaz, siyah ya da istediğiniz renkte indirir. Kaynaklar 4 Kasım 2026 tarihinde kontrol edildi.

Karanlık mod logosu nedir?

Karanlık mod logosu, bir logonun koyu zemin üzerindeki açık renkli sürümüdür ve arka plan koyu olduğunda kullanılır: karanlık moddaki bir web sitesi ya da uygulama, siyah bir tişört, mat siyah bir kart ya da koyu bir slayt. Tasarımcılar buna negatif logo da der. Logonun şekillerini korur, siyah üzerinde kaybolacak kısımları ise, örneğin siyah ya da lacivert yazıyı, beyazla ya da açık bir tonla değiştirir.

İnsanlar koyu temayı işletim sistemi ya da tarayıcı ayarlarından seçer; web siteleri de bu tercihi prefers-color-scheme medya özelliğiyle okur. Bu özellik “kullanıcının açık ya da koyu renk teması isteyip istemediğini algılamak” için kullanılır (MDN). Yalnızca beyaz arka planlar için hazırlanmış bir logo bu sayfalarda bozuk görünür; bu yüzden bir markanın iki sürüme de ihtiyacı vardır.

Karanlık mod logosuna ne zaman ihtiyaç duyarsınız?

Logonuzun koyu bir arka plan üzerinde durduğu her yerde karanlık mod logosuna ihtiyacınız vardır: koyu temalı bir web sitesi ya da uygulama, karanlık modda açılan bir e-posta, koyu bir slayt, video ya da sosyal medya kapağı ve siyah tişörtler, mat siyah kartlar, koyu renk üzerine yaldız ya da koyu bir çanta üzerine beyaz mürekkep gibi koyu ürünler. Tablo, her arka planı en iyi okunan sürümle eşleştirir.

Beyaz ya da yaldızlı bir logoyu üretilmeden önce mat siyah bir kartta görmek için logoyu ücretsiz 3D kredi kartı mockup oluşturucuya bırakın ya da Logo Finder aracında 3D kartta dene düğmesine basın: Tek tıkla logo, stüdyo ışığı altında gerçek boyutlu bir kartta altın yaldıza ya da kısmi laka dönüşür. Proofscene hesapları koyu arka planlar için bir, açık arka planlar için bir logo saklar; Logo Finder aracındaki Logom olarak kaydet düğmeleri bunlardan birini doğrudan şirketinizin logo ayarlarına ekler.

Logonun beyaz sürümü nasıl yapılır?

Logonun beyaz sürümünü yapmanın en hızlı yolu, içindeki her şekli beyaza boyamaktır; bu, logoyu beyaz yapma aracında tek tık, bir vektör düzenleyicide ise yaklaşık bir dakika sürer. Elinizdeki dosyaya uyan yöntemi seçin: her dosya için tek tıklık bir araç, vektörel ana dosya için bir tasarım programı ya da zaten bir web sayfasında olan logo için tek satır CSS.

1. Tek tıkla, ücretsiz

Logonuzu logoyu beyaz yapma aracına bırakın ve “Beyaz”, “Siyah” ya da “İstediğiniz renk” seçeneğini seçin: Logonun tamamı şeffaf arka plan üzerinde o tek renge döner. Araç PNG, JPG, WebP, GIF, AVIF, SVG, PDF, AI ve PSD dosyalarını kabul eder; tarayıcınızın içinde çalıştığı için dosyanız cihazınızdan hiç çıkmaz ve sonucu SVG, PDF, EPS ya da 4096 piksele kadar şeffaf PNG olarak indirir.

2. Illustrator, Figma ya da Inkscape'te

Vektör dosyasını açın, tüm şekilleri seçin ve dolgularını beyaza (#FFFFFF) ayarlayın; logoda kontur varsa konturları da. Parlak bir vurgu rengini korumak için bunun yerine yalnızca koyu şekilleri seçin. Sonucu siyah bir çalışma yüzeyinde görün, ardından ekranlar için SVG, baskı için PDF ya da EPS kaydedin. Hangi dosyanın nereye gideceğini Logo dosya formatları ve farkları rehberi anlatır.

3. Web sitesinde CSS ile

Bir web sayfasında tek satır kod, her logo görselini beyaza çevirir. brightness(0) görseli “tamamen siyah” yapar (MDN), invert(1) ise “tam bir ters çevirme uygular” (MDN) ve bu siyahı beyaza çevirir. Her rengi beyaza çevirdiği için en çok tek renkli logolara uyar.

.logo-on-dark {
  filter: brightness(0) invert(1);
}

Satır içi SVG olarak yerleştirilmiş bir logoda şekilleri fill="currentColor" değerine ayarlayın. currentColor anahtar sözcüğü “bir öğenin color özelliğinin değerini temsil eder” (MDN); böylece logo, çevresindeki sayfanın metin rengini alır: Karanlık modda açık renkli metin, beraberinde açık renkli bir logo getirir.

Canva, Photoshop ya da PowerPoint'te logo nasıl beyaz yapılır?

Bu uygulamaların her biri bir logoyu bir dakikadan kısa sürede beyaz yapabilir: Canva renklerini düzenleyebildiği logoları yeniden renklendirir, Photoshop bir logo katmanını bir kaplama ile beyaza çevirir, PowerPoint ise bunu resmin parlaklığıyla yapar. Uygulamanın yeniden renklendiremediği bir logo için beyaz sürümü bir kez ücretsiz logoyu beyaz yapma aracında hazırlayın ve onun yerine bu dosyayı ekleyin.

Canva'da

Tasarımınızdaki logoyu seçin. Renkleri araç çubuğunda renk kutucukları olarak görünüyorsa her kutucuğa tıklayın ve açılan renk panelinde beyazı seçin (Canva Yardım Merkezi). Canva'nın belirttiğine göre renk kutucukları görünmediğinde öğenin renkleri değiştirilemez; PNG ya da JPG görsel olarak yüklenmiş bir logoda olduğu gibi. Bu durumda beyaz PNG ya da SVG dosyasını ekleyin: “Yüklemeler” sekmesini açın, “Dosya yükle” düğmesine tıklayın ve dosyayı seçin (Canva Yardım Merkezi).

Photoshop'ta

Logoyu şeffaf arka planlı kendi katmanına yerleştirin, ardından tüm piksellerini beyaza çevirin: Beyaz bir renk kaplama (“Color Overlay”) katman stili bunu tek adımda yapar; açıklığı (“Lightness”) en yükseğe çekilmiş bir ton/doygunluk (“Hue/Saturation”) ayarlaması da aynı sonucu verir. Sonucu altına koyduğunuz koyu bir katman üzerinde kontrol edin, ardından asla JPG değil, şeffaflığı korunan bir PNG dışa aktarın; böylece beyaz logo şeffaf arka planını korur.

PowerPoint'te

Logoyu seçin, “Resim Biçimi” sekmesini açın, “Düzeltmeler” düğmesine, ardından “Resim Düzeltmeleri Seçenekleri” seçeneğine tıklayın ve “Parlaklık” kaydırıcısını en yüksek değere getirin (Microsoft Desteği). Şeffaf PNG'deki bir logo beyaza döner, arka planı ise şeffaf kalır; koyu bir slayta hazırdır. Aynı “Düzeltmeler” düğmesi Word'de de “Resim Biçimi” sekmesinde bulunur.

Hareket için ücretsiz dönen logo GIF'i yapma aracı, beyaz sürümü koyu arka plan üzerinde dönen bir logoya dönüştürür; döngüsel GIF ya da MP4 olarak.

Karanlık mod logosu saf beyaz mı olmalı?

Karanlık mod logosunun saf beyaz olması gerekmez: Fotoğraflarda, videolarda ve kalabalık arka planlarda en güvenli seçim tamamen beyazdır; düz siyah üzerinde ise parlak bir marka rengini koruyan iki renkli bir sürüm çoğu zaman markayı daha iyi yansıtır. Önemli olan her parçanın görünür kalmasıdır: Siyah, lacivert ve koyu kahverengi kısımlar açık renge dönmeli, sarı ya da açık mavi gibi parlak bir vurgu rengi ise olduğu gibi kalabilir.

Erişilebilirlik standardı seçimi size bırakır: WCAG standardına göre “bir logonun ya da marka adının parçası olan metin için kontrast şartı yoktur” (W3C). Aynı standardın büyük metin için belirlediği 3:1 oranı, insanların bir bakışta okuması gereken bir logo için yine de makul bir taban değerdir. Üç kontrol işe yarar:

• Amblemin altındaki slogan gibi ince çizgiler ve küçük metinler en güçlü kontrastı ister; bunlar için güvenli seçim beyazdır.
• Koyu temalarda yaygın olan koyu gri arka planlar orta tonlara siyahtan daha yakındır; bu yüzden logoyu yalnızca saf siyahta değil, gerçek arka planda kontrol edin.
• Kırmızı bir amblem gibi kimliği taşıyan marka renkleri çoğu zaman kalabilir; her birini, logonun en küçük boyutunda koyu arka plana karşı test edin.

Logo Finder aracında her logonun önizlemesini siyah, gri, beyaz, dama tahtası ve marka rengi arasında değiştirebilirsiniz; böylece her sürüm, duracağı zemin üzerinde değerlendirilir.

Web sitesinde karanlık mod logosu nasıl gösterilir?

Bir web sitesinde karanlık mod logosu göstermek için iki dosyayı da tarayıcıya bir <picture> öğesi içinde verin ve seçimi prefers-color-scheme medya özelliğine bırakın: Karanlık moddaki ziyaretçiler beyaz sürümü, diğer herkes orijinali görür. GitHub da README dosyalarında açık ve koyu görseller için aynı yöntemi kullanmanıza olanak tanır (GitHub değişiklik günlüğü). Kod şöyle:

<picture>
  <source srcset="/logo-white.svg" media="(prefers-color-scheme: dark)">
  <img src="/logo.svg" alt="Company name" width="200" height="50">
</picture>

Farklı site yapıları için iki yöntem daha vardır. Kendi açık ve koyu tema düğmesi olan bir site, logoyu temayı değiştiren CSS sınıfıyla değiştirebilir. Bir <img> etiketiyle yerleştirilmiş SVG ise kendi @media (prefers-color-scheme: dark) stillerini taşıyabilir; MDN'nin açıkladığı gibi bu stiller, SVG'yi barındıran sayfanın renk düzenini izler:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 50">
  <style>
    .mark { fill: #0e1b2c; }
    @media (prefers-color-scheme: dark) { .mark { fill: #ffffff; } }
  </style>
  <path class="mark" d="M10 10h40v30H10z"/>
</svg>

Karanlık mod logoları e-postada nasıl çalışır?

E-posta programları karanlık modu üç farklı şekilde ele alır; bu yüzden e-postadaki bir karanlık mod logosu üçünde de okunur kalmalıdır: Bazıları renklere dokunmaz, bazıları yalnızca açık arka planları ters çevirir, bazıları ise her şeyi ters çevirir. Litmus'un e-posta pazarlamacıları için hazırladığı karanlık mod rehberi, Şubat 2025 tarihli istemci tablosuyla programları şöyle gruplar:

Litmus üç çözüm önerir: şeffaf PNG kullanın, koyu bir logonun her arka planda okunması için “simgenin ya da logonun çevresine bir parlama veya düz beyaz kontur” ekleyin ve @media (prefers-color-scheme: dark) ile beyaz sürüme geçin; Litmus tablosuna göre bu yöntem macOS, iPhone ve iPad'deki Apple Mail'de çalışır (Litmus). İmza logosu boyutları web, sosyal medya, e-posta ve baskı için logo boyutları rehberinde yer alır.

Favicon'un karanlık mod sürümü gerekir mi?

Şeffaf arka plan üzerinde koyu renkli bir favicon'un karanlık mod sürümüne ihtiyacı vardır; çünkü koyu temada tarayıcı sekmeleri de koyudur. SVG bir favicon kendi @media (prefers-color-scheme: dark) stillerini taşıyabilir ve temayla birlikte renk değiştirebilir; web.dev'in uyarlanabilir favicon rehberine göre bu, Chromium tabanlı tarayıcılarda ve Firefox'ta çalışır. Diğer tüm tarayıcılar için yanına bir favicon.ico koyun (web.dev).

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">

En basit favicon, hiçbir geçiş gerekmeden iki temada da okunur: kendi düz marka rengindeki bir kare üzerinde amblem. Logo Finder aracının favicon paketi her logodan ICO dosyasını, 16-512 px arası PNG simgelerini ve site.webmanifest dosyasını oluşturur; favicon indirme aracı diğer sitelerin bunu nasıl yaptığını gösterir, logo boyutları rehberi ise her favicon boyutunu ve nerede kullanıldığını listeler. Bir firmanın logosunu önce elle bulmak için bir firmanın logosu nasıl bulunur rehberine bakın.