fbpx
loader image

поискай Финансова оферта

Изпратете запитване

Благодим за интереса към съвместна работа. Ще отговорим на Вашето запитване в най – кратък срок.

11 + 6 =

Useful resources to help you find and choose colors

If you’re ready to start looking for colors, where do you start? It can be tricky to nail down a shade when you’re just given a color wheel. More often than not, you pick something that looks entirely different when it’s implemented. And even if you find one color you like, you might want to find a palette that works well alongside it.

That’s why there are specialized tools to help you settle on a color scheme for your website. One example is Coolors – a website that helps you grab a premade color scheme and implement it into your website.

Coolors

There’s also Color Safe, another website that lets you generate and browse colors by type, allowing you to find that perfect red or green.

Color Safe

Once you’ve formulated a palette, you can input your website onto checkmycolours.com, which will analyze your website and give you technical feedback on how effective your color scheme is for those with colorblindness or poor monitors.

Tips for choosing website colors

Use consistent saturation

One thing you can do to strengthen your brand is to use various colors with a similar saturation. Saturation is another way of saying a color’s brightness. Have a look at drink company Innocent’s usage of color:

Innocent Color

Here they have six different colors, but none of them feel out of place or jarring. That’s because their saturation is muted to the same level, making it feel consistent.

Use the same color, but vary saturation

When a brand has a strong connection with a certain color, they might not want to branch too far from it. However, everything being a single color can become a bit stale, so it can be fun to take your primary color and play with the saturation a bit. Have a look at the social media options in the bottom left of this TechCrunch article.

TechCrunch Colors

All five of them are a similar green, but have varying levels of brightness. These vary up the visuals of the page, while also reinforcing the idea that a lighter green is synonymous with TechCrunch.

Further tips

For some more tips, check out our infographic below.

opening an online boutique colors

Choose a typeface color

The final stop on your colorful journey is to nail down a typeface color. You might go for the easy choice and choose black, but have a browse around the internet, and you’ll find that purely black typefaces aren’t as common as you’d think.

A black typeface on a white background can lead to eye strain, as there’s a 100% contrast – and people will be more likely to click away if your website is difficult to read.

While explicitly colored typefaces should be reserved for links and important bits of information, you can use gray or gray-tinted color to give your website a softer, more inviting look. There isn’t a ton of room for experimentation, but it can be worth coloring your text for that finishing touch.

Penguin Font

A quick look at this page on Penguin Books’ website shows that they’ve elected for a softer grey tone for their text. This is a lot less aggressive than a stark black and white contrast, and allows for a softer vibe.

Choose a background color

You can go for a more muted version of your primary color in order to solidify your branding. This will require a white or grey overlay on the background in order for text to show up.

Alternatively, you could just have the whole website be an off-white color, which is the more common choice. It’s inoffensive, and won’t stop anything – text, images, or links – from jumping off the page.

WBE Background

Look no further than our own website to see what a blank, gray background can highlight.

Choose your additional colors

For example, a red circle on a green background pops a bit more than a blue circle on a green background. But a blue circle will look a lot better and more obvious on an orange background.

So if you’re using a predominantly green website, it’s a good idea to implement red calls to action, or use red to highlight important features that you want to catch the eye of any readers.

Try to only have one or two colors on top of your primary color. More than that, and you’ll be struggling with clutter. Nothing will stand out well if you inundate visitors with loads of different stimuli.

Eargo Color

A good example of using additional colors is hearing aid brand Eargo. It has a main color of orange, so it’s used this duller blue to highlight this important section of its website. From what we know about color compliments, we can see how this blue and bright orange contrast against each other. The orange also makes important elements pop, like the “add to cart” button and the logo.