$1.73

How to make gradient transparency

Ask a question+
1

Is there easy way to make CSS gradient transparency?

Sara 170
add comment

1 Answer

1

You can use multiple backgrounds to achieve a transparent effect. To make it, you can use the rgba() function for defining the color stops. The last parameter in the rgba() function can be a value from 0 to 1, which will define the transparency of the color. 0 indicates full transparency, 1 shows full color.
Example

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .gradient {
      height: 200px;
      background-image: linear-gradient(to left, rgba(235, 117, 253, 0), rgba(235, 117, 253, 1));
      }
    </style>
  </head>
  <body>
    <div class="gradient"></div>
  </body>
</html>

Source https://www.w3docs.com/learn-css/css-gradients.html

Muhamed Aziz 320
add comment

Your Answer