W3cubDocs

/Support Tables

CSS Masks

Method of displaying part of an element, using a selected image as a mask

Spec https://www.w3.org/TR/css-masking-1/
Status W3C Candidate Recommendation
IE Edge Firefox Chrome Safari Opera
      108 (1,*)    
    107 107 (1,*) TP  
    106 106 (1,*) 16.1  
11 105 (1,*) 105 105 (1,*) 16.0 91 (1,*)
10 104 (1,*) 104 104 (1,*) 15.6 90 (1,*)
9 103 (1,*) 103 103 (1,*) 15.5 89 (1,*)
8 102 (1,*) 102 102 (1,*) 15.4 88 (1,*)
Show all
7 101 (1,*) 101 101 (1,*) 15.2-15.3 (1,*) 87 (1,*)
6 100 (1,*) 100 100 (1,*) 15.1 (1,*) 86 (1,*)
5.5 99 (1,*) 99 99 (1,*) 15 (1,*) 85 (1,*)
  98 (1,*) 98 98 (1,*) 14.1 (1,*) 84 (1,*)
  97 (1,*) 97 97 (1,*) 14 (1,*) 83 (1,*)
  96 (1,*) 96 96 (1,*) 13.1 (1,*) 82 (1,*)
  95 (1,*) 95 95 (1,*) 13 (1,*) 81 (1,*)
  94 (1,*) 94 94 (1,*) 12.1 (1,*) 80 (1,*)
  93 (1,*) 93 93 (1,*) 12 (1,*) 79 (1,*)
  92 (1,*) 92 92 (1,*) 11.1 (1,*) 78 (1,*)
  91 (1,*) 91 91 (1,*) 11 (1,*) 77 (1,*)
  90 (1,*) 90 90 (1,*) 10.1 (1,*) 76 (1,*)
  89 (1,*) 89 89 (1,*) 10 (1,*) 75 (1,*)
  88 (1,*) 88 88 (1,*) 9.1 (1,*) 74 (1,*)
  87 (1,*) 87 87 (1,*) 9 (1,*) 73 (1,*)
  86 (1,*) 86 86 (1,*) 8 (1,*) 72 (1,*)
  85 (1,*) 85 85 (1,*) 7.1 (1,*) 71 (1,*)
  84 (1,*) 84 84 (1,*) 7 (1,*) 70 (1,*)
  83 (1,*) 83 83 (1,*) 6.1 (1,*) 69 (1,*)
  81 (1,*) 82 81 (1,*) 6 (1,*) 68 (1,*)
  80 (1,*) 81 80 (1,*) 5.1 (1,*) 67 (1,*)
  79 (1,*) 80 79 (1,*) 5 (1,*) 66 (1,*)
  18 (6,7) 79 78 (1,*) 4 (1,*) 65 (1,*)
  17 (4,5) 78 77 (1,*) 3.2 64 (1,*)
  16 77 76 (1,*) 3.1 63 (1,*)
  15 76 75 (1,*)   62 (1,*)
  14 75 74 (1,*)   60 (1,*)
  13 74 73 (1,*)   58 (1,*)
  12 73 72 (1,*)   57 (1,*)
    72 71 (1,*)   56 (1,*)
    71 70 (1,*)   55 (1,*)
    70 69 (1,*)   54 (1,*)
    69 68 (1,*)   53 (1,*)
    68 67 (1,*)   52 (1,*)
    67 66 (1,*)   51 (1,*)
    66 65 (1,*)   50 (1,*)
    65 64 (1,*)   49 (1,*)
    64 63 (1,*)   48 (1,*)
    63 62 (1,*)   47 (1,*)
    62 61 (1,*)   46 (1,*)
    61 60 (1,*)   45 (1,*)
    60 59 (1,*)   44 (1,*)
    59 58 (1,*)   43 (1,*)
    58 57 (1,*)   42 (1,*)
    57 56 (1,*)   41 (1,*)
    56 55 (1,*)   40 (1,*)
    55 54 (1,*)   39 (1,*)
    54 53 (1,*)   38 (1,*)
    53 52 (1,*)   37 (1,*)
    52 (2) 51 (1,*)   36 (1,*)
    51 (2) 50 (1,*)   35 (1,*)
    50 (2) 49 (1,*)   34 (1,*)
    49 (2) 48 (1,*)   33 (1,*)
    48 (2) 47 (1,*)   32 (1,*)
    47 (2) 46 (1,*)   31 (1,*)
    46 (2) 45 (1,*)   30 (1,*)
    45 (2) 44 (1,*)   29 (1,*)
    44 (2) 43 (1,*)   28 (1,*)
    43 (2) 42 (1,*)   27 (1,*)
    42 (2) 41 (1,*)   26 (1,*)
    41 (2) 40 (1,*)   25 (1,*)
    40 (2) 39 (1,*)   24 (1,*)
    39 (2) 38 (1,*)   23 (1,*)
    38 (2) 37 (1,*)   22 (1,*)
    37 (2) 36 (1,*)   21 (1,*)
    36 (2) 35 (1,*)   20 (1,*)
    35 (2) 34 (1,*)   19 (1,*)
    34 (2) 33 (1,*)   18 (1,*)
    33 (2) 32 (1,*)   17 (1,*)
    32 (2) 31 (1,*)   16 (1,*)
    31 (2) 30 (1,*)   15 (1,*)
    30 (2) 29 (1,*)   12.1
    29 (2) 28 (1,*)   12
    28 (2) 27 (1,*)   11.6
    27 (2) 26 (1,*)   11.5
    26 (2) 25 (1,*)   11.1
    25 (2) 24 (1,*)   11
    24 (2) 23 (1,*)   10.6
    23 (2) 22 (1,*)   10.5
    22 (2) 21 (1,*)   10.0-10.1
    21 (2) 20 (1,*)   9.5-9.6
    20 (2) 19 (1,*)   9
    19 (2) 18 (1,*)    
    18 (2) 17 (1,*)    
    17 (2) 16 (1,*)    
    16 (2) 15 (1,*)    
    15 (2) 14 (1,*)    
    14 (2) 13 (1,*)    
    13 (2) 12 (1,*)    
    12 (2) 11 (1,*)    
    11 (2) 10 (1,*)    
    10 (2) 9 (1,*)    
    9 (2) 8 (1,*)    
    8 (2) 7 (1,*)    
    7 (2) 6 (1,*)    
    6 (2) 5 (1,*)    
    5 (2) 4 (1,*)    
    4 (2)      
    3.6 (2)      
    3.5 (2)      
    3      
    2      
