Svart-vita bilder på bloggen

Har du en bloggdesign som skulle passa bättre med genomgående svartvita bilder?
Skulle du vilja ha ett enkelt sätt att testa hur det skulle se ut utan att behöva redigera varenda bild du har i bloggen?

Då är det här inlägget något för dig.

Med hjälp av en liten kodtagg du lägger i din bloggs Malldesigner kan du enkelt förändra alla bilder du har på din blogg.
Även om du bloggar via en annan plattform (blogg.se eller wp t.ex. fungerar den här koden eftersom img = bild är en universiell förkortning för klassen bild. Då får du lägga in taggen i din stilmall/css-mall)

Gör så här:

Gå till din Malldesigner

I rutan för kod (Välj Avancerat - Lägg till CSS ) lägger du till nedanstående kod.

img {
  -webkit-filter: saturate(0%);
  filter: saturate(0%);
}

Klicka på Använd i blogg uppe till höger. Nu är alla bilder på din blogg svartvita.

Vill du hellre bara minska på färgåtergivelsen, göra dina bilder lite blackare, kan du ändra lite på siffran i koden tills dess att du får ett resultat du är nöjd med. Öka på procenttalet tills du hittar en nivå du gillar.

Det finns flera andra filter du kan använda på bilder, i stället för saturate kan du använda bland annat:

filter: sepia(100%);

filter: contrast(110%);

Genom att kombinera sepia eller saturate med contrast kan du få en bild med två effekter samtidigt. Då kan koden se ut så här, först färgåtergivelsen och sen styrkan på kontrast (bilden ser lite skarpare ut, skillnaden på ljusa och mörka detaljer ökar) direkt efter utan kommatecken:

img {
  -webkit-filter: saturate(0%) contrast(110%);
  filter: saturate(0%) contrast(110%);

}

Visst var det enkelt!


Så här kan det se ut: