Beautify BatchBook CRM with GrayBook
I can’t say enough nice things about BatchBlue’s web-based customer relationship management software, BatchBook. Its 37signals-ish ease of use — along with the killer integrations and brand spankin’ new iPhone app — make it a fierce contender for best small business contact manager.
However, it is blue. Perhaps a bit too blue. That’s not particularly surprising considering that the company’s name is BatchBlue, but it can cause UI-obsessed webworkers like yours truly to gravitate towards sexier CRM’s like Capsule and Highrise. Determined to partake in the power of BatchBook without sacrificing aesthetics, I spit out nearly 400 lines of raw code and gave my favorite cloud-based contact manager a face-lift.
I finished up my dark and clean BatchBook theme and named it GrayBook. Why, you ask? Because BatchGray just sounds weird…
Here’s a screenshot of BatchBook’s Dashboard before I tweaked it:
And after:
And here’s a contact page prior to my tweaks:
And after:
How It Works
When you browse any well-designed webpage, a special collection of code — called “CSS” or “cascading style sheets” — controls the “look” or “styles” of the website. The fonts, colors, and layout of this website are all determined by these simple lines of code. Your web browser (e.g. Firefox, Internet Explorer, Chrome, Safari, etc.) reads the CSS and makes the website look pretty.
Since your web browser does the dirty work of interpreting code and beautifying web pages, you can change the look of websites by changing the code. This is called a user style — several lines of raw code that change the appearance of a website within your browser. It literally allows you to browse in style.
Although several web browsers support user styles, this tutorial only covers installation in Firefox and Chrome. If you want to use my Graybook theme in another web browser and don’t know where to begin, post a comment and I’ll see if I can help.
Installing GrayBook In Firefox
To install my BatchBook theme in Firefox, follow these instructions:
- Click here and press the big green button to install the Stylish addon
- Once the installation is complete, restart Firefox
- After restarting, click here and press the “Install with Stylish” button
- Go to your BatchBook account and check out your new theme
Installing GrayBook In Chrome:
These instructions are almost identical, yet somehow slightly easier:
- Click here and press the big blue button to install Stylish
- Click here and press the “Install with Stylish” button
- Wow, that was fast! Check out your new BatchBook!
Simple enough? If you have any questions, comments, or suggestions, let me know in the comments section.



