Page 1

Tutorial. How to create a theme for Google Chrome with Chromium Theme Creator by vhanla If you are not satisfied with the default theme that Google Chrome comes with, then you might want to change it. However, if you want to create your own theme, with Chromium Theme Creator you can. There have been ways to create themes based upon resource hacking of the original default.dll. However if you don't like to do that hard work, use this tool. First and foremost, Google Chrome comes with a file called “default.dll” which lies inside a directory named “themes” which is also located inside the installation directory but inside a special directory whose name depends upon the version of the Chrome version installed. For example: x:\Documents and Settings\<user name>\Local Settings\Application Data\Google\Chrome\Application\0.3.154.3\Themes\

For Windows XP x:\Users\<user name>\AppData\Local\Google\Chrome\Application\0.2.149.27\Themes\

For Windows Vista So, inside of that directory, there is a file named “default.dll” which basically is a resource file linked to a DLL file. As you noticed, I highlighted the version folder which changes according to updates. So it would be common to have more directories with different numbers in Chrome\Application directory, that is because there were updates done, but only one is valid. Now that you know that, replacing that only file with a new theme, Google Chrome will use that instead. Don't worry about changing manually because with Chromium Theme Creator you can replace it with just one click, literally. 1. Download and Install Chromium Theme Creator v2 You can obtain that software for free from http://www.codigobit.net/software/themeren.php Install as usual, but maybe administrator privileges would be required. Launch the program and you will see this.


2. Set up correctly the paths. In settings page you MUST, set up correctly the paths.

Chrome's path: This is used to launch the browser usually when changing a theme. Theme Path: This is the path I mentioned above, is where the new theme will be copied to, in case existed (which is for sure) it will be overwritten only if Chrome is not using it or any other program. Project Path: Just in case you want a special directory where all your theme projects lies, then this could be done here. However, it's not mandatory to save your projects in that directory, you can use any other location when saving your project. Image Editor: This tool, needs an external image editor. So you can use your favorite editor with it. Finally, save the changes to remember and not doing this again. Notice that if you are upgrading your browser version, Theme Path MUST be updated too. 3. Creating a new Theme Project. Return to Theme Creator Page and click on File button, it will show you a menu then click on New Theme.

After that a confirmation dialog will appear, click OK and save with the name you like.


Notice that the name you are going to use must not exist as a directory name there. That is because the project filename is used to create a directory with the same name which holds all necessary files to create the theme. For this tutorial, I'm going to port a theme from Opera, the Skin is called Benzo Grayed whose author is Ruben Vardanyan

So name it as you like. After saving, the needed files will be deployed in its respective directory. Then you will be taken to this page, where details of your authorship will be, so this information can be included in the theme file.

Save those changes, and next you will see this page.

This another viewer, shows the images from within the directory of the theme project. Is a reference to areas of images, for example, back button images, are separated be it for normal, over, pressed or disabled. So clicking on those areas, you will be taken to another page, where you can see those images.


As you can see, this is for back button images. By double clicking you can open that image file with the Picture Editor you set up in the settings page. If it fails to open, an alternative way is to click on the right side button â&#x20AC;&#x153;Open the directory with Windows Explorerâ&#x20AC;?, it will do what it says, there you can find those image files and you can replace with others done previously, or just drag and drop over your picture editor. Double click on back button, and it will be opened. In this tutorial I'm going to use Paint.NET a free picture editor. TIP: To save the changes you must merge all layers before doing that, because if you do not do so, that program will ask you a new name.

Once modified save it. Return to the tool, and you will see the changes instantly.


At any time you can preview in the reference viewer.

Just press the button in the bottom. Repeat the process until you get something similar to the theme you like to create. After a few hours I got this one.

4. Build the Theme file. Click on File then Build.


This will show you a dialog window to confirm if this tool will build a theme for the new version of theme for Google Chrome .

YES: Will create a theme compatible with Chrome 0.3.154.3 or newer NO: Will create a theme compatible with current stable Beta version Chrome 0.3.154.0 or older This is because newer version (development versions, not official releases) has a different way to read those files from the theme file, it has changed some resource names in order to rearrange them. So newer versions can't read the older version's themes. Once chosen any of them, if everything goes OKAY (maybe the editor is blocking the access to some images, and error would appear), you will see a dialog when ending the process.

After that you will be taken to the Preview page of themes, where you can see the button apply in order to test it on the real browser.

Also a new button appears, â&#x20AC;&#x153;Add themeâ&#x20AC;? which will allow you to add this new created theme to your theme manager, so it will be listed there for future use.


5. Testing on real browser. The next thing to do, is to see if it works well on the real browser. Just hit Apply (make sure the browser isn't running) and this tool will replace the default.dll file in the theme folder of the browser's path, then it will be launched.

Here are the screenshots

6. Files to publish You can share your default.dll file and also you can pack it in a selfextracting executable file. For the second. Clic File then Pack

After packing it will ask you to open or not the location from where you can move, copy, upload, execute, etc that executable file, and also you can find there the default.dll file created.


Yes and...

If you want to test that default.exe file (rename if you want) just execute it. And this is how it looks.

It allows you to find the theme path, however it will try to automatically find it. So no need to locate the path. It shows details of your authorship, and by hitting apply button it will replace the theme and launch the browser. Now is your turn, create the better themes and don't forget to share.

How to use Chromium Theme Creator  

Explains how to use Chromium Theme Creator v2 in order to create themes for Google Chrome