Online Tools: Color Format Converter
The Online Color Format Converter makes it easy to convert colors between Color Names, HEX, RGB, HSL, HWB, CMYK, and NCOL. Simply enter any supported color value, and the tool instantly displays the equivalent values in all supported formats, along with a live color preview.
| name | gray |
| rgb | rgb(128, 128, 128) |
| hex | #808080 |
| hsl | hsl(0, 0%, 50%) |
| hwb | hwb(0, 50%, 50%) |
| cmyk | cmyk(0%, 0%, 0%, 50%) |
| ncol | R0, 50%, 50% |
Color Values Explained
Color Name: In HTML and CSS, a color name is a predefined keyword that represents a specific color. Modern browsers support 140 standard color names, which can be used to style text, backgrounds, borders, and other webpage elements.
HEX: A hexadecimal (HEX) color code defines a color using three pairs of hexadecimal digits that represent the red, green, and blue (RGB) color channels. Every HEX color begins with a hash symbol (#), such as #ff5733.
RGB: The RGB (Red, Green, Blue) color model creates colors by combining different intensities of red, green, and blue light. Each component ranges from 0 to 255, allowing more than 16 million possible color combinations.
HSL: (Hue, Saturation, Lightness) describes colors using three values: hue (0–359°), saturation (0–100%), and lightness (0–100%). This model is often preferred for creating and adjusting color variations in CSS.
HWB: (Hue, Whiteness, Blackness) defines colors using a hue value together with the percentages of whiteness and blackness. Like HSL and HSV, it is based on a cylindrical color model and provides an intuitive way to lighten or darken colors.
CMYK: (Cyan, Magenta, Yellow, Key/Black) is a subtractive color model used primarily for commercial printing. Colors are produced by combining varying amounts of cyan, magenta, yellow, and black inks on a light-colored surface.
NCOL: (Natural Color System) is a simplified method for describing colors using a base color letter followed by a percentage. The percentage indicates how far the color shifts toward the next primary color. For example, R30 represents red with 30% yellow, producing an orange-red color.
Related Resources:
Color Selector
px-pt-%-rem Units Calculator
HTML Editor
Color Tint & Shade Generator
Color Scheme Designer
CSS Gradient Tool
References:
