Hex Color Codes

Browse our comprehensive list of hex color codes for web design and development. Find, copy and use the perfect hexadecimal color values for your HTML, CSS and digital projects.

Try Our Color Picker →

Interactive Hex Color Picker

Use our interactive tool to find the perfect hex color for your project. Select your color visually and get the exact hex code instantly.

HEX

RGB

HSL

Understanding Hex Color Codes

Hexadecimal color codes (or hex color codes) are the standard way to specify colors in web design and development. These codes provide a precise method for defining colors in HTML, CSS, and various design tools.

A hex color code consists of a hash symbol (#) followed by six characters. These six characters represent three pairs of hexadecimal values, each defining the intensity of red, green, and blue components of the color.

First pair: Red (00-FF)
Second pair: Green (00-FF)
Third pair: Blue (00-FF)

For example, #FF0000 is pure red,#00FF00 is pure green, and#0000FF is pure blue.#000000 is black and#FFFFFF is white.

Hex Code Structure

#FFA52C

Advanced Features:

•
Shorthand notation: When each channel has duplicate digits, you can use 3-digit shorthand (e.g., #F00 equals #FF0000)
•
Alpha transparency: Modern browsers support 8-digit hex codes, with the last two digits representing opacity (e.g., #FF000080 for semi-transparent red)

Browse Hex Color Codes

Showing 45 colors

Red

#FF0000

Crimson

#DC143C

Tomato

#FF6347

Coral

#FF7F50

IndianRed

#CD5C5C

OrangeRed

#FF4500

DarkOrange

#FF8C00

Orange

#FFA500

Gold

#FFD700

Goldenrod

#DAA520

Yellow

#FFFF00

LightYellow

#FFFFE0

LemonChiffon

#FFFACD

PapayaWhip

#FFEFD5

Moccasin

#FFE4B5

Green

#008000

Lime

#00FF00

SpringGreen

#00FF7F

MediumSeaGreen

#3CB371

ForestGreen

#228B22

Blue

#0000FF

DodgerBlue

#1E90FF

DeepSkyBlue

#00BFFF

RoyalBlue

#4169E1

Navy

#000080

Purple

#800080

Magenta

#FF00FF

Orchid

#DA70D6

BlueViolet

#8A2BE2

DarkViolet

#9400D3

Pink

#FFC0CB

HotPink

#FF69B4

DeepPink

#FF1493

LightPink

#FFB6C1

PaleVioletRed

#DB7093

Brown

#A52A2A

SaddleBrown

#8B4513

Sienna

#A0522D

Peru

#CD853F

Chocolate

#D2691E

White

#FFFFFF

Silver

#C0C0C0

Gray

#808080

DimGray

#696969

Black

#000000

How to Use Hex Color Codes in Web Development

In CSS

/* Using hex codes for various properties */
.button {
  background-color: #3498db;
  color: #ffffff;
  border: 2px solid #2980b9;
}

.alert {
  background-color: #f39c12;
  /* With opacity/alpha */
  border: 1px solid #e67e2280;
}

/* Color variables */
:root {
  --primary: #2ecc71;
  --secondary: #9b59b6;
  --text: #34495e;
}

In HTML

<!-- Inline styles with hex codes -->
<h1 style="color: #e74c3c;">
  This heading is red
</h1>

<div style="
  background-color: #ecf0f1;
  border: 3px solid #bdc3c7;
  color: #2c3e50;
">
  This box has a light gray background,
  darker borders, and nearly black text.
</div>

<!-- SVG elements -->
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" 
          fill="#8e44ad" />
</svg>

Best Practices for Using Hex Color Codes

•
Consistency: Maintain a consistent color palette throughout your website by using the same hex codes for recurring elements
•
Accessibility: Ensure sufficient contrast between text and background colors (WCAG recommends a minimum contrast ratio of 4.5:1 for normal text)
•
Organization: Use CSS variables (custom properties) to centralize your color definitions for easier maintenance
•
Documentation: Comment your CSS with color names to provide context (e.g., /* Brand blue */)

Frequently Asked Questions About Hex Color Codes

What are hex color codes?

Hex color codes are six-digit hexadecimal numbers preceded by a # symbol that represent colors in HTML, CSS, and digital design. Each hex code defines a specific color by specifying the red, green, and blue components (RGB) of that color in hexadecimal format. For example, #FF0000 represents pure red, #00FF00 is pure green, and #0000FF is pure blue.

How do I use hex color codes in my website?

To use hex color codes in your website, simply include them in your CSS or HTML. In CSS, you can use them as values for color-related properties like 'color', 'background-color', or 'border-color'. For example: .header { background-color: #3366FF; color: #FFFFFF; }. In HTML, you can use them in inline styles: <div style="color: #FF0000;">This text is red</div>.

Are all hex color codes supported in browsers?

Yes, all standard 6-digit hex color codes are supported by all modern browsers. Additionally, most current browsers support 3-digit shorthand hex codes (like #F00 instead of #FF0000) and 8-digit hex codes for colors with alpha/transparency (like #FF000080 for semi-transparent red). These color formats provide flexibility and are universally recognized in web development.

How do I convert between hex codes and RGB values?

Converting between hex and RGB can be done with our color picker tool or manually:

Hex to RGB: Split the 6-digit hex code (without #) into three pairs. Convert each pair from hexadecimal to decimal. For example, #1A2B3C converts to RGB(26, 43, 60) because 1A in hex is 26 in decimal, 2B is 43, and 3C is 60.

RGB to Hex: Convert each RGB component (0-255) to a 2-digit hexadecimal number. Concatenate these numbers with a # prefix. For example, RGB(255, 0, 128) converts to #FF0080 because 255 in hexadecimal is FF, 0 is 00, and 128 is 80.

What is the difference between hex codes and color names in CSS?

Hex codes offer much greater precision and variety than color names. While CSS recognizes about 140 named colors (like "red", "blue", or "coral"), hex codes provide access to over 16 million distinct colors. Hex codes ensure exact color matching across different projects, enable more nuanced color schemes, and are the standard in professional web development. Additionally, brand colors are typically defined using hex codes rather than approximate named colors.

Find Your Perfect Color Today

Use our interactive color picker to find, customize, and export the perfect hex colors for your web project

Start Picking Colors