Using jQuery UI Themeroller to customize a theme

jQuery UI themeroller is a great utility to design your own jQuery UI theme. It allows you to customize the look and feel of the theme completely. The themeroller page can be found at http://jqueryui.com/themeroller/. On opening this page, you will find a box on the left-hand side with three tabs. The first tab is called Roll Your Own, the second tab is Gallery, which has 24 prebuilt themes available, and the third tab is Help. We are going to look at the first tab and its different options to customize the theme. Here is how the first tab looks:

Changing any value in this left-hand side box instantly changes the look of the elements on the page, so you can see how the theme is going to look.

Let's look at the different options available to customize the theme:

• Global styles: The following are the global styles that can be applied:
  • Font settings: These settings specify the global font name and the font size. If you are planning to use a...