Creating your own themes is a really easy process, and I’m sure if you’ve figured out how to import the files, you’ve also learned to export them and how to tweak the colors to your particular fancy. That being said, I’m going to go ahead and explain it anyway.

Step 1: Find a color scheme

Finding a color scheme that both looks good together and can cover the various facets of web code can be tedious. Unless you’re a design nerd of have some level of OCD that requires that everything have the same six corresponding colors, using a web app to help you pick them is a lot easier.

I’ve found that one of the best places to start is with Adobe Kuler. I like to pick a cool looking Kuler group and base my colors around that. Kuler is also a great way to do this, because you can upload your own images and have Kuler extract the color theme automatically. If you’re not into Kuler, there are several other sites, including ColourLovers, Pictaculous and Daily Color Scheme that provide the same basic function. Get about 6 colors to work with.

Step 2: Assign The Colors To Code

In any particular language you’re going to have to have around 6 categories to assign colors to: Numbers, tags, attributes, comments, strings and functions (I realize this isn’t true across the board, but it’s true enough).

HTML is actually the language that you’ll have the most trouble giving colors to because it has to incorporate everything into one screen. But remembering that comments are comments, numbers are numbers and strings are strings regardless of the language helps in the ultimate coloration of the final product.

The easiest way to do it is to have Kuler up on one side of your screen and use the magnifying glass tool in the color selector screen just drag it over the color you want to assign. You could always drag the selector around the color wheel and shade it to taste, but I’ve never had that much time in my life.

Unfortunately, there’s no super quick way to do this, so you’re going to have to click on the color box next to the words and repeat the process until you’ve either finished or decided that you have something better to do. You can also use the radio boxes to the right of the color box to either bold or italicize the particular aspect of your code.

It’s important to realize that there are 5 different HTML color files: ASP-HTML, JSP-HTML, LassoScript-HTML, PHP-HTML and plain ol’ HTML. I usually only bother to change the PHP-HTML and HTML files, because I largely just edit wordpress themes. Honestly, you should only change the files you’re going to use the most.

Step 3: Export, Zip and Upload.

Finally, when you’ve gone through the process you just need to click the export button and save it to a file. It’s a good idea to export the original files (or you could just download them from here) just in case you want to restore everything to the factory settings.

You have to export each individual file and save them as the file type as the name in the designated folder. Either save just the files you will use most often or go through and make an entire theme.

Shortly, I’ll have a video ready that I’ll put here as a walkthrough. But it probably won’t be until Friday.

If you want to share them with others, leave me a comment and I’ll post them here on my site. I enjoy seeing people’s designs and want to create a library of coda seestyles that people can download from a single site.