Design a theme for Google Chrome

Step 3
The pop-up window says the image needs to be 30 pixels but experimentation has shown us that a better result can be achieved with an image that is 50 pixels high. Launch your graphics program and create a colour panel that is 50 pixels high and 50 pixels wide and then use the File Save As command to save it as a PNG file.

In Paint, a 50x50-pixel image can be created by using the Resize option in the Image group on the Home tab. Flip back to the Theme Creator and click ‘frame’ and then click the Choose File button. Navigate to where the colour block picture you just created is stored, select it and click Open.

Step 4
After a second the coloured block appears in the left-hand panel and is applied to the preview so we can see what it looks like. Notice too that the theme creator automatically applies the correct colour to the non-active tab (the one that says ‘Chrome’).

Next, let’s add a colour to the toolbar in the same way. Notice that this time, the pop-up window suggests the graphic needs to be 120 pixels high. (Note that these items don’t need a specific width because they will be tiled automatically.)

Step 5
Now flip back to your graphics program to create a coloured box that’s 120 pixels high and 50 pixels wide and save it as a PNG. We have added a gradient tint to ours so it’s green at the top and fades to white at the bottom because it produces a nice effect.

You can of course use any colour you like. Flip back to theme creator and click the ‘toolbar’ item, click the Choose File button and add it in the same way as you did in the previous step. Then hover the pointer over the ‘tab background’ item.

Step 6
We think the tab background looks fine so we will leave this setting as it is and click ‘new tab page background’ instead. Here it’s possible to use either a small image and have the program repeat - or ‘tile’ it - as in the previous steps, or a single large image;

Theme Creator suggests this should be larger than 800x600 pixels. To demonstrate how tiling works we are going to use the Computeractive logo. Click Choose File, then find the image you want to use and add it.