Home / Blog / Developer & Web

Developer & Web

Colour #6DCDB8: RGB, HSL and Interface Use

Read the exact RGB and HSL values for #6DCDB8, check contrast against black and white, and preserve the colour correctly in digital design files.

Colour #6DCDB8: RGB, HSL and Interface Use

Read the requested colour accurately

The code #6DCDB8 corresponds to red 109, green 205 and blue 184 in eight-bit sRGB. Its relatively high green and blue values give it a green-cyan appearance, though descriptive colour names are not exact identifiers. The three byte calculations are 6D=6×16+13=109, CD=12×16+13=205 and B8=11×16+8=184. Preserve the order as red, green, blue when entering the decimal form. A transposed letter in a hexadecimal code is still likely to be valid input, so validation alone cannot discover every copying mistake.

Reproduce the result in the local tool

Paste 6dcdb8 or #6DCDB8 into the Color Converter. Both are accepted, and the result shows HEX #6dcdb8 with RGB 109, 205, 184. The hash is optional in this tool's input box, but it belongs in a CSS hexadecimal colour declaration such as background-color: #6dcdb8. Pasting the whole declaration into the converter is a different input format and is rejected. Submit the colour value alone. The local input also does not accept a named colour, an rgb() expression or an eight-digit code with transparency.

Understand the rounded HSL description

The highest channel is 205 and the lowest 109. Their midpoint is 157, so lightness is 157/255, or approximately 61.57%. The normalized channel difference produces saturation of approximately 48.98%, and the green-maximum hue branch gives 166.875 degrees. Rounded to the integers displayed by the tool, the result is HSL 167°, 49%, 62%. These values explain the position of the colour within the HSL model. The 62% lightness result is not a percentage of physical screen brightness or a guarantee of sufficient contrast for a particular foreground.

Select a readable foreground for a filled badge

With the opaque colour used as a badge background, black has a contrast ratio of approximately 11.07:1, while white has approximately 1.90:1 under the WCAG sRGB calculation. Black clears the ordinary-text minimum of 4.5:1 for that pair. White fails even the 3:1 minimum used for qualifying large text. Choosing white because the background looks vivid would therefore be a poor decision for this exact swatch. These ratios are calculations for the stated pairs, not output supplied by the local Color Converter or a complete accessibility review of an interface.

Keep meaning independent of a green status colour

Suppose the colour is used for a successful payment state. Include a label such as Paid and, if useful, an accompanying symbol; do not expect the hue alone to communicate the status. A neighbouring pending or failed state needs its own distinguishable text and appropriate contrast. Test the actual component in its usual size, including focus or hover changes if it is interactive. A colour can have a satisfactory black-text ratio while still being ambiguous when used as the only distinction between two categories in a chart or table.

Preserve precision when making a palette

If the original exact colour is a brand or product token, keep #6DCDB8 as the source value and store intentional variants under separate names. Copying the rounded HSL triplet back into a design application may yield a nearby RGB value because the hue, saturation and lightness were rounded. That small numerical change should not silently replace the source token. A practical verification record includes the exact HEX code, its three decimal bytes, the intended background role and the approved text pair, so later adjustments can be compared with the original rather than remembered by appearance.

Separate a screen sample from a production specification

A screenshot of this swatch can be affected by image encoding, colour management and the surrounding presentation. For software implementation, transfer the explicit value instead of sampling a compressed image if the value is available. For a printed item or physical coating, a production workflow must establish the required materials and output conditions; the digital code by itself supplies neither a CMYK profile nor pigment quantities. Use the converter to verify the digital notation, then preserve that scope in a handoff. Calling the result a universal material match would claim more than the arithmetic establishes.

Use the Color Converter

Open Color Converter

Source and scope

W3C: sRGB hexadecimal and HSL definitions

W3C: WCAG text contrast requirements and calculation