Shield Loading Icon SVG
Shield Loading
Shield loading SVG Icon Code | Customize color
You can get svg icon shield loading in blue, white, red color and transparent color from below list. You can also customize color using color picker.
CustomizeSvg Code
<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8 10.01L8.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/> <path d="M12 10.01L12.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/> <path d="M16 10.01L16.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/> <path d="M5 18L3.13036 4.91253C3.05646 4.39524 3.39389 3.91247 3.90398 3.79912L11.5661 2.09641C11.8519 2.03291 12.1481 2.03291 12.4339 2.09641L20.096 3.79912C20.6061 3.91247 20.9435 4.39524 20.8696 4.91252L19 18C18.9293 18.495 18.5 21.5 12 21.5C5.5 21.5 5.07071 18.495 5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/> </svg> Svg Code
<svg style="color: white" width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8 10.01L8.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="white"></path> <path d="M12 10.01L12.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="white"></path> <path d="M16 10.01L16.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="white"></path> <path d="M5 18L3.13036 4.91253C3.05646 4.39524 3.39389 3.91247 3.90398 3.79912L11.5661 2.09641C11.8519 2.03291 12.1481 2.03291 12.4339 2.09641L20.096 3.79912C20.6061 3.91247 20.9435 4.39524 20.8696 4.91252L19 18C18.9293 18.495 18.5 21.5 12 21.5C5.5 21.5 5.07071 18.495 5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="white"></path> </svg> Svg Code
<svg style="color: red" width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8 10.01L8.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="red"></path> <path d="M12 10.01L12.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="red"></path> <path d="M16 10.01L16.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="red"></path> <path d="M5 18L3.13036 4.91253C3.05646 4.39524 3.39389 3.91247 3.90398 3.79912L11.5661 2.09641C11.8519 2.03291 12.1481 2.03291 12.4339 2.09641L20.096 3.79912C20.6061 3.91247 20.9435 4.39524 20.8696 4.91252L19 18C18.9293 18.495 18.5 21.5 12 21.5C5.5 21.5 5.07071 18.495 5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="red"></path> </svg> Svg Code
<svg style="color: blue" width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8 10.01L8.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="blue"></path> <path d="M12 10.01L12.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="blue"></path> <path d="M16 10.01L16.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="blue"></path> <path d="M5 18L3.13036 4.91253C3.05646 4.39524 3.39389 3.91247 3.90398 3.79912L11.5661 2.09641C11.8519 2.03291 12.1481 2.03291 12.4339 2.09641L20.096 3.79912C20.6061 3.91247 20.9435 4.39524 20.8696 4.91252L19 18C18.9293 18.495 18.5 21.5 12 21.5C5.5 21.5 5.07071 18.495 5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="blue"></path> </svg> Svg Code
<svg style="color: #f3da35" width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8 10.01L8.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="#f3da35"></path> <path d="M12 10.01L12.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="#f3da35"></path> <path d="M16 10.01L16.01 9.99889" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="#f3da35"></path> <path d="M5 18L3.13036 4.91253C3.05646 4.39524 3.39389 3.91247 3.90398 3.79912L11.5661 2.09641C11.8519 2.03291 12.1481 2.03291 12.4339 2.09641L20.096 3.79912C20.6061 3.91247 20.9435 4.39524 20.8696 4.91252L19 18C18.9293 18.495 18.5 21.5 12 21.5C5.5 21.5 5.07071 18.495 5 18Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="#f3da35"></path> </svg> Advance Editor
You can edit shield loading as below. Change size color and background color of icon using below tool.
Advertisements
Advertisements