Google Chrome: How to Change Icons on the Bookmarks bar

I added quite a few bookmarklets to my Bookmarks bar and was unhappy with the same default icon that showed for each one. There are no settings currently available within Chrome to change the icon, but there is a way to fix them that works quite well.


First, you’ll need to download and install the free SQLite Database browser.

Now, open Google Chrome and visit the site(s) that have the favicon you want displayed in your Bookmarks bar. After you have completed this, close Google Chrome.

We are ready to change icons:

1. Open SQLite Database browser.

2. Go to the toolbar and select the Open (folder) icon to bring up the Open window.

3. When the open window appears, you will need to browse to the following directory:

In Windows XP:
C:\Documents and Settings\\Local Settings\Application Data\Google\Chrome\User Data\Default

In Windows Vista:
C:\Users\\AppData\Local\Google\Chrome\User Data\Default

Note: change username to your username.

4. Open the History file.

5. Select the Browse Data tab.

6. Select urls from the Table dropdown.

7. The table will appear with the following columns: id, url, title, visit_count, typed_count, last_visit_time, hidden, favicon_id and starred_id. Our main focus will be on the favicon_id and starred_id columns, but you will need to pay attention to the title column as well. Any row that has a value other than 0 in the starred_id column is a bookmark. Any row that has a value other than 0 in the favicon_id column has an icon associated with it (if it has a 0, it will use the default icon).

8. Locate one of the sites you browsed to earlier that contains the desired favicon that you wish to use. Make sure it has a value in the favicon_id column. When you have located it, make note of the value that is in the favicon_id column.

9. Now locate the bookmark that you want to assign the favicon to. The title may appear more than once, so you must make sure that you select the record that has a value in the starred_id column.

10. Double-click the favicon_id record (the one that is 0) to open the Edit database cell window.

11. Change the 0 to the value you got from Step 8.

12. Click the Apply Changes button.

13. Repeat this process until you have finished assigning icons to your bookmarks.

14. Go to the toolbar and click the Save icon.

Now open up Google Chrome and check out your Bookmarks bar.

Here are some before and afters of my Bookmarks bar:

 

About Rob Rogers

Once a prolific author here on Tech-Recipes, Rob has moved on to greener pastures.
View more articles by Rob Rogers

The Conversation

Follow the reactions below and share your own thoughts.

