HSL to RGBA

Compare HSL to RGBA

HSL, HLS or HSI (from the English hue, saturation, lightness (intensity)) is a color model in which the color coordinates are hue, saturation and lightness. It should be noted that HSV and HSL are two different color models (lightness, which is different from brightness). The HSL color model allows you to interpret the base RGB model in the projection of a cylindrical color coordinate system. Colorists believe that HSL allows you to specify colors in a more human-readable way than the typical RGB model. The abbreviation HSL is interpreted as Hue (color / hue), Saturation (saturation), Lightness / Luminance (luminance, not to be confused with brightness). The first factor (Hue) indicates the color coordinate within the color wheel (from 0 to 360 degrees). The second coefficient (Saturation) conveys the saturation value as a percentage (from 0% to 100%). The last factor (Lightness) indicates the percentage of lightness (from 0% to 100%).

RGBA stands for Red Green Blue Alpha. Although sometimes referred to as a color space, it is actually a three-channel RGB color model, augmented by a fourth alpha channel. Alpha specifies how opaque each pixel is, and allows you to combine an image with others using alpha blending, with transparent regions and smoothing the edges of opaque regions. The RGBA format is similar in syntax to RGB, but includes an alpha channel that controls the transparency of the element. A value of 0 corresponds to full transparency, 1 to opacity, and an intermediate value like 0.5 to semi-transparency. RGBA was added in CSS3, so CSS code validation should be done using this version. It should be noted that the CSS3 standard is still under development and some features in it may change. For example, an RGB color added to the background-color property is validated, but the color added to the background property no longer. At the same time, browsers quite correctly understand the color for both properties.