I have been trying to achieve a single tone monochromic image and I think the way to do this is by masking. The images are logos which i need in a blue shade. I have converted my image into Gray scale and applied alpha masking through css. Here is the Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Masking</title>
</head>
<body style="background-color: #0041b2">
<img class="" src="blue.svg"
alt="Masked image" style="mask-image: url(https://storage.googleapis.com/alt-assets/media-houses/lawctopus.png);
mask-mode: alpha;
mask-repeat: no-repeat;
mask-size: 80%;">
</body>
</html>
This way works on some image url but in my case I have been getting this error on the console screen.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://storage.googleapis.com/alt-assets/media-houses/lawctopus.png. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Can anyone please help me with the solution of this particular or there is some other way for me to achieve the task.
The last time the question was marked closed without a right answer. Reposting it in some hope this time. Thank you in advance.
Aucun commentaire:
Enregistrer un commentaire