Icono Flowbite
thesvg-color:flowbite
El icono Flowbite (thesvg-color:flowbite) es un icono SVG gratuito de la colección theSVG Color de thesvg.org. Está dibujado en una cuadrícula de 48 × 48. theSVG Color icons se publican bajo la licencia MIT, que permite usarlos en proyectos personales y comerciales. Cópialo como código SVG, JSX, Vue o Svelte, o descarga el archivo SVG.
- Colección
- theSVG Color
- Autor
- thesvg.org
- Licencia
- MIT
- Tamaño
- 48 × 48
Código SVG
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVGHWrqvbBt)" d="M36.78 19.414c-.112.766-.617 1.806-1.196 2.71a5.05 5.05 0 0 1-3.218 2.218l-5.846 1.223a4.5 4.5 0 0 0-2.432 1.403l-3.833 4.285c-.72.806-1.224.613-1.224-.467c-.009.04-1.903 4.925 3.116 7.82c1.929 1.112 4.705.712 6.633-.4l10.218-5.894a15.46 15.46 0 0 0 7.416-10.249q.05-.256.092-.513l-9.727-2.136Z"/><path fill="url(#SVGeO733bPV)" d="M34.13 13.527c1.928 1.112 2.716 2.768 2.716 4.993q-.001.453-.067.894l4.117 1.769l5.61.367c.719-4.158-.69-8.437-3.213-11.838a23.9 23.9 0 0 0-7.28-6.476a24.2 24.2 0 0 0-7.359-2.78l-2.8 3.625l-.884 4.163z"/><path fill="url(#SVGBVrleeUE)" d="M1.175 16.578q0 .005.003 0c.216-.647.487-1.37.825-2.143c1.767-4.034 5.171-6.724 9.36-8.096A15.5 15.5 0 0 1 23.94 7.65l1.03.595l3.684-7.79C16.936-1.885 4.96 5 1.19 16.533z"/><path fill="url(#SVGqSLjacXh)" d="M28.38 38.206a6.24 6.24 0 0 1-6.975-.505l-3.392 2.332l-2.923 4.724c3.245 2.7 7.458 3.568 11.668 3.085a23.9 23.9 0 0 0 9.254-3.062a24.1 24.1 0 0 0 6.09-4.976L40.36 35.57l-2.82-2.647z"/><path fill="url(#SVGsIujAdhN)" d="M21.405 37.701a6.22 6.22 0 0 1-2.374-4.888V16.61c0-.906.266-1.06 1.051-.607c-1.209-.697-4.002-3.091-7.45-1.102c-1.929 1.112-3.517 3.567-3.517 5.792V32.48c0 4.409 2.284 9.007 5.577 11.94c.13.117.265.226.398.338z"/><path fill="url(#SVGkaQTRA1q)" d="M41.866 7.969q-.005-.003-.003.002c.454.51.945 1.106 1.446 1.785a15.45 15.45 0 0 1 2.685 12.346a15.5 15.5 0 0 1-7.425 10.227l-1.03.593l4.563 6.882c7.888-8.968 7.908-22.77-.205-31.8z"/><path fill="url(#SVGobZHBd5K)" d="M9.515 20.692a6.23 6.23 0 0 1 3.925-5.782l-.325-4.1l-2.287-4.692a15.47 15.47 0 0 0-8.855 8.353A23.9 23.9 0 0 0 0 24.008c0 2.754.454 5.353 1.268 7.758l4.543.609l3.704-1.117z"/><path fill="url(#SVGpjgeicig)" d="M13.44 14.91a6.24 6.24 0 0 1 5.425.39l.166.095l13.343 7.697c.936.54.85 1.07-.207 1.292l.77-.161a5.05 5.05 0 0 0 2.645-1.484a6.13 6.13 0 0 0 1.664-4.22a6.23 6.23 0 0 0-3.117-5.392L23.912 7.234a15.5 15.5 0 0 0-12.593-1.292c-.166.054-.328.116-.491.176z"/><path fill="url(#SVG0VQeVbsu)" d="M28.983 47.479q.005-.003 0-.003c-.67.137-1.432.264-2.27.357A15.477 15.477 0 0 1 9.515 32.446v-1.188l-8.248.507c3.83 11.309 15.785 18.228 27.669 15.723c.005 0 .025-.005.046-.01Z"/><defs><linearGradient id="SVGHWrqvbBt" x1="30.09" x2="34.811" y1="35.655" y2="19.21" gradientUnits="userSpaceOnUse"><stop stop-color="#1724c9"/><stop offset="1" stop-color="#1c64f2"/></linearGradient><linearGradient id="SVGeO733bPV" x1="40.964" x2="28.545" y1="15.601" y2="3.225" gradientUnits="userSpaceOnUse"><stop stop-color="#1c64f2"/><stop offset="1" stop-color="#0092ff"/></linearGradient><linearGradient id="SVGBVrleeUE" x1="24.247" x2="5.511" y1="7.532" y2="8.716" gradientUnits="userSpaceOnUse"><stop stop-color="#0092ff"/><stop offset="1" stop-color="#45b2ff"/></linearGradient><linearGradient id="SVGqSLjacXh" x1="22.98" x2="39.805" y1="42.994" y2="38.454" gradientUnits="userSpaceOnUse"><stop stop-color="#1c64f2"/><stop offset="1" stop-color="#0092ff"/></linearGradient><linearGradient id="SVGsIujAdhN" x1="10.903" x2="22.849" y1="23.524" y2="35.902" gradientUnits="userSpaceOnUse"><stop stop-color="#1724c9"/><stop offset="1" stop-color="#1c64f2"/></linearGradient><linearGradient id="SVGkaQTRA1q" x1="38.176" x2="46.51" y1="32.453" y2="15.652" gradientUnits="userSpaceOnUse"><stop stop-color="#0092ff"/><stop offset="1" stop-color="#45b2ff"/></linearGradient><linearGradient id="SVGobZHBd5K" x1="8.046" x2="3.586" y1="13.696" y2="30.46" gradientUnits="userSpaceOnUse"><stop stop-color="#1c64f2"/><stop offset="1" stop-color="#0092ff"/></linearGradient><linearGradient id="SVGpjgeicig" x1="30.815" x2="14.517" y1="12.899" y2="16.957" gradientUnits="userSpaceOnUse"><stop stop-color="#1724c9"/><stop offset="1" stop-color="#1c64f2"/></linearGradient><linearGradient id="SVG0VQeVbsu" x1="9.61" x2="19.999" y1="32.035" y2="47.662" gradientUnits="userSpaceOnUse"><stop stop-color="#0092ff"/><stop offset="1" stop-color="#45b2ff"/></linearGradient></defs></g></svg>Cómo usar el icono Flowbite
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:flowbite" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:flowbite" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:flowbite" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--flowbite]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:flowbite"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:flowbite"></iconify-icon>Imagen HTML
<img src="https://iconyz.com/api/public/svg/thesvg-color/flowbite.svg" alt="Icono Flowbite" width="24" height="24">Preguntas frecuentes sobre Icono Flowbite
¿El icono Flowbite es gratis para uso comercial?
Sí. theSVG Color icons se publican bajo la licencia MIT, que permite usarlos en proyectos personales y comerciales.
¿Cómo uso el icono Flowbite en React?
Instala @iconify/react y renderiza <Icon icon="thesvg-color:flowbite" />, o usa «Copiar código» en esta página para obtener un componente de React independiente.
¿Cómo añado el icono Flowbite a una página web?
Enlaza el archivo SVG en una etiqueta de imagen: <img src="https://iconyz.com/api/public/svg/thesvg-color/flowbite.svg" alt="Icono Flowbite">, o pega el código SVG en línea para darle estilo con CSS.