Tired of Searching for Your Brand Color Codes? Here’s a Free Chrome Extension!
Table of Contents Show
"I just need that specific sky blue hex code from my brand kit really quick..."
*Cue opening a new tab, navigating to Canva, clicking into your brand kit, finding the color, copying the hex code, switching back to your original tab... you know the drill 😅*
How many tabs do you have to open just to find your own brand colors? Between jumping into Canva's brand kit, opening that one project where you definitely used the right colors, or hunting down your "super organized" spreadsheet or Notion dashboard of hex codes, it's just so. many. clicks.
I've been using Color Buddy (an amazing free Chrome extension from The Color Palette Studio) for over a year now, and it's one of those tools that makes me wonder how I lived without it. I mean, I use it literally every single day - for client projects, my own website updates, social graphics, everything. And when I say everything, I mean it... because once you have instant access to all your color codes, you realize just how often you actually need them!
(Quick transparency note: While Color Buddy is free, I'll share some of The Color Palette Studio's paid tools too. If you purchase using my links, I'll earn a small commission at no cost to you. But tbh - I love and own ALL of their tools and genuinely use them daily!)
What is Color Buddy and How Does It Work?
Color Buddy is basically a color palette organizer that lives right in your Chrome browser. It’s kinda like your little color filing cabinet that's always just one click away.
Here's what makes it special:
Save unlimited color palettes
‘Pin’ your own or most used
Access HEX, RGB, and CMYK formats instantly
Import palettes from the Color Palette Builder
Edit and update colors on the fly
Want to learn more about how colors affect your website? Check out these posts:
How to Install Color Buddy (It Takes Like 2 Minutes!)
Open Google Chrome.
Go to the Color Buddy Chrome Web Store page.
Click the Add to Chrome button.
When a pop-up appears, click Add extension to confirm.
That’s it! The Color Buddy icon will appear next to the address bar.
Looking for more helpful Chrome extensions? Read Nine Must-Have Free Chrome Extensions for Squarespace Web Designers.
The Other Color Palette Studio Tools I'm Obsessed With
OK, let's talk about the other tools from The Color Palette Studio because... wow. I literally own them all (lol, yes, I'm that obsessed), and I want to share exactly how I use each one.
Color Palette Builder - My Absolute Favorite!
Y'all, this tool is my FAVE. If you've ever struggled to create color palettes that actually work together, this is about to change your life.
Here's why I love it:
Choose from over ten different design styles like Bauhaus, Vaporwave, Cottagecore, Art Deco, Botanical, Bold and Vibrant (and more!)
Each style comes with a list of common visual elements, a short video from Sam (co-founder of The Color Palette Studio), AND a custom-curated Pinterest inspo board
(And you can also just build your own, if you want to check accessibility or export for a client!)
Step-by-step "recipes" for foolproof color combinations
AI Name Generator to come up with fun, on-brand names like ‘Toasted Marshmallow” or “Serene Sky Blue”
Built-in high-contrast, accessibility testing (no more guessing or hoping that your colors work together)
Find all of the pairings with a contrast score of 4.5 or higher in just one easy click
Easily export your color palettes and send them off to your client in minutes
Color & Website Accessibility Features
Have you ever looked at a website or Instagram post and thought "Why is this so hard to read?" Or worse - has a client ever pointed out that their brand colors are basically invisible together? 🙈😬
Website accessibility is the practice of designing and developing websites so that people of all abilities can use them.
This includes people with disabilities as well as those with situational restrictions.
Accessibility is important because it makes sure that everyone can perceive, understand, navigate, and interact with what they need on the internet. I’d argue that an accessible website is a social responsibility, and bonus – it also improves user experience for all visitors.
The Color Palette Builder's accessibility testing helps ensure your color combinations work for all visitors (which, bonus - also improves the experience for everyone!).
Want to learn more about web accessibility? These posts can help:
Is Your Website Excluding Visitors? Fix It with These Accessibility Tips!
Keyboard Navigation: Making Your Squarespace Site Accessible for All
Get the Color Palette Builder here.
Brand Visualizer
The Brand Visualizer is an all-in-one tool for visualizing your fonts, colors, logos, and images together (in literally just 5 minutes!). Launched in late fall of 2024, this is the newest addition to my toolkit and tbh it’s quickly becoming one of my absolute favorites.
Here's why I love it:
See exactly how your colors and fonts will look on an actual website; it auto-sorts your colors into light, bright, and dark colors.
Access your entire library of fonts from your desktop
Add your own images, logos, and graphics
Import colors directly from the Color Palette Builder!
Create social media mockups in minutes
Save projects to your account
Export your mockups and brand guidelines
The best part: It helps you avoid that moment when you realize your perfect palette looks totally different on a real website than it did in your your client’s head... (haha, have we all been there?!)
Font Pairing Kit
Housed in a Notion database, the Font Pairing Kit has curated, mix-and-match font pairings. Fonts are sorted by price, design style, and functionality, helping with cohesive typography choices. This kit makes the process of finding complementary fonts easier, making sure that your font choices help with your overall design and align with your brand's aesthetic.
Full transparency: While I have this one (told you I own them all!), I haven't used it as much as the others. But I’ve explored it a bit and have actually bought a font that was listed there (haven’t done anything with it, but if you know me, you know I have a slight font-buying obsession.) So anyway, if you're looking for perfect font combinations, this Notion database has you covered.
Speaking of fonts, check out my guide to 18 Favorite Font Pairings for Squarespace for some quick inspiration!
Brand Guideline Builder
The Brand Guideline Builder is a set of Canva templates that makes organizing brand details simple. You can mix and match templates to lay out your colors, fonts, and visuals in a way that works for you. It’s an easy way to keep everything consistent and clear, whether you’re managing it yourself or sharing it with clients.
While I don't use this one as much as the Color Builder or Brand Visualizer (just because I don't work with brands in this capacity as often), it's a fabulous resource for brand or graphic designers.
Whether you're a web or graphic designer juggling multiple client projects or a solo business owner trying to keep your brand consistent, having the right resources just makes everything easier.
You can:
Save time on color and font selection
Create consistently on-brand designs
Make sure everything is accessible
Look super professional (even if you're DIYing)
Want to make your website even better? Read Four Tips to Absolutely Nail Your Website Strategy.
Start with Color Buddy (it's free! & so delightful!) and see how it helps your daily marketing and design work. At the very least, you'll save hours hunting down those hex codes you know you saved somewhere...
And if you decide to purchase any of the tools like The Color Palette Builder and the Brand Visualizer, use code JANESSA to save 10% on any purchase.
