Layer 4 copy

Upload your PSD file...

Take a quick look at the Guidelines to see how to prepare your PSD file


Please wait - we are now uploading and converting your file...


Wait! You can upload your PSD, but you aren't logged in! If you submit now, you won't get any of the cool Unlimited features. You'll just get plain XHTML and CSS DIVs. Create a new account to use all the great Unlimited features free for 2 weeks.

Forms and Centering

Forms and Centering

Here's a new video tutorial to show you how you can have psd2css Online automatically generate html forms for you. You'll see how to have psd2css Onlin center your page for you too.

Here are .psd files and the resulting index.php file from the tutorial:

Comments Box

Thanks for the great video, but how do we take this results to our dreamweaver or at the point we intend putting this comments box. can i copy the css codes and paste to the code area at the point i want it to be?

simple contact form

Hi Shaun,

can you make a tutorial how to make a simple contact form pleasse.:)

more power to you!!!

Hey Russel - How about this

Hey Russel -

How about this one:

That'll be a pretty good start at least.


What do you name a psd layer

What do you name a psd layer for check boxes??


Wow - super old post that I

Wow - super old post that I didn't catch.
We don't currently have a feature for check boxes, but you can definitely add them to the HTML by hand. Here is some documentation:



How can I make a contact form though? I am a bit confused on that.



Similar to the video

Hi Ethernetkid -

You would make _edittext fields similarly to the way the 2 fields are made in the video. You would probably also want a _textarea layer for the Body: part of your form (it will make a multiline textarea field instead of a single line edit field).

That's how you would make the form. Then it would be up to you to 'point' the form to a script that does something interesting. By default the form points right back at the same page. You could by hand add PHP code to the page to handle that. If you wanted to point the form to a script called formmail.php for example, you would find the line in the generated HTML file that looks something like this:

< !-- This is 'b_center_form' -->
  < div id="Layer-1" >
    < form name="psd2cssForm" action="" method="post">

It will be near the comment that includes the name of your form layer - in my case the form layer was called b_center_form in Photoshop.

What you want to do is add the name and location of the script you want to point your form at in that action section. So when your done, that same code would look like this:

< !-- This is 'b_center_form' -->
  < div id="Layer-1" >
    < form name="psd2cssForm" action="formmail.php" method="post">

formmail is the name of a very well known script that comes in a bunch of different languages that will make your contact form function. You might need to change the names of some of the generated input fields by hand to match what formmail is expecting to get it to work.


I can't get text feilds to work

I add the custom layer names and everything "email_inputtext" but no text fields show up the only thing that works is my submit button and i also add a layer named "_form" but still nothing.Is it cause i have a lot of groups and different layers?NEED FAST HELP!Thanks.

Hey JJProductions - Should

Hey JJProductions -

Should work - can you send me the PSD file you are using? I'll take a look.



copyright (c) 2009 psd2css Online, Inc.



User login

Become a Fan of our Facebook Page

Need help or have a question?

| Privacy | Terms of Use |

copyright (c) 2008, 2009, 2010, 2011 psd2css Online, Inc.
Patent Pending

Syndicate content