Converting Colors

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

Conversions

New: Converting Colors offers a new tool to do mass color conversions.

FormatColor
HSL268°, 6%, 46%
CIELCh48, 9.328, 308.426
Yxy16.4144, 0.3036, 0.3000
Android (android.graphics.Color)4285886077 (0xFF756E7D)
YUV113.8030, 5.5201, 2.8038

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


Details

The Decimal color 7695997 is a dark color, and the websafe version is hex 666666. A complement of this color would be 7765358, and the grayscale version is 7500402.

A 20% lighter version of the original color is 11117234, and 4537932 is the 20% darker color. If you saturate the color by 10%, you get 7234173, and if you desaturate by 10%, it is 8158077.

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 Decimal color 7695997 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%.7695997The Color 7695997.16777215The Color 16777215.16643583The Color 16643583.14735593The Color 14735593.12893645The Color 12893645.11117234The Color 11117234.9406359The Color 9406359.7695997The Color 7695997.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%.7695997The Color 7695997.0The Color 0.7The Color 7.1709088The Color 1709088.3025205The Color 3025205.4537932The Color 4537932.6051428The Color 6051428.7695997The Color 7695997.Brightness Gradient

Saturation Gradient

Similar to the brightness gradients but the following show a change of the Decimal color 7695997 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.7695997The Color 7695997.3801213The Color 3801213.4196989The Color 4196989.4593533The Color 4593533.5055357The Color 5055357.5517437The Color 5517437.5913725The Color 5913725.6375805The Color 6375805.6837629The Color 6837629.7234173The Color 7234173.7695997The Color 7695997.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.7695997The Color 7695997.11657085The Color 11657085.11195005The Color 11195005.10798717The Color 10798717.10336637The Color 10336637.9874813The Color 9874813.9478269The Color 9478269.9016445The Color 9016445.8554365The Color 8554365.8158077The Color 8158077.7695997The Color 7695997.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.7041408The Color 7041408.8219767The Color 8219767.7695997The Color 7695997.7041408The Color 7041408.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.7695997The Color 7695997.6190451The Color 6190451.8154722The Color 8154722.7695997The Color 7695997.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.7695997The Color 7695997.7765358The Color 7765358.7695997The Color 7695997.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.6518123The Color 6518123.7696737The Color 7696737.7695997The Color 7695997.6518123The Color 6518123.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.7695997The Color 7695997.6124922The Color 6124922.7107428The Color 7107428.8481895The Color 8481895.7695997The Color 7695997.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.7695997The Color 7695997.6255984The Color 6255984.7107428The Color 7107428.8416113The Color 8416113.7695997The Color 7695997.Rectangle

Sweetspot

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

SweetspotThe sweet spot groups the original color and five complimentary colors.7695997The Color 7695997.5395026The Color 5395026.13750737The Color 13750737.5197394The Color 5197394.7239293The Color 7239293.10526115The Color 10526115.7695997The Color 7695997.Sweetspot

SVG Images

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

#756E7D

Previews

White Background

This preview shows how the Decimal color 7695997 looks on a white background.

The color contrast ratio for these colors is 4.90, 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/.

Black Background

This preview shows how the Decimal color 7695997 looks on a black background.

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

Decimal 7695997 Background

This preview shows how black text looks on a background with the Decimal color 7695997.

This preview shows how white text looks on a background with the Decimal color 7695997.


CSS Examples


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

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

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

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

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

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

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

Background

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

If only the background color should be changed .background{ background-color:#756E7D } 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, "756E7D", 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 "268°, 12%, 49%" 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(268°, 12%, 49%)" will give you the correct HSV color as there is no need to guess the format. Other examples would be "CIELAB(47.51, 5.80, -7.31)", "CIELCH(48, 9.328, 308.426)", "YXY(16.4144, 0.3036, 0.3000)" and "CMYK(0.06, 0.12, 0.00, 0.51)".