Photoshop: Web Graphics – Inset Bars

Photoshop » Web Graphics » Inset Bars


Inset Bars Step 1

Step 1

Neue Datei über [STRG] + [N] mit gewünschter Hintergrundfarbe erstellen.

Nun eine neue Ebene über der Hintergrundebene erstellen und mit dem Auswahlrechteck-Werkzeug eine Auswahl in beliebiger Länge und einer Höhe von 3 Pixel erstellen.

Inset Bars Step 2

Step 2

Die Auswahl auf der neuen Ebene mit schwarz ausfüllen und dann wieder zurück zur Hintergrundebene wechseln und diese aktivieren.

Jetzt auf Auswahl -> Weiche Auswahlkante… und dort einen Wert von 1 angeben und bestätigen.

Die ganze Auswahl mit den Cursor-Tasten nun 1 Pixel nach oben und 1 Pixel nach links verschieben.

Inset Bars Step 3

Step 3

über Bild -> Einstellen -> Helligkeit/Kontrast die Helligkeit auf -100 einstellen und bestätigen.

Mit Hilfe der Cursortasten die Auswahl nun 2 Pixel nach unten und dann 2 Pixel nach rechts verschieben.

Wieder über Bild -> Einstellen -> Helligkeit/Kontrast die Helligkeit diesmal auf +100 einstellen und bestätigen und dann die Auswahl aufheben.

Inset Bars Step 4

Step 4

Um z.B. solche Lüftungsschlitze für eine Metalloberfläche eines Interfaces zu bekommen, einfach die Schritte wiederholen und die Inset Bars in einem Abstand von 10 Pixeln untereinander anordnen. Die Einstellungen aus Schritt Nr. 3 müssen dann auch auf dem entsprechenden Hintergrund angewendet werden.


Photoshop » Web Graphics » Inset Bars

Validate XHTML Validate CSS