snapchat icon
snapchat from Mage Icons by MageIcons · Outline · Apache-2.0 Free for personal and commercial use.
- Name
- snapchat
- Set
- Mage Icons
- Style
- Outline
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
snapchat-fillAkar Iconssnapchat-filledAnt Design IconssnapchatBootstrap IconssnapchatBoxicons BrandssnapchatCoreUI BrandssnapchatFont Awesome 6 BrandssnapchatFont Awesome BrandssnapchatHuge IconssnapchatIconoirsnapchatJam IconssnapchatLine AwesomesnapchatMaterial Design Iconssnapchat-fillMingCute Iconsnapchat-fillRemix IconsnapchatSimple Iconssnapchat-outlineTeenyicons
Use the snapchat icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.74 5.457a3.4 3.4 0 0 0 0-.55A3.09 3.09 0 0 0 18.6 2.25H5.42q-.46.011-.906.128a3.08 3.08 0 0 0-2.264 3.06v13.075q-.005.403.079.797a3.1 3.1 0 0 0 3.14 2.44H18.53a3.4 3.4 0 0 0 1.142-.187a3.03 3.03 0 0 0 2.067-2.951c.01-4.418 0-8.786 0-13.155m-3.326 10.914c-.314.18-.536.24-.877.361a.46.46 0 0 0-.315.276a1.07 1.07 0 0 1-.984.708l-.817.05a2.84 2.84 0 0 0-1.24.491a3.84 3.84 0 0 1-3.672.305a3 3 0 0 1-.64-.344a2.95 2.95 0 0 0-1.693-.492a2.5 2.5 0 0 1-.542-.05a.99.99 0 0 1-.777-.648a.44.44 0 0 0-.345-.305a2.6 2.6 0 0 1-1.142-.581a.876.876 0 0 1 .197-1.505c.355-.207.709-.404 1.044-.64c.41-.297.747-.684.984-1.131c.148-.295.138-.325-.128-.502a8 8 0 0 1-.807-.59a1.17 1.17 0 0 1-.364-1.28a1.22 1.22 0 0 1 1.437-.855h.187a4.11 4.11 0 0 1 1.26-3.542a4.2 4.2 0 0 1 2.815-.984a4.17 4.17 0 0 1 3.18 1.318a4.3 4.3 0 0 1 .984 3.267q.335-.03.67 0a1.14 1.14 0 0 1 .984.866a1.2 1.2 0 0 1-.374 1.25a9 9 0 0 1-.847.629c-.226.147-.236.177-.118.423a3.9 3.9 0 0 0 1.585 1.574l.433.236a.905.905 0 0 1 .03 1.633z"/><path fill="currentColor" d="M17.832 15.316c0 .068-.098.167-.177.196c-.315.128-.63.256-.984.355a.54.54 0 0 0-.463.521a.296.296 0 0 1-.315.295l-.984.069c-.503.084-.98.279-1.398.57a2.9 2.9 0 0 1-3.258-.058a3.6 3.6 0 0 0-1.969-.561h-.05c-.383 0-.432-.06-.491-.433a.38.38 0 0 0-.256-.335c-.168-.068-.335-.108-.502-.177c-.168-.068-.433-.157-.64-.255c-.207-.099-.187-.119-.187-.197s.098-.148.177-.187a5.2 5.2 0 0 0 1.723-1.309c.3-.36.52-.779.65-1.23a.42.42 0 0 0-.168-.53c-.266-.178-.541-.355-.797-.542a2.4 2.4 0 0 1-.374-.325a.4.4 0 0 1 0-.462a.354.354 0 0 1 .393-.187q.305.064.6.157l.13.03l.133.056c.276.099.27-.036.26-.322a14 14 0 0 1 0-1.918a2.68 2.68 0 0 1 1.88-2.214a3.45 3.45 0 0 1 2.598.069a2.765 2.765 0 0 1 1.782 2.656v1.575c0 .255.05.285.276.206l.669-.226a.7.7 0 0 1 .256 0a.39.39 0 0 1 .374.197a.364.364 0 0 1 0 .442a2.3 2.3 0 0 1-.364.335c-.227.157-.463.295-.7.453c-.235.157-.373.344-.245.728a3.6 3.6 0 0 0 1.27 1.77c.315.246.506.347.862.59c.151.102.3.129.29.198"/></svg>
React
import type { SVGProps } from "react";
export function MageSnapchat(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.74 5.457a3.4 3.4 0 0 0 0-.55A3.09 3.09 0 0 0 18.6 2.25H5.42q-.46.011-.906.128a3.08 3.08 0 0 0-2.264 3.06v13.075q-.005.403.079.797a3.1 3.1 0 0 0 3.14 2.44H18.53a3.4 3.4 0 0 0 1.142-.187a3.03 3.03 0 0 0 2.067-2.951c.01-4.418 0-8.786 0-13.155m-3.326 10.914c-.314.18-.536.24-.877.361a.46.46 0 0 0-.315.276a1.07 1.07 0 0 1-.984.708l-.817.05a2.84 2.84 0 0 0-1.24.491a3.84 3.84 0 0 1-3.672.305a3 3 0 0 1-.64-.344a2.95 2.95 0 0 0-1.693-.492a2.5 2.5 0 0 1-.542-.05a.99.99 0 0 1-.777-.648a.44.44 0 0 0-.345-.305a2.6 2.6 0 0 1-1.142-.581a.876.876 0 0 1 .197-1.505c.355-.207.709-.404 1.044-.64c.41-.297.747-.684.984-1.131c.148-.295.138-.325-.128-.502a8 8 0 0 1-.807-.59a1.17 1.17 0 0 1-.364-1.28a1.22 1.22 0 0 1 1.437-.855h.187a4.11 4.11 0 0 1 1.26-3.542a4.2 4.2 0 0 1 2.815-.984a4.17 4.17 0 0 1 3.18 1.318a4.3 4.3 0 0 1 .984 3.267q.335-.03.67 0a1.14 1.14 0 0 1 .984.866a1.2 1.2 0 0 1-.374 1.25a9 9 0 0 1-.847.629c-.226.147-.236.177-.118.423a3.9 3.9 0 0 0 1.585 1.574l.433.236a.905.905 0 0 1 .03 1.633z"/><path fill="currentColor" d="M17.832 15.316c0 .068-.098.167-.177.196c-.315.128-.63.256-.984.355a.54.54 0 0 0-.463.521a.296.296 0 0 1-.315.295l-.984.069c-.503.084-.98.279-1.398.57a2.9 2.9 0 0 1-3.258-.058a3.6 3.6 0 0 0-1.969-.561h-.05c-.383 0-.432-.06-.491-.433a.38.38 0 0 0-.256-.335c-.168-.068-.335-.108-.502-.177c-.168-.068-.433-.157-.64-.255c-.207-.099-.187-.119-.187-.197s.098-.148.177-.187a5.2 5.2 0 0 0 1.723-1.309c.3-.36.52-.779.65-1.23a.42.42 0 0 0-.168-.53c-.266-.178-.541-.355-.797-.542a2.4 2.4 0 0 1-.374-.325a.4.4 0 0 1 0-.462a.354.354 0 0 1 .393-.187q.305.064.6.157l.13.03l.133.056c.276.099.27-.036.26-.322a14 14 0 0 1 0-1.918a2.68 2.68 0 0 1 1.88-2.214a3.45 3.45 0 0 1 2.598.069a2.765 2.765 0 0 1 1.782 2.656v1.575c0 .255.05.285.276.206l.669-.226a.7.7 0 0 1 .256 0a.39.39 0 0 1 .374.197a.364.364 0 0 1 0 .442a2.3 2.3 0 0 1-.364.335c-.227.157-.463.295-.7.453c-.235.157-.373.344-.245.728a3.6 3.6 0 0 0 1.27 1.77c.315.246.506.347.862.59c.151.102.3.129.29.198"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.74 5.457a3.4 3.4 0 0 0 0-.55A3.09 3.09 0 0 0 18.6 2.25H5.42q-.46.011-.906.128a3.08 3.08 0 0 0-2.264 3.06v13.075q-.005.403.079.797a3.1 3.1 0 0 0 3.14 2.44H18.53a3.4 3.4 0 0 0 1.142-.187a3.03 3.03 0 0 0 2.067-2.951c.01-4.418 0-8.786 0-13.155m-3.326 10.914c-.314.18-.536.24-.877.361a.46.46 0 0 0-.315.276a1.07 1.07 0 0 1-.984.708l-.817.05a2.84 2.84 0 0 0-1.24.491a3.84 3.84 0 0 1-3.672.305a3 3 0 0 1-.64-.344a2.95 2.95 0 0 0-1.693-.492a2.5 2.5 0 0 1-.542-.05a.99.99 0 0 1-.777-.648a.44.44 0 0 0-.345-.305a2.6 2.6 0 0 1-1.142-.581a.876.876 0 0 1 .197-1.505c.355-.207.709-.404 1.044-.64c.41-.297.747-.684.984-1.131c.148-.295.138-.325-.128-.502a8 8 0 0 1-.807-.59a1.17 1.17 0 0 1-.364-1.28a1.22 1.22 0 0 1 1.437-.855h.187a4.11 4.11 0 0 1 1.26-3.542a4.2 4.2 0 0 1 2.815-.984a4.17 4.17 0 0 1 3.18 1.318a4.3 4.3 0 0 1 .984 3.267q.335-.03.67 0a1.14 1.14 0 0 1 .984.866a1.2 1.2 0 0 1-.374 1.25a9 9 0 0 1-.847.629c-.226.147-.236.177-.118.423a3.9 3.9 0 0 0 1.585 1.574l.433.236a.905.905 0 0 1 .03 1.633z"/><path fill="currentColor" d="M17.832 15.316c0 .068-.098.167-.177.196c-.315.128-.63.256-.984.355a.54.54 0 0 0-.463.521a.296.296 0 0 1-.315.295l-.984.069c-.503.084-.98.279-1.398.57a2.9 2.9 0 0 1-3.258-.058a3.6 3.6 0 0 0-1.969-.561h-.05c-.383 0-.432-.06-.491-.433a.38.38 0 0 0-.256-.335c-.168-.068-.335-.108-.502-.177c-.168-.068-.433-.157-.64-.255c-.207-.099-.187-.119-.187-.197s.098-.148.177-.187a5.2 5.2 0 0 0 1.723-1.309c.3-.36.52-.779.65-1.23a.42.42 0 0 0-.168-.53c-.266-.178-.541-.355-.797-.542a2.4 2.4 0 0 1-.374-.325a.4.4 0 0 1 0-.462a.354.354 0 0 1 .393-.187q.305.064.6.157l.13.03l.133.056c.276.099.27-.036.26-.322a14 14 0 0 1 0-1.918a2.68 2.68 0 0 1 1.88-2.214a3.45 3.45 0 0 1 2.598.069a2.765 2.765 0 0 1 1.782 2.656v1.575c0 .255.05.285.276.206l.669-.226a.7.7 0 0 1 .256 0a.39.39 0 0 1 .374.197a.364.364 0 0 1 0 .442a2.3 2.3 0 0 1-.364.335c-.227.157-.463.295-.7.453c-.235.157-.373.344-.245.728a3.6 3.6 0 0 0 1.27 1.77c.315.246.506.347.862.59c.151.102.3.129.29.198"/></svg> </template>
CSS
.icon-snapchat {
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%22currentColor%22%20d%3D%22M21.74%205.457a3.4%203.4%200%200%200%200-.55A3.09%203.09%200%200%200%2018.6%202.25H5.42q-.46.011-.906.128a3.08%203.08%200%200%200-2.264%203.06v13.075q-.005.403.079.797a3.1%203.1%200%200%200%203.14%202.44H18.53a3.4%203.4%200%200%200%201.142-.187a3.03%203.03%200%200%200%202.067-2.951c.01-4.418%200-8.786%200-13.155m-3.326%2010.914c-.314.18-.536.24-.877.361a.46.46%200%200%200-.315.276a1.07%201.07%200%200%201-.984.708l-.817.05a2.84%202.84%200%200%200-1.24.491a3.84%203.84%200%200%201-3.672.305a3%203%200%200%201-.64-.344a2.95%202.95%200%200%200-1.693-.492a2.5%202.5%200%200%201-.542-.05a.99.99%200%200%201-.777-.648a.44.44%200%200%200-.345-.305a2.6%202.6%200%200%201-1.142-.581a.876.876%200%200%201%20.197-1.505c.355-.207.709-.404%201.044-.64c.41-.297.747-.684.984-1.131c.148-.295.138-.325-.128-.502a8%208%200%200%201-.807-.59a1.17%201.17%200%200%201-.364-1.28a1.22%201.22%200%200%201%201.437-.855h.187a4.11%204.11%200%200%201%201.26-3.542a4.2%204.2%200%200%201%202.815-.984a4.17%204.17%200%200%201%203.18%201.318a4.3%204.3%200%200%201%20.984%203.267q.335-.03.67%200a1.14%201.14%200%200%201%20.984.866a1.2%201.2%200%200%201-.374%201.25a9%209%200%200%201-.847.629c-.226.147-.236.177-.118.423a3.9%203.9%200%200%200%201.585%201.574l.433.236a.905.905%200%200%201%20.03%201.633z%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M17.832%2015.316c0%20.068-.098.167-.177.196c-.315.128-.63.256-.984.355a.54.54%200%200%200-.463.521a.296.296%200%200%201-.315.295l-.984.069c-.503.084-.98.279-1.398.57a2.9%202.9%200%200%201-3.258-.058a3.6%203.6%200%200%200-1.969-.561h-.05c-.383%200-.432-.06-.491-.433a.38.38%200%200%200-.256-.335c-.168-.068-.335-.108-.502-.177c-.168-.068-.433-.157-.64-.255c-.207-.099-.187-.119-.187-.197s.098-.148.177-.187a5.2%205.2%200%200%200%201.723-1.309c.3-.36.52-.779.65-1.23a.42.42%200%200%200-.168-.53c-.266-.178-.541-.355-.797-.542a2.4%202.4%200%200%201-.374-.325a.4.4%200%200%201%200-.462a.354.354%200%200%201%20.393-.187q.305.064.6.157l.13.03l.133.056c.276.099.27-.036.26-.322a14%2014%200%200%201%200-1.918a2.68%202.68%200%200%201%201.88-2.214a3.45%203.45%200%200%201%202.598.069a2.765%202.765%200%200%201%201.782%202.656v1.575c0%20.255.05.285.276.206l.669-.226a.7.7%200%200%201%20.256%200a.39.39%200%200%201%20.374.197a.364.364%200%200%201%200%20.442a2.3%202.3%200%200%201-.364.335c-.227.157-.463.295-.7.453c-.235.157-.373.344-.245.728a3.6%203.6%200%200%200%201.27%201.77c.315.246.506.347.862.59c.151.102.3.129.29.198%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%22currentColor%22%20d%3D%22M21.74%205.457a3.4%203.4%200%200%200%200-.55A3.09%203.09%200%200%200%2018.6%202.25H5.42q-.46.011-.906.128a3.08%203.08%200%200%200-2.264%203.06v13.075q-.005.403.079.797a3.1%203.1%200%200%200%203.14%202.44H18.53a3.4%203.4%200%200%200%201.142-.187a3.03%203.03%200%200%200%202.067-2.951c.01-4.418%200-8.786%200-13.155m-3.326%2010.914c-.314.18-.536.24-.877.361a.46.46%200%200%200-.315.276a1.07%201.07%200%200%201-.984.708l-.817.05a2.84%202.84%200%200%200-1.24.491a3.84%203.84%200%200%201-3.672.305a3%203%200%200%201-.64-.344a2.95%202.95%200%200%200-1.693-.492a2.5%202.5%200%200%201-.542-.05a.99.99%200%200%201-.777-.648a.44.44%200%200%200-.345-.305a2.6%202.6%200%200%201-1.142-.581a.876.876%200%200%201%20.197-1.505c.355-.207.709-.404%201.044-.64c.41-.297.747-.684.984-1.131c.148-.295.138-.325-.128-.502a8%208%200%200%201-.807-.59a1.17%201.17%200%200%201-.364-1.28a1.22%201.22%200%200%201%201.437-.855h.187a4.11%204.11%200%200%201%201.26-3.542a4.2%204.2%200%200%201%202.815-.984a4.17%204.17%200%200%201%203.18%201.318a4.3%204.3%200%200%201%20.984%203.267q.335-.03.67%200a1.14%201.14%200%200%201%20.984.866a1.2%201.2%200%200%201-.374%201.25a9%209%200%200%201-.847.629c-.226.147-.236.177-.118.423a3.9%203.9%200%200%200%201.585%201.574l.433.236a.905.905%200%200%201%20.03%201.633z%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M17.832%2015.316c0%20.068-.098.167-.177.196c-.315.128-.63.256-.984.355a.54.54%200%200%200-.463.521a.296.296%200%200%201-.315.295l-.984.069c-.503.084-.98.279-1.398.57a2.9%202.9%200%200%201-3.258-.058a3.6%203.6%200%200%200-1.969-.561h-.05c-.383%200-.432-.06-.491-.433a.38.38%200%200%200-.256-.335c-.168-.068-.335-.108-.502-.177c-.168-.068-.433-.157-.64-.255c-.207-.099-.187-.119-.187-.197s.098-.148.177-.187a5.2%205.2%200%200%200%201.723-1.309c.3-.36.52-.779.65-1.23a.42.42%200%200%200-.168-.53c-.266-.178-.541-.355-.797-.542a2.4%202.4%200%200%201-.374-.325a.4.4%200%200%201%200-.462a.354.354%200%200%201%20.393-.187q.305.064.6.157l.13.03l.133.056c.276.099.27-.036.26-.322a14%2014%200%200%201%200-1.918a2.68%202.68%200%200%201%201.88-2.214a3.45%203.45%200%200%201%202.598.069a2.765%202.765%200%200%201%201.782%202.656v1.575c0%20.255.05.285.276.206l.669-.226a.7.7%200%200%201%20.256%200a.39.39%200%200%201%20.374.197a.364.364%200%200%201%200%20.442a2.3%202.3%200%200%201-.364.335c-.227.157-.463.295-.7.453c-.235.157-.373.344-.245.728a3.6%203.6%200%200%200%201.27%201.77c.315.246.506.347.862.59c.151.102.3.129.29.198%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mage/snapchat.svg?color=%231a73e8&size=48
