Logonun üstüne gelince renkli olması

Siyah/beyaz Veya şeffaf logonun üstüne gelince logonun kendi rengine dönmesi olayı nasıl oluyor ? web sitelerinde referanslar kısmında oluyor genelde bunu nasıl yapabiliriz?

css hover ve js sanırım

https://codepen.io/nxworld/pen/ZYNOBZ

8. efekt

doğru

Teşekkür ederim . Bunu deniyeceğim ama fazla kod bilgim yok . Yapamazsam yardımcı olabilir misiniz?

Buradan deneyerek mantığını anlayabilirsin. https://www.w3schools.com/cssref/sel_hover.asp

Merhaba,

gorsele css ile siyah-beyaz efekti vererek, hover durumunda efekti deaktif edebilirsiniz.

Hocam logonuz renkli ise photoshop siyah beyaz yapın logo1 diye kayıt edin hover özelliğinde tekrar çağırın

<h2 id="demo08">8. Gray Scale</h2>
<div class="hover08 column">
  <div>
    <figure><img src="https://picsum.photos/300/200?image=244" /></figure>
    </div>
  <div>
    <figure><img src="https://picsum.photos/300/200?image=1024" /></figure>
  </div>
  <div>
    <figure><img src="https://picsum.photos/300/200?image=611" /></figure>
  </div>
</div>

<style>

/* Gray Scale */
.hover08 figure img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.hover08 figure:hover img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}
</style>

daha basit hali ise

<img class="img1" src="dosya_adresi.png" />

<style>
.img1{
filter: grayscale(100%);
}

.img1:hover{
filter: grayscale(0%);
}
</style>

Normal olunca;

filter: grayscale(100%);

hover olunca

filter: grayscale(0);