Converting Colors

Advertisment

Conversions · Details · Harmonies · Images · Preview · Color Blindness Simulation · CSS · Help

Conversions

Here you see your color converted to 15 different color formats like RGB, CMYK, HSV, HSL, CIELab, Android, Decimal, and YUV. 🎁 Convert multiple colors at once or get Conversions and Harmonies via the REST API.

Conversions Part 1
FormatColor
Hex868984
RGB134, 137, 132
RGB Percent53%, 54%, 52%
CMY0.4745, 0.4627, 0.4824
CMYK0.02, 0.00, 0.04, 0.46
HSL96°, 2%, 53%
HSV96°, 4%, 54%
XYZ22.9420, 24.6256, 25.3738
Conversions Part 2
FormatColor
RYB132, 137, 135
Decimal8817028
CIELab56.71, -2.08, 2.28
CIELCh57, 3.092, 132.376
Yxy24.6256, 0.3145, 0.3376
Android (android.graphics.Color)4287007108 (0xFF868984)
YUV135.5330, -1.7418, -1.3444

Details

The Hex color 868984 is a dark color, and the websafe version is hex 999999. A complement of this color would be 878489, and the grayscale version is 888888.

A 20% lighter version of the original color is BBBEB9, and 545753 is the 20% darker color. If you saturate the color by 10%, you get 7E8976, and if you desaturate by 10%, it is 8E8992.

Advertisment

Distribution

RGB Color DistributionThe distribution of the RGB values, red, green and blue.RedThe Perecentage of Red in the Color.GreenThe Perecentage of Green in the Color.BlueThe Perecentage of Blue in the Color.RGB
RYB Color DistributionThe distribution of the RYB values, red, yellow and blue.RedThe Perecentage of Red in the Color.YellowThe Perecentage of Yellow in the Color.BlueThe Perecentage of Blue in the Color.RYB
CMYK Color DistributionThe distribution of the CMYK values, Cyan, Magenta, Yellow and Black.CyanThe Perecentage of Cyan in the Color.MagentaThe Perecentage of Magenta in the Color.YellowThe Perecentage of Yellow in the Color.BlackThe Perecentage of Black in the Color.CMYK
CMY Color DistributionThe distribution of the CMY values, Cyan, Magenta, Yellow.CyanThe Perecentage of Cyan in the Color.MagentaThe Perecentage of Magenta in the Color.YellowThe Perecentage of Yellow in the Color.CMY

Brightness & Saturation Gradients

These gradients show how the Hex color 868984 changes by changing the brightness by 10 percent. The first figure shows a shift by +10% for each color and the second figure -10%.

Similar to the brightness gradients but the following saturation gradients show a change of the Hex color 868984 by changing the saturation by 10% instead.

Brightness GradientThese gradients show how the {format} color {color} changes by changing the brightness by 10 percent. The first figure shows a shift by +10% for each color and the second figure -10%.868984The Color 868984.FFFFFFThe Color FFFFFF.F3F7F1The Color F3F7F1.D7DAD5The Color D7DAD5.BBBEB9The Color BBBEB9.A0A39EThe Color A0A39E.868984The Color 868984.Brightness Gradient

🖌️ View as Color Bucket

Brightness Gradient[Translation for "HARMONY_BRIGHTNESS_1_TEXT" not found]868984The Color 868984.000000The Color 000000.131611The Color 131611.282A26The Color 282A26.3D403CThe Color 3D403C.545753The Color 545753.6D706BThe Color 6D706B.868984The Color 868984.Brightness Gradient

🖌️ View as Color Bucket

Saturation GradientSimilar to the brightness gradients but the following saturation gradients show a change of the {format} color {color} by changing the saturation by 10% instead.868984The Color 868984.3C8909The Color 3C8909.448916The Color 448916.4C8924The Color 4C8924.558932The Color 558932.5D8940The Color 5D8940.65894DThe Color 65894D.6D895BThe Color 6D895B.768969The Color 768969.7E8976The Color 7E8976.868984The Color 868984.Saturation Gradient

🖌️ View as Color Bucket

Saturation Gradient[Translation for "HARMONY_SATURATION_1_TEXT" not found]868984The Color 868984.D089FFThe Color D089FF.C889F2The Color C889F2.C089E4The Color C089E4.B789D6The Color B789D6.AF89C9The Color AF89C9.A789BBThe Color A789BB.9F89ADThe Color 9F89AD.96899FThe Color 96899F.8E8992The Color 8E8992.868984The Color 868984.Saturation Gradient

🖌️ View as Color Bucket

Advertisment

Harmonies

Analogous

The analogous color harmony consists of three colors that are next to each other on the color wheel.

AnalogousThe analogous color harmony consists of three colors that are next to each other on the color wheel.898883The Color 898883.838A86The Color 838A86.868984The Color 868984.898883The Color 898883.Analogous

🖌️ View as Color Bucket

Triad

The triadic color harmony groups three colors that are evenly spaced from another and form a triangle on the color wheel.

TriadThe triadic color harmony groups three colors that are evenly spaced from another and form a triangle on the color wheel.868984The Color 868984.8E8687The Color 8E8687.84898DThe Color 84898D.868984The Color 868984.Triad

🖌️ View as Color Bucket

Complementary

The complementary color scheme is a pair of colors which are on the opposite of each other on the color wheel.

