Wir leben in einer Zeit wo Bilder sehr wichtig sind. Bilder transportieren oft mehr als einfache Sätze und das ist ein Segen wie auch ein Fluch. Der Fluch ist, man weiss nie wie die Wirklichkeit aussieht, überall wird nur manipuliert oder weggelassen, aber etwas ist auch cool und zwar hat man viele Filter um die graue, triste Welt schöner zu machen.
Ich denke genau aus diesen Gründen ist Instagram so erfolgreich. Man kann sich da eine eigene Wirklichkeit schaffen und dem Alltag kurzzeitig entfliehen.
Heute möchte ich euch zeigen, wie man solche Filter auch auf einer Webseite einbauen kann – denn es gibt auch hier CSS Filter die fast so stark sind wie die auf Instagram.
Heute möchte ich euch 10 solche Filter vorstellen.
Das Originalbild
Ich nehme diese kleine Blumenwiese als Beispielbild und die Filter werden via CSS eingebaut. Die Bilder sind immer gleich aufgebaut, auf der rechten Seite seht ihr das Resultat und auf der linken Seite den Code.
Blur Filter
Mit diesem Filter macht man alles unscharf.
Greyscale Filter
Mit diesem Filter kann man das Bild in Grautöne umwandeln.
Sepia Filter
Mit diesem Filter kann man Bilder künstlich altern lassen.
Saturation Filter
Mit diesem Filter kann man die Sättigung der Farben im Bild verstärken oder reduzieren.
Hue Rotation Filter
Mit diesem Filter kann man die Farben drehen. Ich weiss das klingt jetzt etwas komisch, aber stellt euch einen Farbenkreis vor und ihr könnt mit Grad die Farben nach links oder rechts verändern.
Invert Filter
Mit diesem Filter kann man die Farben umkehren
Opacity Filter
Wenn ihr Bilder durchsichtiger machen wollen, braucht ihr den Opacity Filter. Damit lässt sich nämlich regeln wie fest durchsichtig das Bild sein sollte.
Brightness Filter
Mit diesem Filter kann man die Helligkeit des Bildes anpassen.
Contrast Filter
Mit diesem Filter kann man die Kontrastfarben des Bildes einstellen.
Video
Wer mehr wissen will, kann hier noch das Video schauen. Hier zeige ich direkt wie man die Bilder verschönern kann.
0 Kommentare
Trackbacks/Pingbacks