Info Circle Svg Code - Circle Information

The SVG info circle icon is a common graphical element that represents information, help, or guidance. It usually consists of a circle with the letter “i” inside it. In this tutorial, we will explain how to use the info circle icon and show some examples of how to create it using SVG code.

Get Free Info circle Icon SVG code vector files and use them in websites, apps (Android/IOS), ppt, and other useful projects. Customize & Download the Info circle Icon SVG file (HMTL/CSS) in different colors and sizes. Info circle SVG icon white, black, red, green, blue, transparent, and other colors.

Info circle Icon Svg Code | Path | Download

Download free Info Circle SVG icons in different sizes (16*16, 24*24, 32*32, 64*64 & Other). Check and download the Info Circle Icon SVG code in HTML/Css from below.

Info Circle


Info circle SVG Icon Code | Customize color

You can get svg icon info circle in blue, white, red color and transparent color from below list. You can also customize color using color picker.

Info circle

Download

Svg Code

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16"> <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/> <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/> </svg>

Info circle

Download

Svg Code

<svg style='color: white' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16"> <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/> <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/> </svg>

Info circle

Download

Svg Code

<svg style='color: red' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16"> <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/> <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/> </svg>

Info circle

Download

Svg Code

<svg style='color: blue' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16"> <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/> <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/> </svg>

Info circle

Download

Svg Code

<svg style='color: #f3da35' xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16"> <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/> <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/> </svg>


Advance Editor

You can edit info circle as below. Change size color and background color of icon using below tool.

fontawesomeicons.com
Size
Stroke

Size
Stroke
tab 2 content
Tab 3 content



Tags

message,data,knowledge,news,info,information,details,about,report,title,description



Advertisements



Info Circle Icon SVG - Faq(s)?

⭐Can I get Free Info Circle Icon SVG?

Yes, you can get free Info Circle SVG icons.

⭐ How to download free Info Circle Icon SVG code?

To download free Info Circle icons in SVG code click on the copy code button.

⭐How to find the Info Circle Icon SVG path file?

You can get the Info Circle SVG file path from the above section.

⭐ What are the colors available for SVG Info Circle Icon?

You can check the Info Circle SVG in your brand color i.e, White, Black, Blue, Red, Green, Pink & Yellow.



Advertisements

You may like these icons


Looking For More Icons?