Designing the Row® | Squarespace Website Design & Tutorials

View Original

How to Create a Brand Color Palette

About this Video

I've been so excited to make this video for a long time. I don't know why I haven't done it sooner, but here we are. I'm going to show you how to create a brand color palette in two different ways. First. I'll show you how I created my own monochromatic color palettes and then I’ll show you how to use your brand photos to create a color palette and pull colors directly from your photos. I recommend the second option where you use your brand photos, but sometimes you gotta start somewhere which is what I did back in 2016 when I created my color palettes, so I totally understand and I will show you both approaches.

I'm Katherine Forbes, founder of Designing the Row, your one stop shop for Squarespace websites and in this video (in this video series, really) I'm showing you how to create your brand elements because I believe it's a necessary thing to have your brand locked in before you start creating your Squarespace website, or any website for that matter. So to learn more about this series and get all the resources, you can do that at designingtherow.com/branding.

Timestamps

0:00 Intro
1:08 Monochromatic color palette creation
2:02 Color palette guidelines
2:36 Canva example
5:04 Brand photo color palette creation
6:38 Adobe Color example
8:54 What’s next

Related Links

Canva
Adobe Color

Like I said, option one of two is a little bit scrappy, but it's what I did and I've stuck with it for years now, so I'm going to show you how to do it. And we're going to use Canva to do this. Basically what I did was pick my favorite color and then then just pull variations of that color to create a monochromatic scheme, and then mix in a little black and white. And there was my Designing the Row color palette. I did the exact same thing for Music Biz Besties… I picked a hot pink, made a couple lighter shades of that same pink, added in black and white, and that was my color scheme.

You might have seen that I have some yellow and gold over here in the DTR palette, I use those basically just for YouTube thumbnail designs. I wouldn't say they're an official part of my brand color palette. Okay, so over here in Canva, I just have these square with a couple rectangles. I recommend that you create a color palette with five colors. Some people come to me with like 20 colors that is way too many colors. Pick five colors and my recommendation is a black and a white, or something similar if you want to do beige and brown, that's fine. But just something very light and something very dark. We will start with that. Then what I'm going to do is select one of these squares and I'm going to pick this add a new color here and I'm just going to use the color wheel to find my favorite color. So I knew when I was creating the DTR color palette that I wanted to use like a teal, aqua, whatever you want to call it. I pretty much just did this until I found a version of it that I liked. Let's see. That's blue… don't want to be too green… we'll stick in this family here. Okay, let's say this is our favorite color. We're gonna build our color palette off of this. So we'll select it here. I'm going to click this little color again and I'm going to copy this code right here. It's called a hex code. And what I'm going to do is select another square. And I'm going to paste it right here. Now we have two squares the same color. And I am just going to take this little circle here and I'm going to find a lighter version of that same color that I like and I'm going to do the exact same thing over here and find a darker version of it. And that my friends is how I created this.

If I do the same thing again for Music Biz Besties too. If I just pick a pink, that's really purple. Maybe in this example it'll be more purple. Again, copy the hex code and make yourself a monochromatic color palette. There we go. So that, that is option one. Pick your favorite color. And find lighter and darker shades of it.

Option two is to use your brand photo and pull colors directly from there so you can have a really cohesive look. To do that, go to color.adobe.com. And for the record, you can do something similar to this in Canva if you upload your picture, but I like the control that this gives you a little bit more. We're going to go to right here and click “Extract Theme.” I've got my picture here ready. If you watch the picking photos for your website video, then you know that this is my feature image. Load in your feature image that you've selected and you'll see it comes up with a color palette for you immediately. Over here, they call them color moods, you can click through the color moods and see what they come up with for you. None of these really stood out to me as anything that I love. So let's just start right here. You can see it's already got my like a white and a black. Let's see what we can do to find things in the middle. This might be a pretty monochromatic scheme too because it is white and black and then my skin tone, I would recommend you don't use your skin color as a brand color.

This photo is not very fun. So for that reason, I already have another one ready. Which is let's see right here. Oh, wow. That is that is very colorful. Let's click through these. So what I've done here is just pick the three themes of my photoshoot and take a screenshot of them together so I can pull in more colors than just this black and white picture here. Let's see, where do we want to start here? Let's say let's start with muted. As you can see, we've got black and white and then three pinks kind of like the Music Biz Besties palette. Then you can just drag and drop these until you find the perfect colors that you aim for that even when you're over here in Adobe that will do you really well when it comes time to designing your website. Here we have something that is very close to my actual Music Biz Besties color palette over here.

If you are someone like me who already has brand colors before you go in to do a photo shoot, keep those brand colors in mind as you can see that is what I have done. And for this exact reason, I want everything to look cohesive. I don't want to have to rebrand my colors every time I take pictures. But if you are picking colors for the very first time, this is how I would recommend you do that. And I do have some more photos coming that are like my teal background with my pink suit, so those will be really fun and we'll probably go more towards this scheme for Designing the Row. But first I got back these pink pictures, so that's why we're leaning this way for this example.

Let me know what you think about these two options in the comments. Are you going to go pick your favorite color and then find a couple different hues or are you going to come over here and use the photo tool? I think it's a really easy process and it can be really fun too. If you're just jumping into this branding series at this video make sure to subscribe and check out the rest of the series. We're creating the color palette, obviously, in this video. Up next, we're going to talk about fonts. And then we're going to put all of your brand elements together into these website brand guidelines. So subscribe, stick around, go to designingtherow.com/branding for all the resources and free templates. And I will see you in the next one.


Subscribe to this branding video series to get all the free resources sent right to your inbox!

Google Doc Branding Video Series Workbook • Font Pairing Menu • Canva Brand Guidelines Template

See this content in the original post

Want more branding and website advice? Here’s what’s new on the blog…

See this gallery in the original post

Need some 1:1 Squarespace help?

Book Katherine, a “Squarespace Authorized Trainer,” for an hour to work with you via Zoom on your Squarespace website. Learn more here or click below to schedule your session!