Görselin Rengini CSS İle Nasıl Değiştirebilirim?

06-02-2019, 00:40:11

Aradım aradım bulamadım, color ve background'ın haricinde görsel filtre eklemek için de CSS kodu var ancak benim istediğim <img src="kaynak"> olarak eklenmiş PNG görsele #FFFFFF şeklinde renk vermek. Bunu nasıl yapabilirim?

06-02-2019, 00:42:13

#2

orcuntuna

resmin bulunduğu divin arkasına ffffff verin resmin hoverına da opacity 0.5 tarzında bir değer verin üstüne gelince renkler beyazlayacaktır 000000 yaparsanız siyahlar

06-02-2019, 00:56:13

#3

~~sReborn~~

Üyeliği durduruldu

@orcuntuna; bu resmen çakallık

Bende HTML'de resmin rengini nasıl değişiyorlar diyordum

06-02-2019, 00:57:37

#4

SkyGhostAir

orcuntuna adlı üyeden alıntı: mesajı görüntüle

resmin bulunduğu divin arkasına ffffff verin resmin hoverına da opacity 0.5 tarzında bir değer verin üstüne gelince renkler beyazlayacaktır 000000 yaparsanız siyahlar

Böyle sadece opacity vermiş oluruz ve degere göre şeffaflaşarak arkaplan rengini alır. Benim yapmak istediğim logo'nuın rengini CSS ile değiştirmek. Yanlış anlattım galiba.

06-02-2019, 01:05:11

#5

FSahin

SkyGhostAir adlı üyeden alıntı: mesajı görüntüle

Böyle sadece opacity vermiş oluruz ve degere göre şeffaflaşarak arkaplan rengini alır. Benim yapmak istediğim logo'nuın rengini CSS ile değiştirmek. Yanlış anlattım galiba.

Normalde logoyu SVG'ye çevirirseniz eğer SVG renk değişimi sağlayabilirsiniz. SVG renk değişimi içinse fill'i kullanmanız gerekiyor.

Onun için şurayı inceleyebilirsiniz:

https://css-tricks.com/cascading-svg-fill-color/

Bir diğer yöntem ise eğer doğru rengi bulabilirseniz filter: hue-rotate kullanmak. Örnek yaptım aşağıda:

https://jsfiddle.net/zqhLgmtd/1/

06-02-2019, 02:52:14

#6

SkyGhostAir

FSahin adlı üyeden alıntı: mesajı görüntüle

Normalde logoyu SVG'ye çevirirseniz eğer SVG renk değişimi sağlayabilirsiniz. SVG renk değişimi içinse fill'i kullanmanız gerekiyor.

Onun için şurayı inceleyebilirsiniz:

https://css-tricks.com/cascading-svg-fill-color/

Bir diğer yöntem ise eğer doğru rengi bulabilirseniz filter: hue-rotate kullanmak. Örnek yaptım aşağıda:

https://jsfiddle.net/zqhLgmtd/1/

Benim daha çok yapmaya çalıştığım şey şu: https://codepen.io/muratdinc/pen/YBrZjv Yazıya uyguladığım rgb renk değişimi logo'ya uygulamak.

06-02-2019, 11:02:26

#7

orcuntuna

SkyGhostAir adlı üyeden alıntı: mesajı görüntüle

Benim daha çok yapmaya çalıştığım şey şu: https://codepen.io/muratdinc/pen/YBrZjv Yazıya uyguladığım rgb renk değişimi logo'ya uygulamak.

komple renk vereceksiniz fsahin in dediği gibi svg ye çevirip fill: renk kodu şeklinde değiştireceksiniz png jpg gibi resimlere renk veremezsiniz