Fa Brands Fa Instagram Icon HTML Code




Thanks for your feedback!
Your contributions will help us to improve service.
One of the prominent social media platforms today is Instagram, enabling users to share photos and videos with their followers. To add the icon to your website, you can utilize the Fa Brands Fa Instagram Icon, which is part of the Font Awesome Instagram (Version 6) collection. To use the Fa Brands Fa Instagram Icon, add the following line inside the <head>
section of your HTML page. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"/>
Then, you can place the icon anywhere with the <i> tag, like this:
Fa Brands Fa Instagram Icon HTML Code : Different Size
xxxxxxxxxx
<i class="fa-brands fa-instagram"></i>
<i class="fa-brands fa-instagram fa-2xs"></i>
<i class="fa-brands fa-instagram fa-xs"></i>
<i class="fa-brands fa-instagram fa-sm"></i>
<i class="fa-brands fa-instagram fa-lg"></i>
<i class="fa-brands fa-instagram fa-xl"></i>
<i class="fa-brands fa-instagram fa-2xl"></i>
This will display the Instagram icon in the solid style, suitable for small sizes. You can also customize the icon's size, color, and other properties using CSS.
Output of Fa Brands Fa Instagram Icon Code in HTML
Font Awesome Instagram (Version 6): Offical Color
xxxxxxxxxx
<style>
.instagram-icon {
font-size:50px;
background-clip: text;
background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
<div class="container">
<div class="card">
<i class="fa-brands fa-instagram instagram-icon"></i>
</div>
</div>
Output of Fa Brands Fa Facebook Icon Offical Color Code
How to Use the Font Awesome Instagram Icon (Version 6) in Your HTML/CSS Code?
In this example, you will learn how to add the Font Awesome Instagram icon (version 6) to your web page and how to change its color and size using CSS in fa-brands fa-instagram
. You will also see some examples of how the icon can be used to create a logo or a social media link
Font Awesome Fa Brands Fa Instagram Icon: Customize color and size
xxxxxxxxxx
<div class="container">
<p>Default Size: <i class="fa-brands fa-instagram" style="color: #316FF6"></i></p>
<p>Size 2xs: <i class="fa-brands fa-instagram fa-2xs" style="color:#ffd43b"></i></p>
<p>Size xs : <i class="fa-brands fa-instagram fa-xs" style="color:#ffd43b"></i></p>
<p>Size sm :<i class="fa-brands fa-instagram fa-sm" style="color:#63e6be"></i></p>
<p>Size lg : <i class="fa-brands fa-instagram fa-lg" style="color:#ffd43b"></i></p>
<p>Size xl : <i class="fa-brands fa-instagram fa-xl" style="color:#74c0fc"></i></p>
<p>Size 2xl : <i class="fa-brands fa-instagram fa-2xl" style="color:#b197fc"></i></p>
</div>
Output of Fa Brands Fa Instagram HTMl Code
Releated Tutorials
👉Font Aweomse Instagram Icon (Version 4)