Web Design Explained: Colors

05/14/2021

Our clients vary in age and technology experience, so we are used to explaining the highly technical process of building a website in simple terms. Some of our customers come to us for their first website and are just starting to utilize iPads or smartphones, while others are cutting-edge technology firms who simply don’t specialize in website design and need us more for aesthetics than technicals. Learning how to partner with either type of client when constructing a new build has been critical to our ability to bring their unique vision to life.

The goal of our Web Design Explained series is to help make web design terminology more understandable. Whether you consider yourself savvy or not, we are confident that our guide to website-related terms will teach you a few things!

Who We Are

At Range Marketing, we’re passionate about helping businesses get found on the internet. We work hard every day to help our clients grow their businesses organically and dominate their local landscape.

More about us

Work With Us

Ready to jumpstart your online presence with top-tier SEO, stunning website design, and seamless e-commerce integrations? Connect with our expert team today!

Get started

Recent Projects

Check out our short list of successes selected from our large client base.

Our Work

Website Color Codes

Did you know that website colors typically are not specified in English? When our designers build your website, they will use a set of codes for your brand’s color scheme. The most common version of brand color codes are called “hexadecimal.”

Hexadecimal Colors

There are actually 16,777,216 different colors that can be used to style your website. The human eye can only distinguish between roughly 10 million different colors, so your website’s colors are actually more specific than your eyes can even differentiate.

If you don’t already know your hexadecimal colors, no problem! Our designers can extract your brand’s color codes from your logo, your old website, or even a photograph that includes the shades you’d like to use for backgrounds, text, etc.

RGB Colors & RGBA Colors

Another color format that our designers often use is called “RGB” or “RGBA.”

RGB = Red, Green & Blue
RGBA = Red, Green, Blue & Alpha

“Alpha” refers to transparency. For example we might place text over a photographic background and allow some of the background to be visible through that text. To achieve that, we would lower the alpha value of that text color. Alpha of “0.5” would be 50% see-through and alpha of “0” would be totally clear.

As with hexadecimal colors, if you have your RGB values handy, that’s great! If not, we can calculate them very easily.

Website Color Syntax

This snippet of code show several different ways to make white text:

// hexadecimal color: #fff


// rgb

color: rgb(255,255,255) 
// rgba

color: rgba(255,255,255,0.75) 
// color name

color: white
//hsl

color: hsl(0, 0%, 100%)

//hsla color: hsl(0, 0%, 100%,0.95)

Website Color Methods We Use Less Often

If you noticed the last three declarations in the example above, those are less common ways of specifying a color: HSL and color names.

Color Names

In web design, you can actually specify a color simply by simply writing its name. In theory it sounds like doing so would be the ideal way of doing things, but using color names rather than color codes limits you to 140 different standardized colors. For example, if you want a specific shade of red, you’re out of luck with this method. The color names system has a preset value for common shades like “white” and “black,” plus plenty of fun ones like “peachpuff” and “papayawhip,” but they might not match your logo or other marketing materials as well as you would like.

HSL Colors & HSLA Colors

HSL & HSLA are additional ways of specifying color via providing the browser “hue, saturation, and lightness,” with the latter format also offering “alpha” (opacity). You will see HSL used in some scenarios, but it isn’t very common.

Ready to Learn More?

If you want to keep up with our blog, follow us on Instagram. We will be adding more to the Web Design Explained series as well as other free informational marketing content on a monthly basis!

Recent Articles

Back to Blog

Web Design & Development

05/31/2023

How to Keep Bots from Spamming Your Contact Forms

With the rise of artificial intelligence, spam bots are getting even more difficult to fend off. You may have already...

Discover More

Blog SEO Web Design & Development

04/28/2023

A Comprehensive Guide to Domain Changes

Any seasoned SEO professional will tell you that changing your domain name will have purely negative SEO consequences. Even if...

Discover More

SEO Web Design & Development

03/24/2023

What is Lazy Loading?

Lazy loading is a growing trend in web design. It’s gained popularity since Google started showing a stronger emphasis on...

Discover More

Stunning Website Design & Development

As a business owner in today’s digital culture, you absolutely need a website to reach customers. Your website should not only look nice, but also help you achieve your unique goals every single day. At Range Marketing, we’ll custom build your beautiful, mobile-friendly website with a focus on conversions, without losing sight of your brand ideals and goals.

Headless E-Commerce

Harness the power of native/headless e-commerce to take your dispensary’s online presence to the next level. Unlike traditional platforms, headless e-commerce gives you the freedom to custom-brand your menu, seamlessly integrate shopping CTAs throughout your entire site, and unlock more robust SEO benefits. This flexibility allows you to craft unique, seamless shopping experiences across all devices and touchpoints. Plus, with our AI-driven Cannaboost product, you can supercharge your site’s SEO performance while keeping it fast, responsive, and visually stunning. If you’re aiming to scale your business or outpace the competition, headless e-commerce delivers the agility and innovation you need to thrive in the modern cannabis market.

Website Color Codes

Hexadecimal Colors

RGB Colors & RGBA Colors

Website Color Syntax

Website Color Methods We Use Less Often

Color Names

HSL Colors & HSLA Colors

Dominating Competition with SEO-Infused Websites

Stunning Website Design & Development

Headless E-Commerce

We Turn Browsers into Buyers with Optimized E-Commerce