Horje
How to create HTML HSLA Color Values

HSLA color values are an extension of HSL color values, with an Alpha channel - which specifies the opacity for a color.

An HSLA color value is specified with:

hsla(hue, saturation, lightness, alpha)

The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all):


Full Example of HTML HSLA Color Values

index.html
Example: HTML
<!DOCTYPE html>
<html>
<body>

<h1 style="background-color:hsla(9, 100%, 64%, 0);">hsla(9, 100%, 64%, 0)</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.2);">hsla(9, 100%, 64%, 0.2)</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.4);">hsla(9, 100%, 64%, 0.4)</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.6);">hsla(9, 100%, 64%, 0.6)</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.8);">hsla(9, 100%, 64%, 0.8)</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 1);">hsla(9, 100%, 64%, 1)</h1>

</body>
</html>

Output should be:

Full Example of HTML HSLA Color Values





Related Articles
What is HTML HSL and HSLA Colors HTML HSL Colors
How to create HTML HSL Color Values HTML HSL Colors
How to create HTML Saturation Color HTML HSL Colors
How to create HTML Lightness Color HTML HSL Colors
How to create HTML Shades of Gray HTML HSL Colors
How to create HTML HSLA Color Values HTML HSL Colors

Single Articles
Full Example of HTML HSLA Color ValuesHTML HSL Colors

Read Full:
HTML HSL Colors
Category:
Web Tutorial
Sub Category:
HTML HSL Colors
Uploaded:
1 year ago
Uploaded by:
Admin
Views:
6
Ref on:
View



Share on: