Read RGB Color Codes and Values

The short answer: three numbers for red, green and blue

An RGB color is defined by three channel values: red, green and blue. Screens mix these as light, so higher values mean brighter light in that channel. In the most common 8-bit notation, each channel runs from 0 (none of that light) to 255 (full intensity). Black is 0, 0, 0; white is 255, 255, 255; and a pure red is 255, 0, 0. With 256 possible values per channel, there are 256 × 256 × 256, or 16,777,216, possible combinations.

In a vector logo, these values are stored as properties of shapes, strokes and gradient stops rather than as pixels. Reading an RGB code in a logo file therefore means finding the color assigned to a specific path or gradient stop, not sampling a dot on the screen.

The common ways RGB values are written

The same color can appear in several notations depending on the tool or file format. Recognizing each one lets you confirm that two values describe the same color.

• Decimal triplet: three numbers from 0 to 255, such as 255, 102, 0. Design applications usually show this in their color panels.
• Hex code: a six-digit hexadecimal string after a hash sign, such as #FF6600. Each pair of digits is one channel, in red, green, blue order.
• CSS function: rgb(255 102 0) or the older comma form rgb(255, 102, 0), common in web and SVG styling.
• Percentages: each channel written from 0% to 100%, which some style sheets accept.
• Normalized decimals: each channel written from 0 to 1, such as 1.0, 0.4, 0.0, which appears in some scripting and developer tools.

How to read a hex code by hand

Split the six digits into three pairs. Each pair is a base-16 number, where the digits 0–9 keep their usual values and A–F stand for 10–15. Multiply the first digit by 16 and add the second. In #FF6600, FF is 15 × 16 + 15 = 255, 66 is 6 × 16 + 6 = 102, and 00 is 0, giving red 255, green 102 and blue 0, which is an orange.

Two variations come up often. A three-digit shorthand such as #F60 doubles each digit, so it expands to #FF6600. An eight-digit code such as #FF660080 adds a fourth pair for alpha (opacity), where 00 is fully transparent and FF is fully opaque. Not every tool accepts the eight-digit form, so check before relying on it in a delivered file.

A reference chart of basic RGB values

The values below are the standard definitions of the primary, secondary and neutral colors in 8-bit RGB. They are useful for checking that a tool is displaying channels in the order you expect.

Color | Decimal (R, G, B) | Hex

Black | 0, 0, 0 | #000000

White | 255, 255, 255 | #FFFFFF

Red | 255, 0, 0 | #FF0000

Green | 0, 255, 0 | #00FF00

Blue | 0, 0, 255 | #0000FF

Yellow | 255, 255, 0 | #FFFF00

Cyan | 0, 255, 255 | #00FFFF

Magenta | 255, 0, 255 | #FF00FF

Mid gray | 128, 128, 128 | #808080

A quick pattern to remember: when all three channels are equal, the result is a neutral gray, and the higher the shared value, the lighter the gray. When one channel is much higher than the others, the color leans toward that hue.

Reading RGB values in a logo gradient

A gradient in vector artwork is built from color stops. Each stop has its own RGB value and a position along the gradient, and the software calculates the colors in between. To document or reproduce a gradient, you need the value and position of every stop, plus the gradient type (linear or radial) and its angle or center.

In an SVG file, these details are readable as text. The example below uses illustrative values only; it defines a linear gradient running from the orange discussed above to a blue, with stops at the start and end.

<linearGradient id="brand-gradient" x1="0" y1="0" x2="1" y2="0">
  <stop offset="0" stop-color="#FF6600"/>
  <stop offset="1" stop-color="rgb(0, 102, 255)"/>
</linearGradient>

Here the offset values 0 and 1 mark the start and end of the gradient, and each stop-color holds an RGB value written in a different notation. Both notations are valid in SVG, which is why it helps to recognize them side by side.

The in-between colors are worth checking too. Many tools blend gradients by moving each channel in a straight line between stops, so a gradient between strongly contrasting hues can pass through a duller middle. For example, halfway between pure red (255, 0, 0) and pure green (0, 255, 0) is roughly 128, 128, 0, a dark olive rather than a bright yellow. Designers often add an intermediate stop to control that midpoint.

Vector fills, embedded images and previews are read differently

Where the color lives in the file changes how reliable the reading is. A fill or gradient stop on a vector path has an exact, stated value that you can read in the appearance or color panel. An embedded raster image inside a vector file has no single value; it is a grid of pixels, each with its own RGB numbers. A raster preview, such as a PNG or JPEG export of the logo, is also pixels.

Sampling a raster with an eyedropper gives the color of one pixel, which can be affected by anti-aliased edges, image compression, resizing or a gradient's position. Sampled values may differ slightly from the original specification, so they should be treated as an approximation rather than the official code. A file extension alone does not confirm which case you have: a file saved in a vector format can still contain embedded raster content, so inspect the artwork itself before treating its colors as exact.

Why the same numbers can look different

RGB numbers only describe a specific color when paired with a color space. The same triplet can display differently under sRGB, the common default for screens and the web, than under a wider space such as Adobe RGB. If a logo file is tagged with a different profile than the one your viewer assumes, identical values can look shifted. When delivering logo files, it helps to state which color space the RGB values refer to.

RGB values are also intended for screens. Print work typically uses CMYK process values or named spot colors, and some vivid RGB colors fall outside what CMYK printing can reproduce. Converting an RGB gradient for print can therefore change both the stop colors and the smoothness of the blend, so print versions are usually specified separately rather than converted automatically.

Reading a color is not the same as permission to use it

Being able to read the RGB values in a downloaded logo does not grant the right to modify the artwork or use the logo, its fonts or its trademarks. Permission to download a file and permission to alter or reuse its design are separate questions, typically answered by the owner's brand guidelines or license terms.

What this article does not cover

No brand-specific color specifications, tool version details or measured values were available for this article. The chart and conversions above are standard definitions and arithmetic; any example codes, such as the orange-to-blue gradient, are illustrative. For an actual brand's official RGB values, the authoritative source is that brand's own style guide or the original artwork file supplied by its owner.