ComplementaryThe complementary color scheme is a pair of colors which are on the opposite of each other on the color wheel.868984The Color 868984.878489The Color 878489.868984The Color 868984.Complementary

🖌️ View as Color Bucket

Split Complementary

Split-complementary colors differ from the complementary color scheme. The scheme consists of three colors, the original color and two neighbors of the complement color.

Split ComplementarySplit-complementary colors differ from the complementary color scheme. The scheme consists of three colors, the original color and two neighbors of the complement color.8D868AThe Color 8D868A.87888DThe Color 87888D.868984The Color 868984.8D868AThe Color 8D868A.Split Complementary

🖌️ View as Color Bucket

Square

The square scheme is like the rectangle color scheme, but the four colors are evenly spaced on the color wheel.

SquareThe square scheme is like the rectangle color scheme, but the four colors are evenly spaced on the color wheel.868984The Color 868984.8E8784The Color 8E8784.8A878CThe Color 8A878C.82898CThe Color 82898C.868984The Color 868984.Square

🖌️ View as Color Bucket

Rectangle

The rectangle color scheme consists of four colors that form a rectangle on the color wheel.

RectangleThe rectangle color scheme consists of four colors that form a rectangle on the color wheel.868984The Color 868984.8E8688The Color 8E8688.8A878CThe Color 8A878C.828A88The Color 828A88.868984The Color 868984.Rectangle

🖌️ View as Color Bucket

Sweetspot

The sweet spot groups the original color and five complimentary colors.

SweetspotThe sweet spot groups the original color and five complimentary colors.868984The Color 868984.595959The Color 595959.D9D9D9The Color D9D9D9.595958The Color 595958.898784The Color 898784.B1B3B1The Color B1B3B1.868984The Color 868984.Sweetspot

🖌️ View as Color Bucket

SVG Images

A selection of SVG images using the hex version #868984 of the current color.

#868984
Advertisment

Previews

White Background

 

This preview shows how the Hex color 868984 looks on a white background.

The color contrast ratio for these colors is 3.54, which passes the AA level for large text above 18pt. Details can be found at https://www.w3.org/TR/WCAG20/.

Black Background

 

This preview shows how the Hex color 868984 looks on a black background.

The color contrast ratio for these colors is 5.93, which passes the AA level of the Web Content Accessibility Guidelines (WCAG) 2.0 for any text size and the AAA level for large text above 18pt. Details can be found at https://www.w3.org/TR/WCAG20/.

Hex 868984 Background

 

This preview shows how black text looks on a background with the Hex color 868984.

 

This preview shows how white text looks on a background with the Hex color 868984.

Color Blindness Simulation


Dichromacy

Original Color
868984
Protanopia
8B8783
Deuteranopia
968385
Tritanopia
888792

Trichromacy

Original Color
868984
Protanomaly
898883
Deuteranomaly
908585
Tritanomaly
87888D

Monochromacy

Original Color
868984
Achromatopsia
888888
Achromatomaly
878887
Advertisment

CSS Examples


The CSS property to change the color of the text to Hex 868984 is called "color". The color property can be set on classes, ids or directly on the HTML element .text, #text, p{ color:#868984 }.

This example shows how text in the color #868984 looks like.

If you want to add a text shadow in that color use .shadow{ text-shadow: 4px 4px 2px #868984 }.

Here you see how black text with a 4 pixel #868984 colored shadow looks like.

Border

This example shows the color as border, it can be applied via the CSS property "border" or "border-color".

The CSS property to change the border of an element to Hex 868984 is called "border". The border property can be set on classes, ids or directly on the HTML element .border, #border, table{ border:4px solid #868984 }.

If only the border color should be changed .border{ border-color:#868984 } can be used.

Here you see how a box with a 4 pixel #868984 colored shadow looks like.

If you want to add a box shadow in that color use .boxshadow{ -moz-box-shadow:4px 4px 4px 4px #868984; -webkit-box-shadow:4px 4px 4px 4px #868984; box-shadow:4px 4px 4px 4px #868984 }.

Background

The CSS property to change the background color of an element to Hex 868984 is called "background". The background property can be set on classes, ids or directly on the HTML element .background, #background, body{ background:#868984 }.

If only the background color should be changed .background{ background-color:#868984 } can be used.

This example shows the color as background, it is applied via the CSS property "background".

To optimize and compress your CSS code, you can use our online CSS compressor and optimizer based on csstidy. If you want to create a linear gradient as background or border, check our CSS Gradient Generator.

How-to use Converting Colors

To convert, paste a string in one of these color formats, for example, "868984", into the input field and click on convert. The result will be in the section Color Conversions, and the following sections will provide you with further details on the color.

Some color formats use the same notation, and the conversion will guess the composition of the search query. As an example, if you try to convert the string "96°, 4%, 54%" it could be an HSV or HSL color, the conversion will assume HSL in this case.

As this could lead to wrong conversions, you can define which format you are passing by wrapping your color string in brackets with the format in front. The search string "HSV(96°, 4%, 54%)" will give you the correct HSV color as there is no need to guess the format. Other examples would be "CIELAB(56.71, -2.08, 2.28)", "CIELCH(57, 3.092, 132.376)", "YXY(24.6256, 0.3145, 0.3376)" and "CMYK(0.02, 0.00, 0.04, 0.46)".


Advertisment