ICONYZ
Español
Icono Drop Light de Phosphor

Icono Drop Light

ph:drop-light

El icono Drop Light (ph:drop-light) es un icono SVG gratuito de la colección Phosphor de Phosphor Icons. Está dibujado en una cuadrícula de 256 × 256. Phosphor 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
Phosphor
Autor
Phosphor Icons
Licencia
MIT
Tamaño
256 × 256
Etiquetas
droplet, teardrop, raindrop, raining, meteorology, water, blur, droplight
Descargar SVG

Código SVG

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><path fill="currentColor" d="M172.53 49.06a253 253 0 0 0-41.09-38a6 6 0 0 0-6.88 0a253 253 0 0 0-41.09 38C56.34 80.26 42 113.09 42 144a86 86 0 0 0 172 0c0-30.91-14.34-63.74-41.47-94.94M128 218a74.09 74.09 0 0 1-74-74c0-59.62 59-108.93 74-120.51c15 11.58 74 60.89 74 120.51a74.09 74.09 0 0 1-74 74m53.92-65A55.58 55.58 0 0 1 137 197.92a7 7 0 0 1-1 .08a6 6 0 0 1-1-11.92c17.38-2.92 32.13-17.68 35.08-35.08a6 6 0 1 1 11.84 2"/></svg>

Cómo usar el icono Drop Light

React

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

<Icon icon="ph:drop-light" width="24" />

Vue

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

<template>
  <Icon icon="ph:drop-light" width="24" />
</template>

Svelte

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

<Icon icon="ph:drop-light" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[ph--drop-light]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/ph -->
<div class="i-ph:drop-light"></div>

Web component

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

<iconify-icon icon="ph:drop-light"></iconify-icon>

Imagen HTML

<img src="https://iconyz.com/api/public/svg/ph/drop-light.svg" alt="Icono Drop Light" width="24" height="24">

Iconos relacionados en Phosphor

Icono drop
drop
 Icono drop-bold
drop-bold
 Icono drop-duotone
drop-duotone
 Icono drop-fill
drop-fill
 Icono drop-half
drop-half
 Icono drop-half-bold
drop-half-bold
 Icono drop-half-bottom
drop-half-bottom
 Icono drop-half-bottom-bold
drop-half-bottom-bold
 Icono drop-half-bottom-duotone
drop-half-bottom-duotone
 Icono drop-half-bottom-fill
drop-half-bottom-fill
 Icono drop-half-bottom-light
drop-half-bottom-light
 Icono drop-half-bottom-thin
drop-half-bottom-thin
 Icono drop-half-duotone
drop-half-duotone
 Icono drop-half-fill
drop-half-fill
 Icono drop-half-light
drop-half-light
 Icono drop-half-thin
drop-half-thin
 Icono drop-simple
drop-simple
 Icono drop-simple-bold
drop-simple-bold
 Icono drop-simple-duotone
drop-simple-duotone
 Icono drop-simple-fill
drop-simple-fill
 Icono drop-simple-light
drop-simple-light
 Icono drop-simple-thin
drop-simple-thin
 Icono drop-slash
drop-slash
 Icono drop-slash-bold
drop-slash-bold

El icono Drop Light en otras colecciones

Icono Drop Light de selfh.st/icons
selfh.st/icons

Preguntas frecuentes sobre Icono Drop Light

¿El icono Drop Light es gratis para uso comercial?

Sí. Phosphor icons se publican bajo la licencia MIT, que permite usarlos en proyectos personales y comerciales.

¿Cómo uso el icono Drop Light en React?

Instala @iconify/react y renderiza <Icon icon="ph:drop-light" />, o usa «Copiar código» en esta página para obtener un componente de React independiente.

¿Cómo añado el icono Drop Light a una página web?

Enlaza el archivo SVG en una etiqueta de imagen: <img src="https://iconyz.com/api/public/svg/ph/drop-light.svg" alt="Icono Drop Light">, o pega el código SVG en línea para darle estilo con CSS.

Ver todos los Iconos Phosphor →