Snapchat icon
thesvg-color:snapchat
The Snapchat icon (thesvg-color:snapchat) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 515 × 515 grid. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- theSVG Color
- Author
- thesvg.org
- License
- MIT
- Size
- 515 × 515
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="515" height="515" viewBox="0 0 515 515"><path fill="#fffc00" d="M147.553 423.021v.023c.308 11.424.403 22.914 2.33 34.268c2.042 12.012 4.961 23.725 10.53 34.627c7.529 14.756 17.869 27.217 30.921 37.396c9.371 7.309 19.608 13.111 30.94 16.771c16.524 5.33 33.571 7.373 50.867 7.473c10.791.068 21.575.338 32.37.293c78.395-.33 156.792.566 235.189-.484c10.403-.141 20.636-1.41 30.846-3.277c19.569-3.582 36.864-11.932 51.661-25.133c17.245-15.381 28.88-34.205 34.132-56.924c3.437-14.85 4.297-29.916 4.444-45.035v-3.016c0-1.17-.445-256.892-.486-260.272c-.115-9.285-.799-18.5-2.54-27.636c-2.117-11.133-5.108-21.981-10.439-32.053c-5.629-10.641-12.68-20.209-21.401-28.57c-13.359-12.81-28.775-21.869-46.722-26.661c-16.21-4.327-32.747-5.285-49.405-5.27c-.027-.004-.09-.173-.094-.255H278.56q-.006.13-.014.255c-9.454.173-18.922.102-28.328 1.268c-10.304 1.281-20.509 3.21-30.262 6.812c-15.362 5.682-28.709 14.532-40.11 26.347c-12.917 13.386-22.022 28.867-26.853 46.894c-4.31 16.084-5.248 32.488-5.271 49.008"/><path fill="#fff" d="M407.001 473.488c-1.068 0-2.087-.039-2.862-.076c-.615.053-1.25.076-1.886.076c-22.437 0-37.439-10.607-50.678-19.973c-9.489-6.703-18.438-13.031-28.922-14.775c-5.149-.854-10.271-1.287-15.22-1.287c-8.917 0-15.964 1.383-21.109 2.389c-3.166.617-5.896 1.148-8.006 1.148c-2.21 0-4.895-.49-6.014-4.311c-.887-3.014-1.523-5.934-2.137-8.746c-1.536-7.027-2.65-11.316-5.281-11.723c-28.141-4.342-44.768-10.738-48.08-18.484a7.2 7.2 0 0 1-.584-2.443a4.52 4.52 0 0 1 3.777-4.711c22.348-3.68 42.219-15.492 59.064-35.119c13.049-15.195 19.457-29.713 20.145-31.316a3 3 0 0 1 .101-.217c3.247-6.588 3.893-12.281 1.926-16.916c-3.626-8.551-15.635-12.361-23.58-14.882c-1.976-.625-3.845-1.217-5.334-1.808c-7.043-2.782-18.626-8.66-17.083-16.773c1.124-5.916 8.949-10.036 15.273-10.036c1.756 0 3.312.308 4.622.923c7.146 3.348 13.575 5.045 19.104 5.045c6.876 0 10.197-2.618 11-3.362a1171 1171 0 0 0-.679-11.262c-1.614-25.675-3.627-57.627 4.546-75.95c24.462-54.847 76.339-59.112 91.651-59.112a3910 3910 0 0 0 7.582-.071c15.354 0 67.339 4.27 91.816 59.15c8.173 18.335 6.158 50.314 4.539 76.016l-.076 1.23c-.222 3.49-.427 6.793-.6 9.995c.756.696 3.795 3.096 9.978 3.339c5.271-.202 11.328-1.891 17.998-5.014c2.062-.968 4.345-1.169 5.895-1.169c2.343 0 4.727.456 6.714 1.285l.106.041c5.66 2.009 9.367 6.024 9.447 10.242c.071 3.932-2.851 9.809-17.223 15.485c-1.472.583-3.35 1.179-5.334 1.808c-7.952 2.524-19.951 6.332-23.577 14.878c-1.97 4.635-1.322 10.326 1.926 16.912c.036.072.067.145.102.221c1 2.344 25.205 57.535 79.209 66.432a4.523 4.523 0 0 1 3.778 4.711a7.3 7.3 0 0 1-.598 2.465c-3.289 7.703-19.915 14.09-48.064 18.438c-2.642.408-3.755 4.678-5.277 11.668c-.63 2.887-1.271 5.717-2.146 8.691c-.819 2.797-2.641 4.164-5.567 4.164h-.441c-1.905 0-4.604-.346-8.008-1.012c-5.95-1.158-12.623-2.236-21.109-2.236c-4.948 0-10.069.434-15.224 1.287c-10.473 1.744-19.421 8.062-28.893 14.758c-13.265 9.379-28.272 19.987-50.707 19.987"/><path fill="#020202" d="M408.336 124.235c14.455 0 64.231 3.883 87.688 56.472c7.724 17.317 5.744 48.686 4.156 73.885c-.248 3.999-.494 7.875-.694 11.576l-.084 1.591l1.062 1.185c.429.476 4.444 4.672 13.374 5.017l.144.008l.15-.003c5.904-.225 12.554-2.059 19.776-5.442c1.064-.498 2.48-.741 3.978-.741c1.707 0 3.521.321 5.017.951l.226.09c3.787 1.327 6.464 3.829 6.505 6.093c.022 1.28-.935 5.891-14.359 11.194c-1.312.518-3.039 1.069-5.041 1.7c-8.736 2.774-21.934 6.96-26.376 17.427c-2.501 5.896-1.816 12.854 2.034 20.678c1.584 3.697 26.52 59.865 82.631 69.111a2.5 2.5 0 0 1-.229.9c-.951 2.24-6.996 9.979-44.612 15.783c-5.886.902-7.328 7.5-9 15.17c-.604 2.746-1.218 5.518-2.062 8.381c-.258.865-.306.914-1.233.914h-.442c-1.668 0-4.2-.346-7.135-.922c-5.345-1.041-12.647-2.318-21.982-2.318c-5.21 0-10.577.453-15.962 1.352c-11.511 1.914-20.872 8.535-30.786 15.543c-13.314 9.408-27.075 19.143-48.071 19.143c-.917 0-1.812-.031-2.709-.076l-.236-.01l-.237.018q-.77.068-1.564.068c-20.993 0-34.76-9.732-48.068-19.143c-9.916-7.008-19.282-13.629-30.791-15.543c-5.38-.896-10.752-1.352-15.959-1.352c-9.333 0-16.644 1.428-21.978 2.471c-2.935.574-5.476 1.066-7.139 1.066c-1.362 0-1.388-.08-1.676-1.064c-.844-2.865-1.461-5.703-2.062-8.445c-1.676-7.678-3.119-14.312-9.002-15.215c-37.613-5.809-43.659-13.561-44.613-15.795a2.7 2.7 0 0 1-.231-.918c56.11-9.238 81.041-65.408 82.63-69.119c3.857-7.818 4.541-14.775 2.032-20.678c-4.442-10.461-17.638-14.653-26.368-17.422c-2.007-.635-3.735-1.187-5.048-1.705c-11.336-4.479-14.823-8.991-14.305-11.725c.601-3.153 6.067-6.359 10.837-6.359c1.072 0 2.012.173 2.707.498c7.747 3.631 14.819 5.472 21.022 5.472c9.751 0 14.091-4.537 14.557-5.055l1.057-1.182l-.085-1.583c-.197-3.699-.44-7.574-.696-11.565c-1.583-25.205-3.563-56.553 4.158-73.871c23.37-52.396 72.903-56.435 87.525-56.435c.36 0 6.717-.065 6.717-.065c.26-.002.549-.006.852-.006m0-9.038h-.017q-.498-.001-.944.004l-6.633.066c-8.566 0-25.705 1.21-44.115 9.336c-10.526 4.643-19.994 10.921-28.14 18.66c-9.712 9.221-17.624 20.59-23.512 33.796c-8.623 19.336-6.576 51.905-4.932 78.078l.006.041c.176 2.803.361 5.73.53 8.582c-1.265.581-3.316 1.194-6.339 1.194c-4.864 0-10.648-1.555-17.187-4.619c-1.924-.896-4.12-1.349-6.543-1.349c-3.893 0-7.997 1.146-11.557 3.239c-4.479 2.63-7.373 6.347-8.159 10.468c-.518 2.726-.493 8.114 5.492 13.578c3.292 3.008 8.128 5.782 14.37 8.249c1.638.645 3.582 1.261 5.641 1.914c7.145 2.271 17.959 5.702 20.779 12.339c1.429 3.365.814 7.793-1.823 13.145c-.069.146-.138.289-.201.439c-.659 1.539-6.807 15.465-19.418 30.152c-7.166 8.352-15.059 15.332-23.447 20.752c-10.238 6.617-21.316 10.943-32.923 12.855a9.04 9.04 0 0 0-7.559 9.424c.078 1.33.39 2.656.931 3.939l.013.023c1.843 4.311 6.116 7.973 13.063 11.203c8.489 3.943 21.185 7.26 37.732 9.855c.836 1.59 1.704 5.586 2.305 8.322c.629 2.908 1.285 5.898 2.22 9.074c1.009 3.441 3.626 7.553 10.349 7.553c2.548 0 5.478-.574 8.871-1.232c4.969-.975 11.764-2.305 20.245-2.305c4.702 0 9.575.414 14.48 1.229c9.455 1.574 17.606 7.332 27.037 14c13.804 9.758 29.429 20.803 53.302 20.803c.651 0 1.304-.021 1.949-.066c.789.037 1.767.066 2.799.066c23.88 0 39.501-11.049 53.29-20.799l.022-.02c9.433-6.66 17.575-12.41 27.027-13.984c4.903-.814 9.775-1.229 14.479-1.229c8.102 0 14.517 1.033 20.245 2.15c3.738.736 6.643 1.09 8.872 1.09l.218.004h.226c4.917 0 8.53-2.699 9.909-7.422c.916-3.109 1.57-6.029 2.215-8.986c.562-2.564 1.46-6.674 2.296-8.281c16.558-2.6 29.249-5.91 37.739-9.852c6.931-3.215 11.199-6.873 13.053-11.166c.556-1.287.881-2.621.954-3.979a9.036 9.036 0 0 0-7.56-9.424c-51.585-8.502-74.824-61.506-75.785-63.758a7 7 0 0 0-.205-.438c-2.637-5.354-3.246-9.777-1.816-13.148c2.814-6.631 13.621-10.062 20.771-12.332c2.07-.652 4.021-1.272 5.646-1.914c7.039-2.78 12.07-5.796 15.389-9.221c3.964-4.083 4.736-7.995 4.688-10.555c-.121-6.194-4.856-11.698-12.388-14.393c-2.544-1.052-5.445-1.607-8.399-1.607c-2.011 0-4.989.276-7.808 1.592c-6.035 2.824-11.441 4.368-16.082 4.588c-2.468-.125-4.199-.66-5.32-1.171c.141-2.416.297-4.898.458-7.486l.067-1.108c1.653-26.19 3.707-58.784-4.92-78.134c-5.913-13.253-13.853-24.651-23.604-33.892c-8.178-7.744-17.678-14.021-28.242-18.661c-18.384-8.066-35.522-9.271-44.1-9.271"/><path fill="none" d="M147.553 39.443h514.231v514.23H147.553z"/></svg>How to use the Snapchat icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:snapchat" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:snapchat" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:snapchat" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--snapchat]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:snapchat"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:snapchat"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/snapchat.svg" alt="Snapchat icon" width="24" height="24">Snapchat icon in other icon sets
Snapchat icon FAQ
Is the Snapchat icon free for commercial use?
Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Snapchat icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:snapchat" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Snapchat icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/snapchat.svg" alt="Snapchat icon">, or paste the SVG code inline to style it with CSS.