Safari on iOS Opera Mini Android Browser Blackberry Browser Opera Mobile Android Chrome Android Firefox IE Mobile Android UC Browser Samsung Internet QQ Browser Baidu Browser KaiOS Browser
16.1                        
16.0 all 105 (1,*) 10 (1,*) 64 (1,*) 105 (1,*) 104 11 13.4 (1,*) 18.0 (1,*) 13.1 (1,*) 13.18 (1,*) 2.5 (2)
15.6   4.4.3-4.4.4 (1,*) 7 (1,*) 12.1     10   17.0 (1,*)      
15.5   4.4 (1,*)   12         16.0 (1,*)      
15.4   4.2-4.3 (1,3,*)   11.5         15.0 (1,*)      
Show all
15.2-15.3 (1,*)   4.1 (1,3,*)   11.1         14.0 (1,*)      
15.0-15.1 (1,*)   4 (1,3,*)   11         13.0 (1,*)      
14.5-14.8 (1,*)   3 (1,3,*)   10         12.0 (1,*)      
14.0-14.4 (1,*)   2.3 (1,3,*)             11.1-11.2 (1,*)      
13.4-13.7 (1,*)   2.2 (1,3,*)             10.1 (1,*)      
13.3 (1,*)   2.1 (1,3,*)             9.2 (1,*)      
13.2 (1,*)                 8.2 (1,*)      
13.0-13.1 (1,*)                 7.2-7.4 (1,*)      
12.2-12.5 (1,*)                 6.2-6.4 (1,*)      
12.0-12.1 (1,*)                 5.0-5.4 (1,*)      
11.3-11.4 (1,*)                 4 (1,*)      
11.0-11.2 (1,*)                        
10.3 (1,*)                        
10.0-10.2 (1,*)                        
9.3 (1,*)                        
9.0-9.2 (1,*)                        
8.1-8.4 (1,*)                        
8 (1,*)                        
7.0-7.1 (1,*)                        
6.0-6.1 (1,*)                        
5.0-5.1 (1,*)                        
4.2-4.3 (1,*)                        
4.0-4.1 (1,*)                        
3.2 (1,*)                        

Notes

  1. Partial support in WebKit/Blink browsers refers to supporting the mask-image and mask-box-image properties, but lacking support for other parts of the spec.

  2. Partial support in Firefox refers to only support for inline SVG mask elements i.e. mask: url(#foo).

  3. Partial support refers to supporting the mask-box-image shorthand but not the longhand properties

  4. Can be enabled in MS edge behind the "Enable CSS Masking" flag.

  5. Partial support refers to supporting mask-image and mask-size

  6. Partial support refers to supporting mask-image, mask-size, mask-position, mask-repeat and mask-composite

  7. Edge also recognizes and supports all the -webkit- prefixed equivalents of the unprefixed properties for site compatibility

* Partial support with prefix.

Resources

Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
https://caniuse.com/css-masks