Converting Colors

Conversions · Details · Harmonies · Images · Preview · CSS · Help

FormatColor
HSL347°, 23%, 57%
CIELCh56, 21.247, 4.924
Yxy23.9986, 0.3620, 0.3125
Android (android.graphics.Color)4289427844 (0xFFAB7984)
YUV137.2040, -2.5656, 29.6391

Add this color to the bucket
(The bucket allows you to create a color palette)

Go to the color bucket to see your palette.

Get Conversions and Harmonies as JSON or XML via the REST API.


Details

The Hex color AB7984 is a dark color, and the websafe version is hex 996666. A complement of this color would be 79ABA0, and the grayscale version is 898989.

A 20% lighter version of the original color is E3AEB9, and 764853 is the 20% darker color. If you saturate the color by 10%, you get AB6877, and if you desaturate by 10%, it is AB8A91.

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 Gradient

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

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%.AB7984The Color AB7984.FFFFFFThe Color FFFFFF.FFE5F1The Color FFE5F1.FFC9D5The Color FFC9D5.E3AEB9The Color E3AEB9.C7939EThe Color C7939E.AB7984The Color AB7984.Brightness Gradient
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%.AB7984The Color AB7984.000000The Color 000000.0B0000The Color 0B0000.2C0411The Color 2C0411.441B26The Color 441B26.5C313CThe Color 5C313C.764853The Color 764853.90606BThe Color 90606B.AB7984The Color AB7984.Brightness Gradient

Saturation Gradient

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

Saturation GradientSimilar to the brightness gradients but the following show a change of the {format} color {color} by changing the saturation by 10% instead.AB7984The Color AB7984.AB0026The Color AB0026.AB0127The Color AB0127.AB1234The Color AB1234.AB2341The Color AB2341.AB354FThe Color AB354F.AB465CThe Color AB465C.AB5769The Color AB5769.AB6877The Color AB6877.AB7984The Color AB7984.Saturation Gradient
Saturation GradientSimilar to the brightness gradients but the following show a change of the {format} color {color} by changing the saturation by 10% instead.AB7984The Color AB7984.ABFFFCThe Color ABFFFC.ABFFEFThe Color ABFFEF.ABF1E1The Color ABF1E1.ABE0D4The Color ABE0D4.ABCEC7The Color ABCEC7.ABBDB9The Color ABBDB9.ABACACThe Color ABACAC.AB9B9FThe Color AB9B9F.AB8A91The Color AB8A91.AB7984The Color AB7984.Saturation Gradient

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.A17B96The Color A17B96.AB7B72The Color AB7B72.AB7984The Color AB7984.A17B96The Color A17B96.Analogous

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.AB7984The Color AB7984.5C8DA7The Color 5C8DA7.7D8C68The Color 7D8C68.AB7984The Color AB7984.Triad

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.AB7984The Color AB7984.79ABA0The Color 79ABA0.AB7984The Color AB7984.Complementary

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.50909BThe Color 50909B.688F76The Color 688F76.AB7984The Color AB7984.50909BThe Color 50909B.Split Complementary

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.AB7984The Color AB7984.7487ABThe Color 7487AB.569189The Color 569189.918662The Color 918662.AB7984The Color AB7984.Square

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.AB7984The Color AB7984.568EA4The Color 568EA4.569189The Color 569189.A57E69The Color A57E69.AB7984The Color AB7984.Rectangle

Sweetspot

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

SweetspotThe sweet spot groups the original color and five complimentary colors.AB7984The Color AB7984.707070The Color 707070.F0F0F0The Color F0F0F0.706467The Color 706467.9F79ABThe Color 9F79AB.DECACEThe Color DECACE.AB7984The Color AB7984.Sweetspot

SVG Images

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

#AB7984

Previews

White Background

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

The color contrast ratio for these colors is 3.62, 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 AB7984 looks on a black background.

The color contrast ratio for these colors is 5.80, 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 AB7984 Background

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

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


CSS Examples


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

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

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

Here you see how black text with a 4 pixel #AB7984 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 AB7984 is called "border". The border property can be set on classes, ids or directly on the HTML element .border, #border, table{ border:4px solid #AB7984 }.

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

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

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

Background

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

If only the background color should be changed .background{ background-color:#AB7984 } 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.

Upskill your career and get 10% off on a Udacity Nanodegrees ProgramAdvertisment🛈

How-to use Converting Colors

To convert, paste a string in one of these color formats, for example, "AB7984", 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 "347°, 29%, 67%" 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(347°, 29%, 67%)" will give you the correct HSV color as there is no need to guess the format. Other examples would be "CIELAB(56.09, 21.17, 1.82)", "CIELCH(56, 21.247, 4.924)", "YXY(23.9986, 0.3620, 0.3125)" and "CMYK(0.00, 0.29, 0.23, 0.33)".