Microsoft Viva Insights icon

thesvg-color:microsoft-viva-insights

The Microsoft Viva Insights icon (thesvg-color:microsoft-viva-insights) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 512 × 512 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: 512 × 512
Tags: microsoftviva, vivainsights, microsoftvivainsights, insight

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><g fill="none"><circle cx="272.005" cy="144.001" r="144.001" fill="url(#SVGpmhbqbbL)"/><path fill="url(#SVGTQGWUhOX)" d="M128.032 146.781A105 105 0 0 0 104 144C46.563 144 0 190.563 0 248c0 28.719 11.64 54.719 30.461 73.532c18.82 18.844 44.82 30.469 73.539 30.469l2.18-.031c6.36-.125 12.578-.813 18.608-2.032a103.5 103.5 0 0 0 28.109-10.125c8.276-4.406 15.899-9.937 22.696-16.375l47.107-44.094c-54.42-19.844-93.508-71.562-94.668-132.563"/><path fill="url(#SVGD5UvzdBy)" d="M175.477 323.545C156.842 341.183 131.684 352 104 352c-30.1 0-57.212-12.786-76.203-33.224c6.446 7.659 96.074 103.867 145.514 156.787l.009-.013c20.479 22.399 49.938 36.45 82.678 36.45c33.428 0 63.436-14.654 83.957-37.87L481.99 321.092c18.555-18.778 30.009-44.608 30.009-73.092c0-57.437-46.563-104-104.001-104c-30.059 0-57.137 12.755-76.125 33.156l-81.205 76v.017l-75.076 70.279l.103.093z"/><defs><linearGradient id="SVGpmhbqbbL" x1="133.99" x2="334.982" y1="-15.006" y2="297.51" gradientUnits="userSpaceOnUse"><stop offset=".176" stop-color="#98bef5"/><stop offset=".944" stop-color="#3f6fd1"/></linearGradient><linearGradient id="SVGTQGWUhOX" x1="6.306" x2="160.121" y1="123.579" y2="345.834" gradientUnits="userSpaceOnUse"><stop offset=".195" stop-color="#4a6dc4"/><stop offset=".999" stop-color="#16296f"/></linearGradient><linearGradient id="SVGD5UvzdBy" x1="425.026" x2="292.769" y1="462.33" y2="141.615" gradientUnits="userSpaceOnUse"><stop stop-color="#283b73"/><stop offset="1" stop-color="#436dcd"/></linearGradient></defs></g></svg>

How to use the Microsoft Viva Insights icon

React

import { Icon } from "@iconify/react";

<Icon icon="thesvg-color:microsoft-viva-insights" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="thesvg-color:microsoft-viva-insights" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="thesvg-color:microsoft-viva-insights" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--microsoft-viva-insights]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:microsoft-viva-insights"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="thesvg-color:microsoft-viva-insights"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/thesvg-color/microsoft-viva-insights.svg" alt="Microsoft Viva Insights icon" width="24" height="24">

Related icons in theSVG Color

Microsoft Viva Insights icon FAQ

Is the Microsoft Viva Insights 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 Microsoft Viva Insights icon in React?

Install @iconify/react and render <Icon icon="thesvg-color:microsoft-viva-insights" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Microsoft Viva Insights icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/microsoft-viva-insights.svg" alt="Microsoft Viva Insights icon">, or paste the SVG code inline to style it with CSS.

Browse all theSVG Color icons →