Color theory is a massive subject in its own right! But often, the colors in your site can be based on your main image. The image you have decided to use that will be part of the ‘look/feel’ for your design.

One thing I always remember, and you can look at any colorful garden to check this out, is that nature never clashes. Nature puts some of the most outrageous colors together without a problem despite our human rules.

Usually I will use a color picker to check out colors in an image, but here is an online tool that will do the job quickly for you.
Read the rest of this entry »

Perhaps you have found a really good Joomla! Template but you want to change the color scheme. You know how to change the colors in the CSS style sheet but what about those gradient images provided that are now the wrong color?

First, get the image properties of the gradient you need to change. It’s easy in Firefox – right-click on the image and choose ‘view Background Image’. When the image opens, right-click again on the image and choose properties. In properties it will give you the dimensions (width always first, height second). Write them down… At this stage, also make a note of the filename of the image as it will be easier for you to use the same filename for your new image – noting whether it is a.png or a .jpg.

For this example, I made 100px x 100px images using the dark gray at the top of this blog (#191a1a) and the light gray at the bottom (#c0c0c0) adding the red (#990000) and white (#ffffff) for the 4 color. This time I chose to make .jpg files.

Of course you can make gradients in your favorite graphics program but this is the easy way – try this online Gradient Tool!

To use, simply replace the original gradient image with your new one in your template images folder.

Have a little fun!

Ever tried the Tartan Generator for a Seamless Background Image? We did and came up with a Joomla! Fast Track Tartan…

diagonal tartan

horizontal tartan

all we need are the bagpipes now!

With the ‘fashion’ for Joomla! templates with rounded corner module design, sometimes a square image just doesn’t look right. If you are graphics software savvy (The Gimp, Photoshop etc) you will be able to do this yourself but did you know there is an online tool that you can use? With one click the job is done!

A couple of examples (don’t forget to change the background color to match the background where the image will appear on your site):

Rounded Corners Size 5

Rounded Corners Size 9

Easy and free – try it for yourself:
roundpic.com

Make your own typography cloud – add words, use your rss feed from your website or your blog or even use your del.icio.us tags… Here is a cloud made with this blog’s RSS Feed:

Just a bit of fun and design courtesy of Wordle who say:

“Wordle is a toy for generating “word clouds” from text that you provide. The clouds give greater prominence to words that appear more frequently in the source text. You can tweak your clouds with different fonts, layouts, and color schemes. The images you create with Wordle are yours to use however you like. You can print them out, or save them to the Wordle gallery to share with your friends.”