Instagram icon
thesvg-color:instagram
The Instagram icon (thesvg-color:instagram) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 265 × 265 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
- 265 × 265
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="265" height="265" viewBox="0 0 265 265"><defs><radialGradient id="SVG8bDSUbTK" cx="158.429" cy="578.088" r="52.352" fx="158.429" fy="578.088" gradientTransform="matrix(0 -4.03418 4.28018 0 -2332.227 942.236)" gradientUnits="userSpaceOnUse" href="#SVGyEXqFe2C"/><radialGradient id="SVGHt3n4cxA" cx="172.615" cy="600.692" r="65" fx="172.615" fy="600.692" gradientTransform="rotate(-59.87 -448.718 683.191)scale(1.34356 1.74916)" gradientUnits="userSpaceOnUse" href="#SVGdDw0LeWO"/><radialGradient id="SVGHvxlGeKS" cx="144.012" cy="51.337" r="67.081" fx="144.012" fy="51.337" gradientTransform="matrix(-2.3989 .67549 -.23008 -.81732 464.996 -26.404)" gradientUnits="userSpaceOnUse" href="#SVGTCOYweHu"/><radialGradient id="SVG8E51ndLw" cx="199.788" cy="628.438" r="52.352" fx="199.788" fy="628.438" gradientTransform="rotate(164.25 577.79 780.16)scale(3.2292 2.32649)" gradientUnits="userSpaceOnUse" href="#SVGm1g5feOd"/><linearGradient id="SVGm1g5feOd"><stop offset="0" stop-color="#ff005f"/><stop offset="1" stop-color="#fc01d8"/></linearGradient><linearGradient id="SVGTCOYweHu"><stop offset="0" stop-color="#780cff"/><stop offset="1" stop-color="#820bff" stop-opacity="0"/></linearGradient><linearGradient id="SVGdDw0LeWO"><stop offset="0" stop-color="#fc0"/><stop offset="1" stop-color="#fc0" stop-opacity="0"/></linearGradient><linearGradient id="SVGyEXqFe2C"><stop offset="0" stop-color="#fc0"/><stop offset=".124" stop-color="#fc0"/><stop offset=".567" stop-color="#fe4a05"/><stop offset=".694" stop-color="#ff0f3f"/><stop offset="1" stop-color="#fe0657" stop-opacity="0"/></linearGradient></defs><path fill="url(#SVG8E51ndLw)" d="M204.15 18.143c-55.23 0-71.383.057-74.523.317c-11.334.943-18.387 2.728-26.07 6.554c-5.922 2.942-10.592 6.351-15.201 11.13c-8.394 8.716-13.481 19.439-15.323 32.184c-.895 6.188-1.156 7.45-1.209 39.056c-.02 10.536 0 24.4 0 42.999c0 55.2.062 71.341.326 74.476c.916 11.032 2.645 17.973 6.308 25.565c7 14.533 20.37 25.443 36.12 29.514c5.453 1.404 11.476 2.178 19.208 2.544c3.277.142 36.669.244 70.081.244s66.826-.04 70.02-.203c8.954-.422 14.153-1.12 19.901-2.606c15.852-4.09 28.977-14.838 36.12-29.575c3.591-7.409 5.412-14.614 6.236-25.07c.18-2.28.255-38.626.255-74.924c0-36.304-.082-72.583-.26-74.863c-.835-10.625-2.656-17.77-6.364-25.32c-3.042-6.182-6.42-10.799-11.324-15.519c-8.752-8.361-19.455-13.45-32.21-15.29c-6.18-.894-7.41-1.158-39.033-1.213z" transform="translate(-71.816 -18.143)"/><path fill="url(#SVG8bDSUbTK)" d="M204.15 18.143c-55.23 0-71.383.057-74.523.317c-11.334.943-18.387 2.728-26.07 6.554c-5.922 2.942-10.592 6.351-15.201 11.13c-8.394 8.716-13.481 19.439-15.323 32.184c-.895 6.188-1.156 7.45-1.209 39.056c-.02 10.536 0 24.4 0 42.999c0 55.2.062 71.341.326 74.476c.916 11.032 2.645 17.973 6.308 25.565c7 14.533 20.37 25.443 36.12 29.514c5.453 1.404 11.476 2.178 19.208 2.544c3.277.142 36.669.244 70.081.244s66.826-.04 70.02-.203c8.954-.422 14.153-1.12 19.901-2.606c15.852-4.09 28.977-14.838 36.12-29.575c3.591-7.409 5.412-14.614 6.236-25.07c.18-2.28.255-38.626.255-74.924c0-36.304-.082-72.583-.26-74.863c-.835-10.625-2.656-17.77-6.364-25.32c-3.042-6.182-6.42-10.799-11.324-15.519c-8.752-8.361-19.455-13.45-32.21-15.29c-6.18-.894-7.41-1.158-39.033-1.213z" transform="translate(-71.816 -18.143)"/><path fill="url(#SVGHt3n4cxA)" d="M204.15 18.143c-55.23 0-71.383.057-74.523.317c-11.334.943-18.387 2.728-26.07 6.554c-5.922 2.942-10.592 6.351-15.201 11.13c-8.394 8.716-13.481 19.439-15.323 32.184c-.895 6.188-1.156 7.45-1.209 39.056c-.02 10.536 0 24.4 0 42.999c0 55.2.062 71.341.326 74.476c.916 11.032 2.645 17.973 6.308 25.565c7 14.533 20.37 25.443 36.12 29.514c5.453 1.404 11.476 2.178 19.208 2.544c3.277.142 36.669.244 70.081.244s66.826-.04 70.02-.203c8.954-.422 14.153-1.12 19.901-2.606c15.852-4.09 28.977-14.838 36.12-29.575c3.591-7.409 5.412-14.614 6.236-25.07c.18-2.28.255-38.626.255-74.924c0-36.304-.082-72.583-.26-74.863c-.835-10.625-2.656-17.77-6.364-25.32c-3.042-6.182-6.42-10.799-11.324-15.519c-8.752-8.361-19.455-13.45-32.21-15.29c-6.18-.894-7.41-1.158-39.033-1.213z" transform="translate(-71.816 -18.143)"/><path fill="url(#SVGHvxlGeKS)" d="M204.15 18.143c-55.23 0-71.383.057-74.523.317c-11.334.943-18.387 2.728-26.07 6.554c-5.922 2.942-10.592 6.351-15.201 11.13c-8.394 8.716-13.481 19.439-15.323 32.184c-.895 6.188-1.156 7.45-1.209 39.056c-.02 10.536 0 24.4 0 42.999c0 55.2.062 71.341.326 74.476c.916 11.032 2.645 17.973 6.308 25.565c7 14.533 20.37 25.443 36.12 29.514c5.453 1.404 11.476 2.178 19.208 2.544c3.277.142 36.669.244 70.081.244s66.826-.04 70.02-.203c8.954-.422 14.153-1.12 19.901-2.606c15.852-4.09 28.977-14.838 36.12-29.575c3.591-7.409 5.412-14.614 6.236-25.07c.18-2.28.255-38.626.255-74.924c0-36.304-.082-72.583-.26-74.863c-.835-10.625-2.656-17.77-6.364-25.32c-3.042-6.182-6.42-10.799-11.324-15.519c-8.752-8.361-19.455-13.45-32.21-15.29c-6.18-.894-7.41-1.158-39.033-1.213z" transform="translate(-71.816 -18.143)"/><path fill="#fff" d="M132.345 33.973c-26.716 0-30.07.117-40.563.594c-10.472.48-17.62 2.136-23.876 4.567c-6.47 2.51-11.958 5.87-17.426 11.335c-5.472 5.464-8.834 10.948-11.354 17.412c-2.44 6.252-4.1 13.397-4.57 23.858c-.47 10.486-.593 13.838-.593 40.535s.119 30.037.594 40.522c.482 10.465 2.14 17.609 4.57 23.859c2.515 6.465 5.876 11.95 11.346 17.414c5.466 5.468 10.955 8.834 17.42 11.345c6.26 2.431 13.41 4.088 23.881 4.567c10.493.477 13.844.594 40.559.594c26.719 0 30.061-.117 40.555-.594c10.472-.48 17.63-2.136 23.888-4.567c6.468-2.51 11.948-5.877 17.414-11.345c5.472-5.464 8.834-10.949 11.354-17.412c2.419-6.252 4.079-13.398 4.57-23.858c.472-10.486.595-13.828.595-40.525s-.123-30.047-.594-40.533c-.492-10.465-2.152-17.608-4.57-23.858c-2.521-6.466-5.883-11.95-11.355-17.414c-5.472-5.468-10.944-8.827-17.42-11.335c-6.271-2.431-13.424-4.088-23.897-4.567c-10.493-.477-13.834-.594-40.558-.594zm-8.825 17.715c2.62-.004 5.542 0 8.825 0c26.266 0 29.38.094 39.752.565c9.591.438 14.797 2.04 18.264 3.385c4.591 1.782 7.864 3.912 11.305 7.352c3.443 3.44 5.575 6.717 7.362 11.305c1.346 3.46 2.951 8.663 3.388 18.247c.47 10.363.573 13.475.573 39.71c0 26.233-.102 29.346-.573 39.709c-.44 9.584-2.042 14.786-3.388 18.247c-1.783 4.587-3.919 7.854-7.362 11.292c-3.443 3.441-6.712 5.57-11.305 7.352c-3.463 1.352-8.673 2.95-18.264 3.388c-10.37.47-13.486.573-39.752.573c-26.268 0-29.38-.102-39.751-.573c-9.592-.443-14.797-2.044-18.267-3.39c-4.59-1.781-7.87-3.911-11.313-7.352c-3.443-3.44-5.574-6.709-7.362-11.298c-1.346-3.461-2.95-8.663-3.387-18.247c-.472-10.363-.566-13.476-.566-39.726s.094-29.347.566-39.71c.438-9.584 2.04-14.786 3.387-18.25c1.783-4.588 3.919-7.865 7.362-11.305c3.443-3.441 6.722-5.57 11.313-7.357c3.468-1.351 8.675-2.949 18.267-3.389c9.075-.41 12.592-.532 30.926-.553zm61.337 16.322c-6.518 0-11.805 5.277-11.805 11.792c0 6.512 5.287 11.796 11.805 11.796s11.804-5.284 11.804-11.796c0-6.513-5.287-11.796-11.805-11.796zm-52.512 13.782c-27.9 0-50.519 22.603-50.519 50.482s22.62 50.471 50.52 50.471s50.51-22.592 50.51-50.471s-22.613-50.482-50.513-50.482zm0 17.715c18.11 0 32.792 14.67 32.792 32.767c0 18.096-14.683 32.767-32.792 32.767s-32.791-14.671-32.791-32.767c0-18.098 14.68-32.767 32.791-32.767"/></svg>How to use the Instagram icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:instagram" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:instagram" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:instagram" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--instagram]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:instagram"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:instagram"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/instagram.svg" alt="Instagram icon" width="24" height="24">Instagram icon in other icon sets
Instagram icon FAQ
Is the Instagram 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 Instagram icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:instagram" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Instagram icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/instagram.svg" alt="Instagram icon">, or paste the SVG code inline to style it with CSS.