shield emoji
shield from Twitter Emoji by Twitter · Default · Objects · CC-BY-4.0 Attribution required.
- Name
- shield
- Set
- Twitter Emoji
- Style
- Default
- Category
- Objects
- Viewbox
- 36×36
- License
- CC BY 4.0
The same emoji 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
More objects icons from Twitter Emoji
Use the shield emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#ccd6dd" d="M33 3c-7-3-15-3-15-3S10 0 3 3C0 18 3 31 18 36c15-5 18-18 15-33"/><path fill="#55acee" d="M18 33.884C6.412 29.729 1.961 19.831 4.76 4.444C11.063 2.029 17.928 2 18 2c.071 0 6.958.04 13.24 2.444c2.799 15.387-1.652 25.285-13.24 29.44"/><path fill="#269" d="M31.24 4.444C24.958 2.04 18.071 2 18 2v31.884c11.588-4.155 16.039-14.053 13.24-29.44"/></svg>
React
import type { SVGProps } from "react";
export function TwemojiShield(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#ccd6dd" d="M33 3c-7-3-15-3-15-3S10 0 3 3C0 18 3 31 18 36c15-5 18-18 15-33"/><path fill="#55acee" d="M18 33.884C6.412 29.729 1.961 19.831 4.76 4.444C11.063 2.029 17.928 2 18 2c.071 0 6.958.04 13.24 2.444c2.799 15.387-1.652 25.285-13.24 29.44"/><path fill="#269" d="M31.24 4.444C24.958 2.04 18.071 2 18 2v31.884c11.588-4.155 16.039-14.053 13.24-29.44"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#ccd6dd" d="M33 3c-7-3-15-3-15-3S10 0 3 3C0 18 3 31 18 36c15-5 18-18 15-33"/><path fill="#55acee" d="M18 33.884C6.412 29.729 1.961 19.831 4.76 4.444C11.063 2.029 17.928 2 18 2c.071 0 6.958.04 13.24 2.444c2.799 15.387-1.652 25.285-13.24 29.44"/><path fill="#269" d="M31.24 4.444C24.958 2.04 18.071 2 18 2v31.884c11.588-4.155 16.039-14.053 13.24-29.44"/></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%2036%2036%22%3E%3Cpath%20fill%3D%22%23ccd6dd%22%20d%3D%22M33%203c-7-3-15-3-15-3S10%200%203%203C0%2018%203%2031%2018%2036c15-5%2018-18%2015-33%22%2F%3E%3Cpath%20fill%3D%22%2355acee%22%20d%3D%22M18%2033.884C6.412%2029.729%201.961%2019.831%204.76%204.444C11.063%202.029%2017.928%202%2018%202c.071%200%206.958.04%2013.24%202.444c2.799%2015.387-1.652%2025.285-13.24%2029.44%22%2F%3E%3Cpath%20fill%3D%22%23269%22%20d%3D%22M31.24%204.444C24.958%202.04%2018.071%202%2018%202v31.884c11.588-4.155%2016.039-14.053%2013.24-29.44%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%2036%2036%22%3E%3Cpath%20fill%3D%22%23ccd6dd%22%20d%3D%22M33%203c-7-3-15-3-15-3S10%200%203%203C0%2018%203%2031%2018%2036c15-5%2018-18%2015-33%22%2F%3E%3Cpath%20fill%3D%22%2355acee%22%20d%3D%22M18%2033.884C6.412%2029.729%201.961%2019.831%204.76%204.444C11.063%202.029%2017.928%202%2018%202c.071%200%206.958.04%2013.24%202.444c2.799%2015.387-1.652%2025.285-13.24%2029.44%22%2F%3E%3Cpath%20fill%3D%22%23269%22%20d%3D%22M31.24%204.444C24.958%202.04%2018.071%202%2018%202v31.884c11.588-4.155%2016.039-14.053%2013.24-29.44%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/twemoji/shield.svg?color=%231a73e8&size=48
