Instagram new logo css background

Question

Recently, Instagram logo has changed as you all know. I need vector logo but it is not possible, I mean gradients. Is there any css code for new logo?

Answer 1

Here is the css code for background color:

.instagram{ width:100px; height:100px;    background: #f09433;   background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);   background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);   background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );    }

<div class="instagram"></div>

Answer 2

Here's the code for the icon with the gradient background. Hope this helps. :)

#insta {    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);    -webkit-background-clip: text;            /* Also define standard property for compatibility */            background-clip: text;    -webkit-text-fill-color: transparent;        font-size: 200px; /* change this to change the size*/      }

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet" />  <i class="fa fa-instagram" id="insta" aria-hidden="true"></i>

I found 2 more great implementations of the font awesome icon here- https://codepen.io/monir/pen/wGZWvB (new logo) https://codepen.io/thomasrye/pen/VaRoYv (old logo)