Converting Colors


Conversions · Details · Harmonies · Images · Preview · 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 2
FormatColor
RYB115, 118, 123
Decimal7567227
CIELab49.82, -0.66, -2.72
CIELCh50, 2.800, 256.297
Yxy18.2685, 0.3032, 0.3213
Android (android.graphics.Color)4285757307 (0xFF73777B)
YUV118.2600, 2.3368, -2.8590

Details

The Decimal color 7567227 is a dark color, and the websafe version is hex 666666. A complement of this color would be 8091507, and the grayscale version is 7763574.

A 20% lighter version of the original color is 10988463, and 4409162 is the 20% darker color. If you saturate the color by 10%, you get 6779259, and if you desaturate by 10%, it is 8355195.

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 Decimal color 7567227 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 Decimal color 7567227 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%.7567227The Color 7567227.16777215The Color 16777215.16515071The Color 16515071.14607079The Color 14607079.12764875The Color 12764875.10988463The Color 10988463.9277845The Color 9277845.7567227The Color 7567227.Brightness Gradient

🖌️ View as Color Bucket

Brightness Gradient[Translation for "HARMONY_BRIGHTNESS_1_TEXT" not found]7567227The Color 7567227.0The Color 0.6The Color 6.1580063The Color 1580063.2961460The Color 2961460.4409162The Color 4409162.5922402The Color 5922402.7567227The Color 7567227.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.7567227The Color 7567227.278651The Color 278651.1132155The Color 1132155.1920123The Color 1920123.2708091The Color 2708091.3561595The Color 3561595.4349563The Color 4349563.5137787The Color 5137787.5925755The Color 5925755.6779259The Color 6779259.7567227The Color 7567227.Saturation Gradient

🖌️ View as Color Bucket

Saturation Gradient[Translation for "HARMONY_SATURATION_1_TEXT" not found]7567227The Color 7567227.14855803The Color 14855803.14002299The Color 14002299.13214331The Color 13214331.12426363The Color 12426363.11638395The Color 11638395.10784891The Color 10784891.9996667The Color 9996667.9208699The Color 9208699.8355195The Color 8355195.7567227The Color 7567227.Saturation Gradient

🖌️ View as Color Bucket

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.7436410The Color 7436410.7763579The Color 7763579.7567227The Color 7567227.7436410The Color 7436410.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.7567227The Color 7567227.7632755The Color 7632755.8156533The Color 8156533.7567227The Color 7567227.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.7567227The Color 7567227.8091507The Color 8091507.7567227The Color 7567227.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.7829362The Color 7829362.8090995The Color 8090995.7567227The Color 7567227.7829362The Color 7829362.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.7567227The Color 7567227.7501941The Color 7501941.8025714The Color 8025714.8091000The Color 8091000.7567227The Color 7567227.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.7567227The Color 7567227.7698291The Color 7698291.8025714The Color 8025714.7894650The Color 7894650.7567227The Color 7567227.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.7567227The Color 7567227.5395026The Color 5395026.13750737The Color 13750737.5263698The Color 5263698.7568247The Color 7568247.10330017The Color 10330017.7567227The Color 7567227.Sweetspot

🖌️ View as Color Bucket

SVG Images

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

#73777B

Previews

White Background

 

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

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

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

Decimal 7567227 Background

 

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

 

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

CSS Examples


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

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

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

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

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

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

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

Background

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

If only the background color should be changed .background{ background-color:#73777B } 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, "73777B", 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 "210°, 7%, 48%" 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(210°, 7%, 48%)" will give you the correct HSV color as there is no need to guess the format. Other examples would be "CIELAB(49.82, -0.66, -2.72)", "CIELCH(50, 2.800, 256.297)", "YXY(18.2685, 0.3032, 0.3213)" and "CMYK(0.07, 0.03, 0.00, 0.52)".


125x125 Fiverr Pro  Grammarly Logo    10% discount- Jump- start your career  Searchmetrics Essentials - try for free

Advertisment: These links are affiliate (commission) links. If you click on such a link and buy something on that website, I get a commission. For you, the price does not change.