Round Mask Icon SVG
Round Mask
Round mask SVG Icon Code | Customize color
You can get svg icon round mask in blue, white, red color and transparent color from below list. You can also customize color using color picker.
CustomizeRound mask
DownloadSvg Code
<?xml version="1.0" encoding="UTF-8"?><svg width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"/><path d="M48 0H0V48H48V0Z" fill="white" fill-opacity="0.01"/><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9542 35.0457 4 24 4C12.9543 4 4 12.9542 4 24C4 35.0457 12.9543 44 24 44Z" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.0001 44C32.9553 44 40.5359 38.1142 43.0845 30H4.91565C7.46417 38.1142 15.0448 44 24.0001 44Z" fill="none" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg> Round mask
DownloadSvg Code
<!--?xml version="1.0" encoding="UTF-8"?--><svg style="color: white" width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"></rect><path d="M48 0H0V48H48V0Z" fill="white" fill-opacity="0.01"></path><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9542 35.0457 4 24 4C12.9543 4 4 12.9542 4 24C4 35.0457 12.9543 44 24 44Z" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" fill="white"></path><path d="M24.0001 44C32.9553 44 40.5359 38.1142 43.0845 30H4.91565C7.46417 38.1142 15.0448 44 24.0001 44Z" fill="white" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"></path></svg> Round mask
DownloadSvg Code
<!--?xml version="1.0" encoding="UTF-8"?--><svg style="color: red" width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"></rect><path d="M48 0H0V48H48V0Z" fill="red" fill-opacity="0.01"></path><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9542 35.0457 4 24 4C12.9543 4 4 12.9542 4 24C4 35.0457 12.9543 44 24 44Z" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" fill="red"></path><path d="M24.0001 44C32.9553 44 40.5359 38.1142 43.0845 30H4.91565C7.46417 38.1142 15.0448 44 24.0001 44Z" fill="red" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"></path></svg> Round mask
DownloadSvg Code
<!--?xml version="1.0" encoding="UTF-8"?--><svg style="color: blue" width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"></rect><path d="M48 0H0V48H48V0Z" fill="blue" fill-opacity="0.01"></path><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9542 35.0457 4 24 4C12.9543 4 4 12.9542 4 24C4 35.0457 12.9543 44 24 44Z" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" fill="blue"></path><path d="M24.0001 44C32.9553 44 40.5359 38.1142 43.0845 30H4.91565C7.46417 38.1142 15.0448 44 24.0001 44Z" fill="blue" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"></path></svg> Round mask
DownloadSvg Code
<!--?xml version="1.0" encoding="UTF-8"?--><svg style="color: #f3da35" width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"></rect><path d="M48 0H0V48H48V0Z" fill="#f3da35" fill-opacity="0.01"></path><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9542 35.0457 4 24 4C12.9543 4 4 12.9542 4 24C4 35.0457 12.9543 44 24 44Z" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" fill="#f3da35"></path><path d="M24.0001 44C32.9553 44 40.5359 38.1142 43.0845 30H4.91565C7.46417 38.1142 15.0448 44 24.0001 44Z" fill="#f3da35" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"></path></svg> Advance Editor
You can edit round mask as below. Change size color and background color of icon using below tool.
Advertisements
Advertisements