45 Responses to “Google Chrome: How to Change Icons on the Bookmarks bar”

  1. November 13, 2008 at 2:31 am, robert said:

    yeah, that’s way easier than just visiting a site in IE7 – good grief

    Reply

  2. November 15, 2008 at 7:07 am, Anonymous said:

    I don’t have a “Starred_ID” column. I did on my XP computer, but I don’t on my Vista. I tried changing the # in the Favicon_ID column, to the same as the one from the site I wanted.

    I am trying to add: and not just have the little notebook page as the Icon.

    When I click the save Icon on the tool bar I get this error message:

    “Error: could not save the database, Message from database engine: database is locked”

    Two hrs later I still can’t figure it out. I thought I was a geek.

    Can you help me?

    Thanks,

    N8

    Reply

    • February 08, 2011 at 3:54 am, Mascara said:

      If you don’t see the “starred_id” column in the “urls” table, you can first open the “segments” table and find there your bookmark. Browse the “name” column to find the url of the bookmark you want to display the favicon. Make note of the value it has at the “url_id” column.
      Then change to the “urls” table and look that value in the first column (“id”). It should be easy, because rows (lines) are sorted by this column (“id”). If you don’t find the id in the first page (1-1000), you will need to look it up in the next pages. To move other pages you just have to click the bottom button “Go to the next record set page”. Once you find it you can skip step 9 and proceed to modify the favicon_id as in step 10.
      You can find faster the favicon id (step 8) if you, before open the “History” file (step 4), open the “favicons” file, in the same folder. There you have to select the favicons table from the Table drop-down. All the rows you will find there are favicons, and the “id” column tells you the number you want to change in the Edit Database Cell Window of step 10.
      Good Luck!

      Reply

      • February 08, 2011 at 8:53 am, N8zGr8 said:

        Thanks for the response. However, I don’t know if you noticed I wrote that request 2 years ago. I gave up on Chrome and I gave up on changing the icons a long time ago. I don’t even have the same computer. I am sure it will probably help someone else though… I hope.

        Thanks again.

        N8

        Reply

  3. November 30, 2008 at 5:18 pm, Robert Stacy said:

    I DO NOT HAVE a starred_id column?

    Any idea why not?

    Reply

    • January 04, 2009 at 3:47 pm, Ferdil said:

      Same problem here.

      Reply

    • January 24, 2009 at 6:16 pm, Anonymous said:

      I don’t have one either!…

      Reply

    • January 31, 2009 at 12:13 pm, planetstrider said:

      I have been able to do it^^ this way don’t need the sterred_id but it’s the way by force.

      First, You should close Google Chrome before doing Step4 because the table doesn’t appear if Google Chrome is opening.

      Next, if you can see the tables, you do Step 6.(select urls)
      You select the unnecessary record for you in the urls tables.(e.g. Google search result URLs)

      Finally, you change the url cell’s value and favicon_id cell’s value to your URL (I changed it to the bookmarklet URLs) and your favicon_id (You’ll get it in Step 7).

      Probably, you can see your favicon in Chrome.
      Good luck.
      Thanx:)

      ps: I’m a Japanese so I’m not good at English

      Reply

      • November 04, 2009 at 1:49 pm, TKR said:

        Thanks planetstrider, this did the trick!

        Reply

      • February 22, 2010 at 8:19 am, Anonymous said:

        thank you planetstrider! worked for me too!

        Reply

  4. December 22, 2008 at 11:12 am, rymo said:

    Thank you, 1000 times, thank you!! I use Chrome’s Application Shortcuts feature for my Google hosted mail and calendar — for some reason my laptop was stuck with a little blue “g” as the icon when running (despite the red and white gmail envelope logo as the shortcut on the desktop and quick launch). I found it unbelievably difficult to find my e-mail window every few minutes without that envelope in the task bar! Your SQLite method was just what I needed. I’d also point out that opening the Thumbnails database (also in the User DataDefault folder) can help in matching favicon_id to actual favicon URL.

    Reply

  5. January 25, 2009 at 2:45 pm, anon said:

    In Step “5. Select the Browse Data tab.” Nothing appears in the Table drop-down list. History file is loaded, but nothing appears in the Table list. So… oh well.

    Reply

    • January 27, 2009 at 2:14 am, Anonymous said:

      Yeah, same deal for me.
      Could it have something to with the fact Chrome is now out of beta….

      Reply

      • May 04, 2010 at 1:39 am, Name said:

        you need to close Chrome before opening the history DB.

        Reply

  6. March 18, 2009 at 10:25 pm, iconless in wisconsin said:

    Hi, I did everything as mentioned and the icons in my bookmark bar were changed to the ones I wanted. I thought it was great until I clicked on those links and when the page loaded, the favicon went blank again. I can go back and successfully change them back, but I always lose them once the page loads. Any suggestions on how to keep the changes permanent?

    Reply

    • October 03, 2009 at 3:04 am, Zachary M Vogt said:

      I had the same problem. I was able to use the instructions on this page to query/update the History database, and it appeared to work at first, but on subsequent visits to the urls, the icons would just get reset to a value that was rendered as a generic page icon. I did notice that the blank icons that I wanted to replace were non-zero values. If you want to change a non-zero generic icon, query the History data base to get the favicon_id values for the value you want to replace and the value you want to use in its place. Then open the Thumbnails database and execute something like:
      update favicons
      set image_data = (select image_data
      from favicons
      where id = )
      where id =

      That worked for me and so far seems to be more permanent.

      Reply

  7. April 04, 2009 at 9:07 pm, Morgan said:

    This is lovely, but is there anyway to change individual folder icons? I make extensive use of folders.

    Reply

  8. April 12, 2009 at 4:21 pm, RBL said:

    Doesn’t work on production release. Loading History file displays no data.

    Reply

    • July 07, 2009 at 9:31 am, ein*1 said:

      Same for me. No table names are available in the drop down list after loading the history file. I am using Google Chrome 2.0.172.33.

      Reply

  9. August 06, 2009 at 8:58 pm, Anonymous said:

    I can’t see the starred_id column.
    I have tried several ways but no matter what I can’t see it. Is there another way to do this?
    I am using Google Chrome build 2.0.172.39

    Reply

  10. August 08, 2009 at 8:04 am, Turan Rustamli said:

    ok, I had the same problem. There is no “starred_id’..
    but I found the the way to change bookmark icon.

    All I wanted was add icon to “Add to Delicious” Bookmark. So I visited Delicious’ main page to make Chrome add a record about it to his history. Then I found that record and replaced it’s url (http://delicious.com) with my bookmark’s url (javascript:(function(){f=’http://delicious.com/save?url=’+en … ). And that’s all.

    Reply

  11. December 31, 2009 at 9:42 am, Focks said:

    Or you could just make 1, add it to Firefox and import it to Chrome.

    Reply

  12. February 10, 2010 at 4:38 am, Name said:

    I don’t think it should be as difficult as this! My 2 year old changed the icons in the blink of a second – before I could realize what he was doing, he changed many of the icons! How? I don’t know!!! I don’t have nay of the pgms/software installed that are mentioned above. So there must be an easier way… Anybody have answers?

    Reply

  13. February 13, 2010 at 5:10 pm, LoneWolf said:

    100 point! GREAT!!!!!

    Reply

  14. March 03, 2010 at 10:14 pm, Anonymous said:

    I was overwhelmed at seeing this procedure and I found something else somebody might try.

    1. Launch Firefox
    2. Create bookmark on Bookmarks Toolbar
    3. Choose the favicon using Favicon Picker Add-on
    4. Close Firefox
    5. In Chrome, select Tools>Options>Personal Stuff. Hit ‘Import Data’ button.
    6. Select Mozilla Firefox and de-select all options but Favorite/Bookmarks
    7. Hit ‘Close’ button.

    You will find the newly created icon under ‘Other bookmarks’ folder on the extreme right of Chrome’s bookmarks’ toolbar. You can then drag it and drop where you please and delete the unnecessary bookmarks that were probably imported from Firefox.

    Reply

  15. March 05, 2010 at 2:31 am, Anonymous said:

    How utterly ridiculous to have to do this. That’s it. I’m not using Chrome. I’m going back to IE8.

    Reply

    • March 15, 2010 at 4:15 am, Rene said:

      I have only folders on my bookmarks bar, so I don’t need the switch to favicons.
      What I’m after is a way to change the default icon used for the folders that hold the bookmarks!
      That’s a lot simpler isn’t it? Does anyone know how to change that default bookmarks folder icon for Chrome 4?

      Reply

  16. July 10, 2010 at 4:30 am, Mario A Cavuoto said:

    cant get it to wwork

    Reply

  17. July 10, 2010 at 5:18 am, Mario A Cavuoto said:

    PERFECTO i did it. mine is missing that stared id tab thats what confused mme awesome.

    Reply

  18. July 12, 2010 at 9:25 pm, Mario A Cavuoto said:

    okay all was great and it helps alot. i can’t believe how much info you need to adjust for a simple lil icon. =) but i maybe like you have to have a perfect bookmark bar.

    you know what would be nice. if there was a page that listed all the icons and there numbers so this way this process would be alot faster. or have someone make there own sample icons.

    and fyi on my SQLite Database browser. i do not have a column for the starred id. i just used the Favicon id. and left the other stared id. out.

    Reply

  19. July 23, 2010 at 8:22 am, Kymbreliochoa said:

    does this work in IE and Firefox??

    Reply

  20. September 18, 2010 at 9:23 pm, Anonymous said:

    How can you do this on a MAC?

    Reply

    • April 02, 2011 at 3:14 pm, Anonymous said:

      Chrome – it’s easy to remove and add icons from the bookmark bar on the mac. To add, just drag it there. To remove is easy, but hard to see how. To remove, just drag the icon to the right until it fades off. Then click on the little arrows that point to “more.” From there, you can just right mouse click or option click and they go away “poof!” Very easy but very dumb how it is so secret.
      btw, I would have posted this in the main thread here with Disqus but I could not see how to do THAT. so more help there is welcome to me.

      Reply

      • August 22, 2012 at 6:23 pm, dave said:

        ^^^^^^ this is wrong.

        Reply

  21. October 25, 2010 at 4:01 am, icute said:

    im using Quick Bookmark extension in chrome and it solved the favicon problem.
    https://chrome.google.com/extensions/detail/ajgmnekpakhkbnhehnpkminifbpmkghg

    Reply

  22. December 11, 2010 at 2:20 pm, homunq said:

    an extension to change the favicon of a given tab (still very new, but looks promising): https://chrome.google.com/webstore/detail/hnpmcokdebcinajfhhnlgpijgaapkopp#

    Reply

  23. January 06, 2011 at 11:23 pm, Holziffb said:

    “Tab-Edit” is an easier solution: https://chrome.google.com/webstore/detail/hnpmcokdebcinajfhhnlgpijgaapkopp#

    Reply

  24. July 05, 2011 at 8:01 am, Proru said:

    Why on earth isn’t there an addon/utility/tool to handle icons in Chrome?? I just connot believe it!! 

    Reply

  25. July 23, 2011 at 4:07 pm, Anonymous said:

    Great job Rob, since I’m an icon freak this tutorial really makes me happy! 
    I’d like to add two things and have one question:

    - Its important to close the Chrome browser, otherwise SQLlite will not be able to open the history file. SQLlite does not show any error message, it simply opens nothing. So, if you want to read this tutorial in parallel to your tweaking activities, you have to open it in any other browser.

    - I use the “SRWare Iron” browser (see http://www.browserchoice.eu), it is a chrome with the “sending statistics, calling home etc. stripped off. The path to the history file is slightly different, there is no “google” in it, you’ll find it quite easily (e.g. for WinXP C:documents and settingslocal settingsAppDataChromiumUser DataDefault). There is no “starred_id” column, nevertheles the tutorial works the same.

    - QUESTION: 
    ==========
    can anybody advice me how to get to files with the favicon pictures? I want to put favicons I’ve painted by myself onto some bookmarks.Thanks again and goodbye, BeWay

    Reply

  26. November 10, 2011 at 11:56 am, Nomo said:

    You have to change the History file extension to .db, or else SQLite will display a blank screen.

    When you are finished editing anything with the file in SQLite, change back the file extension to nothing.

    You have to:
    -Rename “History” file to “History.db”
    -When you finish, rename “History.db” back to “History”.

    Reply

  27. October 30, 2012 at 2:59 pm, Martin said:

    How do you do this using Windows 8?

    Thanks!

    Reply

  28. November 11, 2012 at 12:42 pm, Poweruas said:

    A little too much work just for some icons :/ Wish Google could fix this issue

    Reply

  29. March 19, 2013 at 6:21 am, Alice said:

    1-all my favicon_id’s are 0 in “browse data” = this means nothing will work for me? i found the favicon_id number as stated in “favicon” file
    2-when i double click the “title” column i get the title instead of url (paragraph 7)
    3-i have no “starred_id column” in “browse data”
    4-can you put a screenshot of the “javascript code for the bookmarklet” (paragraph 7)
    appreciate any help !

    Reply

  30. March 31, 2013 at 9:09 am, Bob said:

    When i Open ‘History’ nothing appears in the drop-down box, what I’m i doing wrong?

    Reply

  31. September 23, 2013 at 8:17 am, JohnnyCantCode said:

    has anyone indicated where the first link is in Windows 8 Pro?

    C:\Documents and Settings\(name of logged on user here)\AppData\Local\Google\Chrome\User Data\Default

    Reply

Leave a Reply