Snap Svg icon
logos:snap-svg
The Snap Svg icon (logos:snap-svg) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 256 × 425 grid. SVG Logos icons are released under the CC0 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
- SVG Logos
- Author
- Gil Barbara
- License
- CC0-1.0
- Size
- 256 × 425
- Tags
- snapsvg
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="425" viewBox="0 0 256 425"><defs><radialGradient id="SVGHREXXgVz" cx="16.423%" cy="143%" r="295.571%" fx="16.423%" fy="143%"><stop offset="0%" stop-color="#00bc85"/><stop offset="100%" stop-color="#149d91"/></radialGradient><radialGradient id="SVG6UmI6bDY" cx="16.423%" cy="-43%" r="357.004%" fx="16.423%" fy="-43%"><stop offset="0%" stop-color="#00bc85"/><stop offset="100%" stop-color="#149d91"/></radialGradient><radialGradient id="SVGBZa6xpUb" cx="11.467%" cy="-40.458%" r="343.189%" fx="11.467%" fy="-40.458%"><stop offset="0%" stop-color="#004473"/><stop offset="100%" stop-color="#00345f"/></radialGradient><linearGradient id="SVGvlJZFd9v" x1="50%" x2="50%" y1="-352.926%" y2="96.718%"><stop offset="0%" stop-color="#002e3b"/><stop offset="100%" stop-color="#002639"/></linearGradient><linearGradient id="SVGZVLNw9hg" x1="50%" x2="50%" y1="-2.808%" y2="428.759%"><stop offset="0%" stop-color="#002e3b"/><stop offset="100%" stop-color="#002639"/></linearGradient></defs><path fill="url(#SVGvlJZFd9v)" d="M65.7 330.3L.107 362.385l127.292 62l127.64-62.194l-65.76-32.539l-61.928 30.754z"/><path fill="url(#SVGZVLNw9hg)" d="M57.602 98.175v-.02l69.93-34.107l69.934 34.106L255.004 62.2L127.484 0L0 62.18v.055l57.554 35.964z"/><path fill="url(#SVGHREXXgVz)" d="m.156 298.428l62.915-30.803l64.714 32.042L.156 362.462z"/><path fill="url(#SVG6UmI6bDY)" d="M196.678 99.41v100.768l-70.342 34.424l64.686 32.339l62.979-30.797V62.19l-57.323 35.976z"/><path fill="url(#SVGBZa6xpUb)" d="m255.004 298.216l-197.415-98.25V98.182L0 62.23v173.702l255.004 126.321z"/></svg>How to use the Snap Svg icon
React
import { Icon } from "@iconify/react";
<Icon icon="logos:snap-svg" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="logos:snap-svg" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="logos:snap-svg" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--snap-svg]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:snap-svg"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="logos:snap-svg"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/logos/snap-svg.svg" alt="Snap Svg icon" width="24" height="24">Related icons in SVG Logos
Snap Svg icon FAQ
Is the Snap Svg icon free for commercial use?
Yes. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects.
How do I use the Snap Svg icon in React?
Install @iconify/react and render <Icon icon="logos:snap-svg" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Snap Svg icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/snap-svg.svg" alt="Snap Svg icon">, or paste the SVG code inline to style it with CSS.