Welcher Template-Entwickler kennt das nicht, in Photoshop hat man eine Box mit Ebenenstile wie z.B. Schlagschatten, Inneren Schatten, Verlauf oder einfach nur mit abgerundete Ecken gestaltet und muss diese Stile jetzt in CSS übertragen, oftmals ist das ein wenig fummelig bis man den Stile so hat, wie er in der Vorlage zu sehen ist. Jetzt gibt es allerdings eine Alternative dazu, die Extension CSS3Ps (http://css3ps.com)  übernimmt genau das für einen. Schluss mit dem rumprobieren und kontrollieren, wie genau den der Winkel oder der Abstand war.
Von Photoshop zum Browser mit nur einem Klick
Einfach die gewünschte Ebene oder auch mehrere Ebenen in Photoshop auswählen, dann ein Klick auf das Plugin-Bedienfeld, kurze Wartezeit und schon bekommt man ein wunderbar und recht sauberen CSS3-Code, womit unser Objekt bzw. die ausgewählte Ebene im Browser generiert werden kann.
Und als wäre das nicht schon genug, es können nicht nur Ebenen-Stile der gewählten Ebenen generiert werden, sondern auch die CSS Schrift-Eigenschaften, wie Schriftname oder Größe wodurch man sich doch einige Zeilen CSS-Code selbst schreiben sparen kann.
Denn CSS Code kann man im Anschluss von der Plugin-Website auf die vom Plugin zum generieren des Codes zurück gegriffen wird kopieren, zusätzlich findet man dort auch eine kleine Objekt-Vorschau des generierten Codes.
Das Plugin ist völlig kostenlos und für Photoshop CS3 bis CS6 nutzbar. Dabei unterscheidet sich allerdings die Nutzung zwischen den beiden älteren Photoshop Versionen CS3, CS4 und den neueren Versionen CS5, CS6.
CSS3Ps mit Photoshop CS5 und CS6
In den neueren Versionen funktioniert das ganze als Plugin bei dem das Script in den Adobe Extension Manager importiert wird und das passende Plugin-Bedienfeld im Anschluss in Photoshop nur noch eingeblendet werden muss. Danach trennt einem nur noch die Auswahl der Ebene und ein Klick zum gewünschten CSS-Code. Wie genau das ganze in der Praxis funktioniert erklärt dieses Video:
CSS3Ps mit Photoshop CS3 und CS4
In den beiden älteren Versionen wird das Script das man sich runterlädt nach der Ebene von der man die CSS Eigenschaft generieren möchte in Photoshop unter „Datei -> Scripten -> Durchsuchen…“ ausgewählt. Von hier aus funktioniert das Plugin wie auch in den neueren Versionen in dem sich die Website mit dem gewünschten CSS-Code öffnet.
Das CSS3 Photoshop-Plugin kann auf der Plugin-Website (http://css3ps.com) für die jeweilige Photoshop Version runtergeladen werden.
