Home Whiteboard Graphing Calculator Online Compilers Articles Tools
Tutorials Courses Jobs

Set Mask Effect with CSS

CSS Web Development Front End Technology

Use the mask effect to turn transparent pixels to a specified color and makes opaque pixels transparent. The following parameter is used in this filter

Sr.No Parameter & Description
1 Color
The color that the transparent areas will become.

Example

You can try to run the following code to implement mask effect ?

<html>
   <head>
   </head>
   <body>
      <img src="/css/images/logo.png" alt="CSS Logo" style="FILTER: Chroma(Color = #000000) Mask(Color=#00FF00)">
      
      <p>Text Example:</p>

      <div style="width: 357;
          height: 50;
          font-size: 30pt;
          font-family: Arial Black;
          color: red;
          Filter: Mask(Color=#00FF00)">CSS Tutorials</div>
   </body>

</html>
Updated on: 2020-03-13T13:22:19+05:30

323 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements