Blue. Light blue. Light blueish greenish. Sometimes the exact color you want is hard to describe, especially if you’re trying to match colors in your logo or brand. But instead of approximating colors on your website and hoping they’re “close enough,” there’s actually a much better, easier way to guarantee a good match. No squinting or guesswork required.
In this post we’ll go over how to find and use RGB and hex codes, and how to use those exact colors throughout your Jimdo website. Before you know it, you’ll be matching your fonts, buttons, links, horizontal lines, and more, and creating a cohesive, professional-looking website.
But this is actually great news because once you find the color code, you hold the key to replicating a color anywhere on your website (and in other graphics software too).
There are two kinds of web color codes that you should know about for our purposes today, RBG and Hex:
You don't have to worry about why the codes are formatted this way or what their history is (though if you're interested, there's more information here)...at this point it's good to know that 1) they exist and 2) you're going to learn how to find them. To do that, the next step is to learn more about color pickers:
If you’ve uploaded a logo or graphic, you should be able to get a very precise color match. If you upload a photo, the colors are much more variable because of lighting and shadows, so it will really depend on where you click.
A good place to start is to pick 1-2 accent colors to use throughout your site, in addition to good ol’ black, white, and grey. That will give your website a consistent, distinctive look throughout, without risking looking like a technicolor dreamcoat.
For example, see how these Jimdo websites have implemented striking colors schemes with only 1-2 colors.
Let’s say I’ve uploaded the typewriter photo as my background. It looks nice, but now I want to start matching some of my text, headings, and other elements to that exact same green color.
Once you open the Style Editor, click on the part of your website you'd like to change. Here I’ll click on my Large Heading Element and start with that.
Click on the color box in the top toolbar to open up the color menu. You’ll see that there are already 64 preset color options to choose from in the palette on the left. You could choose one of these, but of course you don’t need to anymore because you’ve found your own custom colors in the steps above. Instead, you’re going to focus on the color picker on the right side.
Now, type your hex value or RGB code into the box, outlined in red above. The Adobe program I used above told me that the green color I’m going for is RGB(101, 166, 145), so I fill that in here and click enter.
If you paste the hex code into the Style Editor, you'll see that the Jimdo system will automatically convert it to RGB values.
Once you've set that color, it will appear at the bottom-left of your color palette so that you can select it again and again for different parts of your website. Now you have it, an exact match.
To do this, open up the Style Editor again and and toggle the Style by Element switch to the “off” position. When you do this, you’ll see the option to the right to choose a Color Scheme for your entire website. Click on this color box, and set your custom color again like you did above. Press enter, and you’ll see this accent color now appears throughout the webpage—in your navigation bar, buttons, horizontal lines, and more.
Hint: If you decide to style your entire template at once like this, do it first, before you start styling individual elements. For more on how to use the Jimdo Style Editor, including a video, check out our Support Center.
The way the color is implemented throughout the website will vary depending on the template you’re using (here I’m using Barcelona). If you don’t like one of the universal changes (let’s say you don’t want your Button Elements to take on the accent color) just switch “Style by Element” back on, click on the Button Element, and change it back to whichever color you like.
Now I have a website with colors that complement my background photo, without any guessing involved.
Content Editor at Jimdo
Maggie joined the team to craft the voice of Jimdo for all products and marketing channels. In her previous work, she edited for organizations covering the environment, cities, and sustainable business. When she's not adding serial commas, you can find her camping with her husband, cooking, and reading New Scientist.