shield icon
shield from Keyline Icons by Keyline Icons · Stroke · MIT Free for personal and commercial use.
- Name
- shield
- Set
- Keyline Icons
- Style
- Stroke
- Viewbox
- 24×24
- License
- MIT
7 other variants in Keyline Icons
The same icon in other sets
shieldAkar IconsshieldBootstrap IconsshieldBoxIcons v2shieldBoxIcons v2 SolidshieldCodiconsshieldEmoji One (Colored)shield-fillEva IconsshieldFramework7 IconsshieldFont Awesome 6 SolidshieldFont Awesome SolidshieldFeather Iconsshield-outlineFlowbite Iconsshield-12-filledFluent UI System Iconsshield-16Fluent UI System Color IconsshieldFluent EmojishieldFluent Emoji FlatshieldFluent Emoji High Contrastshieldcss.ggshieldHumbleiconsshieldIconParkshieldIconPark OutlineshieldIconPark SolidshieldIconPark TwoToneshieldIconoir
Related icons in Keyline Icons
Use the shield icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5.18251 5.16845C7.83034 4.85425 9.82952 3.53222 11.0242 2.37315C11.537 1.87562 12.463 1.87562 12.9758 2.37315C14.1705 3.53222 16.1697 4.85425 18.8175 5.16845C19.4672 5.24554 20 5.75056 20 6.38285V12.5708C20 14.3452 19.7111 16.1513 18.612 17.5729C17.4097 19.1277 15.5033 20.8703 12.8298 21.8525C12.2945 22.0492 11.7055 22.0492 11.1702 21.8525C8.49668 20.8703 6.59026 19.1277 5.38804 17.5729C4.28885 16.1513 4 14.3452 4 12.5708V6.38285C4 5.75056 4.53284 5.24554 5.18251 5.16845Z"/></svg>
React
import type { SVGProps } from "react";
export function KeylineIconsShield(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M5.18251 5.16845C7.83034 4.85425 9.82952 3.53222 11.0242 2.37315C11.537 1.87562 12.463 1.87562 12.9758 2.37315C14.1705 3.53222 16.1697 4.85425 18.8175 5.16845C19.4672 5.24554 20 5.75056 20 6.38285V12.5708C20 14.3452 19.7111 16.1513 18.612 17.5729C17.4097 19.1277 15.5033 20.8703 12.8298 21.8525C12.2945 22.0492 11.7055 22.0492 11.1702 21.8525C8.49668 20.8703 6.59026 19.1277 5.38804 17.5729C4.28885 16.1513 4 14.3452 4 12.5708V6.38285C4 5.75056 4.53284 5.24554 5.18251 5.16845Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5.18251 5.16845C7.83034 4.85425 9.82952 3.53222 11.0242 2.37315C11.537 1.87562 12.463 1.87562 12.9758 2.37315C14.1705 3.53222 16.1697 4.85425 18.8175 5.16845C19.4672 5.24554 20 5.75056 20 6.38285V12.5708C20 14.3452 19.7111 16.1513 18.612 17.5729C17.4097 19.1277 15.5033 20.8703 12.8298 21.8525C12.2945 22.0492 11.7055 22.0492 11.1702 21.8525C8.49668 20.8703 6.59026 19.1277 5.38804 17.5729C4.28885 16.1513 4 14.3452 4 12.5708V6.38285C4 5.75056 4.53284 5.24554 5.18251 5.16845Z"/></svg> </template>
CSS
.icon-shield {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M5.18251%205.16845C7.83034%204.85425%209.82952%203.53222%2011.0242%202.37315C11.537%201.87562%2012.463%201.87562%2012.9758%202.37315C14.1705%203.53222%2016.1697%204.85425%2018.8175%205.16845C19.4672%205.24554%2020%205.75056%2020%206.38285V12.5708C20%2014.3452%2019.7111%2016.1513%2018.612%2017.5729C17.4097%2019.1277%2015.5033%2020.8703%2012.8298%2021.8525C12.2945%2022.0492%2011.7055%2022.0492%2011.1702%2021.8525C8.49668%2020.8703%206.59026%2019.1277%205.38804%2017.5729C4.28885%2016.1513%204%2014.3452%204%2012.5708V6.38285C4%205.75056%204.53284%205.24554%205.18251%205.16845Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M5.18251%205.16845C7.83034%204.85425%209.82952%203.53222%2011.0242%202.37315C11.537%201.87562%2012.463%201.87562%2012.9758%202.37315C14.1705%203.53222%2016.1697%204.85425%2018.8175%205.16845C19.4672%205.24554%2020%205.75056%2020%206.38285V12.5708C20%2014.3452%2019.7111%2016.1513%2018.612%2017.5729C17.4097%2019.1277%2015.5033%2020.8703%2012.8298%2021.8525C12.2945%2022.0492%2011.7055%2022.0492%2011.1702%2021.8525C8.49668%2020.8703%206.59026%2019.1277%205.38804%2017.5729C4.28885%2016.1513%204%2014.3452%204%2012.5708V6.38285C4%205.75056%204.53284%205.24554%205.18251%205.16845Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/shield.svg?color=%231a73e8&size=48
