Computer >> Computer tutorials >  >> Programming >> CSS

CSS Transparency Using RGBA


Use the RGBA() values for CSS transparency. Set the alpha channel parameter to specify the opacity for color.

Following is the code for implementing CSS transparency using RGBA −

Example

<!DOCTYPE html>
<html>
<head>
<style>
body {
   font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
div {
   width: 200px;
   height: 200px;
   background-color: rgb(0, 0, 255);
   color: white;
   display: inline-block;
}
.transparent {
   background-color: rgba(0, 0, 255, 0.582);
}
</style>
</head>
<body>
<h1>Transparency using RGBA example</h1>
<div class="transparent">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Hic, accusantium.
</div>
<div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, nisi!
</div>
</body>
</html>

Output

The above code will produce the following output −

CSS Transparency Using RGBA