Ícone Planet 16
fluent-color:planet-16
O ícone Planet 16 (fluent-color:planet-16) é um ícone SVG gratuito da coleção Fluent UI System Color Icons de Microsoft Corporation. Ele é desenhado em uma grade de 16 × 16. Fluent UI System Color Icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais. Copie como código SVG, JSX, Vue ou Svelte, ou baixe o arquivo SVG.
- Coleção
- Fluent UI System Color Icons
- Autor
- Microsoft Corporation
- Licença
- MIT
- Tamanho
- 16 × 16
Código SVG
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><g fill="none"><path fill="url(#SVGWdk9GE6U)" d="M14.725 6.053a3 3 0 0 0-1.157-.293C13.255 4.982 2.496 9.5 2.496 9.5l-.064.74a6.002 6.002 0 0 0 11.229-.246c.89-.066 1.766-.656 2.136-1.397c.203-.408.28-.894.11-1.376c-.172-.481-.603-.877-1.182-1.168"/><path fill="url(#SVGVuzGleKA)" d="M14.725 6.053a3 3 0 0 0-1.157-.293C13.255 4.982 2.496 9.5 2.496 9.5l-.064.74a6.002 6.002 0 0 0 11.229-.246c.89-.066 1.766-.656 2.136-1.397c.203-.408.28-.894.11-1.376c-.172-.481-.603-.877-1.182-1.168"/><path fill="url(#SVGJxZ2LeCd)" d="M14.725 6.053a3 3 0 0 0-1.157-.293C13.255 4.982 2.496 9.5 2.496 9.5l-.064.74a6.002 6.002 0 0 0 11.229-.246c.89-.066 1.766-.656 2.136-1.397c.203-.408.28-.894.11-1.376c-.172-.481-.603-.877-1.182-1.168"/><path fill="url(#SVGNtwyGduB)" d="M14.725 6.053a3 3 0 0 0-1.157-.293C13.255 4.982 2.496 9.5 2.496 9.5l-.064.74a6.002 6.002 0 0 0 11.229-.246c.89-.066 1.766-.656 2.136-1.397c.203-.408.28-.894.11-1.376c-.172-.481-.603-.877-1.182-1.168"/><path fill="url(#SVGSV4rteRq)" fill-opacity=".5" d="M14.725 6.053a3 3 0 0 0-1.157-.293C13.255 4.982 2.496 9.5 2.496 9.5l-.064.74a6.002 6.002 0 0 0 11.229-.246c.89-.066 1.766-.656 2.136-1.397c.203-.408.28-.894.11-1.376c-.172-.481-.603-.877-1.182-1.168"/><path fill="url(#SVGAcf0Ep3j)" d="M14.725 6.053a3 3 0 0 0-1.157-.293C13.255 4.982 2.496 9.5 2.496 9.5l-.064.74a6.002 6.002 0 0 0 11.229-.246c.89-.066 1.766-.656 2.136-1.397c.203-.408.28-.894.11-1.376c-.172-.481-.603-.877-1.182-1.168"/><path fill="url(#SVG9MxAObUH)" d="M1.275 9.947a3 3 0 0 0 1.157.293l.006.015v-.016c1.982 0 3.776-1.12 5.57-2.24c1.79-1.119 3.582-2.237 5.56-2.24a6.002 6.002 0 0 0-11.229.247c-.893.065-1.76.65-2.13 1.39c-.204.409-.282.895-.11 1.376c.17.482.597.884 1.176 1.175"/><path fill="url(#SVGJzJUHePp)" d="M1.275 9.947a3 3 0 0 0 1.157.293l.006.015v-.016c1.982 0 3.776-1.12 5.57-2.24c1.79-1.119 3.582-2.237 5.56-2.24a6.002 6.002 0 0 0-11.229.247c-.893.065-1.76.65-2.13 1.39c-.204.409-.282.895-.11 1.376c.17.482.597.884 1.176 1.175"/><path fill="url(#SVGoO1iaera)" d="M1.275 9.947a3 3 0 0 0 1.157.293l.006.015v-.016c1.982 0 3.776-1.12 5.57-2.24c1.79-1.119 3.582-2.237 5.56-2.24a6.002 6.002 0 0 0-11.229.247c-.893.065-1.76.65-2.13 1.39c-.204.409-.282.895-.11 1.376c.17.482.597.884 1.176 1.175"/><path fill="url(#SVGvEwzTbHi)" d="M1.275 9.947a3 3 0 0 0 1.157.293l.006.015v-.016c1.982 0 3.776-1.12 5.57-2.24c1.79-1.119 3.582-2.237 5.56-2.24a6.002 6.002 0 0 0-11.229.247c-.893.065-1.76.65-2.13 1.39c-.204.409-.282.895-.11 1.376c.17.482.597.884 1.176 1.175"/><defs><radialGradient id="SVGWdk9GE6U" cx="0" cy="0" r="1" gradientTransform="rotate(234.247 10.392 4.048)scale(12.7836 12.6431)" gradientUnits="userSpaceOnUse"><stop stop-color="#8f77ff"/><stop offset=".457" stop-color="#775be3"/><stop offset=".656" stop-color="#6552d9"/></radialGradient><radialGradient id="SVGVuzGleKA" cx="0" cy="0" r="1" gradientTransform="rotate(160.373 6.986 6.02)scale(2.77338 6.97917)" gradientUnits="userSpaceOnUse"><stop offset=".241" stop-color="#6e30c8"/><stop offset="1" stop-color="#6730c6" stop-opacity="0"/></radialGradient><radialGradient id="SVGJxZ2LeCd" cx="0" cy="0" r="1" gradientTransform="rotate(235.452 10.21 5.902)scale(5.75799 22.0297)" gradientUnits="userSpaceOnUse"><stop stop-color="#f36284"/><stop offset="1" stop-color="#f36284" stop-opacity="0"/></radialGradient><radialGradient id="SVGNtwyGduB" cx="0" cy="0" r="1" gradientTransform="matrix(-10.8163 0 0 -6.14584 16.567 5.67)" gradientUnits="userSpaceOnUse"><stop stop-color="#7d40c8"/><stop offset="1" stop-color="#7f45d2" stop-opacity="0"/></radialGradient><radialGradient id="SVGSV4rteRq" cx="0" cy="0" r="1" gradientTransform="rotate(55.772 -8.16 15.466)scale(12.0607 36.4974)" gradientUnits="userSpaceOnUse"><stop offset=".265" stop-color="#0a26b5" stop-opacity="0"/><stop offset=".581" stop-color="#051d92"/></radialGradient><radialGradient id="SVGAcf0Ep3j" cx="0" cy="0" r="1" gradientTransform="rotate(175.701 7.946 5.506)scale(2.82427 7.67648)" gradientUnits="userSpaceOnUse"><stop offset=".195" stop-color="#e173e7"/><stop offset=".901" stop-color="#e173e7" stop-opacity="0"/></radialGradient><radialGradient id="SVG9MxAObUH" cx="0" cy="0" r="1" gradientTransform="rotate(36.679 -1.81 7.175)scale(12.5257 12.5357)" gradientUnits="userSpaceOnUse"><stop stop-color="#3dd3dc"/><stop offset="1" stop-color="#4290f0"/></radialGradient><radialGradient id="SVGJzJUHePp" cx="0" cy="0" r="1" gradientTransform="rotate(-52.489 6.693 3.295)scale(4.32092 10.493)" gradientUnits="userSpaceOnUse"><stop offset=".285" stop-color="#3a80e1"/><stop offset="1" stop-color="#488ae5" stop-opacity="0"/></radialGradient><radialGradient id="SVGoO1iaera" cx="0" cy="0" r="1" gradientTransform="matrix(2.0892 -.37617 1.1669 6.48077 .004 5.302)" gradientUnits="userSpaceOnUse"><stop offset=".232" stop-color="#3dd3dc"/><stop offset="1" stop-color="#3dd3dc" stop-opacity="0"/></radialGradient><radialGradient id="SVGvEwzTbHi" cx="0" cy="0" r="1" gradientTransform="rotate(68.24 .088 3.893)scale(8.40097 25.4305)" gradientUnits="userSpaceOnUse"><stop offset=".576" stop-color="#26cfdb" stop-opacity="0"/><stop offset="1" stop-color="#19d9e7"/></radialGradient></defs></g></svg>Como usar o ícone Planet 16
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-color:planet-16" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-color:planet-16" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-color:planet-16" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-color--planet-16]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-color -->
<div class="i-fluent-color:planet-16"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-color:planet-16"></iconify-icon>Imagem HTML
<img src="https://iconyz.com/api/public/svg/fluent-color/planet-16.svg" alt="Ícone Planet 16" width="24" height="24">Ícones relacionados em Fluent UI System Color Icons
Perguntas frequentes sobre Ícone Planet 16
O ícone Planet 16 é grátis para uso comercial?
Sim. Fluent UI System Color Icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais.
Como uso o ícone Planet 16 no React?
Instale @iconify/react e renderize <Icon icon="fluent-color:planet-16" />, ou use “Copiar código” nesta página para obter um componente React independente.
Como adiciono o ícone Planet 16 a uma página web?
Vincule o arquivo SVG em uma tag de imagem: <img src="https://iconyz.com/api/public/svg/fluent-color/planet-16.svg" alt="Ícone Planet 16">, ou cole o código SVG diretamente na página para estilizá-lo com CSS.