Ícone Clover
ph:clover
O ícone Clover (ph:clover) é um ícone SVG gratuito da coleção Phosphor de Phosphor Icons. Ele é desenhado em uma grade de 256 × 256. Phosphor 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
- Phosphor
- Autor
- Phosphor Icons
- Licença
- MIT
- Tamanho
- 256 × 256
- Tags
- four leaf clover, plants, luck, lucky, irish
Código SVG
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><path fill="currentColor" d="M211.66 165.54C225.16 159.7 232 144.37 232 120s-6.84-39.7-20.34-45.55c-11.65-5-27.24-2.23-46.46 8.35c10.58-19.22 13.39-34.81 8.35-46.46C167.7 22.84 152.37 16 128 16s-39.7 6.84-45.55 20.34c-5 11.65-2.23 27.24 8.35 46.45C71.58 72.22 56 69.4 44.34 74.45C30.84 80.3 24 95.63 24 120s6.84 39.7 20.34 45.54A31 31 0 0 0 56.8 168c9.6 0 21-3.62 34-10.79c-10.58 19.2-13.39 34.79-8.35 46.44C88.3 217.15 103.63 224 128 224s39.7-6.85 45.55-20.35a32.24 32.24 0 0 0 2.34-15c10.45 16.23 19.64 34.48 24.35 53.33A8 8 0 0 0 208 248a8 8 0 0 0 1.95-.24a8 8 0 0 0 5.82-9.7c-6.94-27.76-22.27-53.8-37.86-74.79Q189.68 168 199.2 168a31 31 0 0 0 12.46-2.46m-6.37-76.4C214.14 93 216 108 216 120s-1.86 27-10.7 30.86c-8.36 3.63-23.52-1.31-42.68-13.91a243 243 0 0 1-22.54-17c18.41-15.58 50.32-37.27 65.21-30.81M97.14 42.7C101 33.86 116 32 128 32s27 1.86 30.86 10.7c3.63 8.36-1.31 23.52-13.91 42.68a243 243 0 0 1-17 22.54C112.37 89.51 90.69 57.59 97.14 42.7M50.71 150.86C41.86 147 40 132 40 120s1.86-27 10.7-30.86A15.6 15.6 0 0 1 57 88c8.75 0 21.34 5.17 36.4 15.07a243 243 0 0 1 22.54 17c-18.43 15.55-50.35 37.25-65.23 30.79m108.15 46.43C155 206.14 140 208 128 208s-27-1.86-30.86-10.7c-3.63-8.36 1.31-23.52 13.91-42.68a243 243 0 0 1 17-22.54c15.58 18.41 37.26 50.33 30.81 65.21"/></svg>
Como usar o ícone Clover
React
import { Icon } from "@iconify/react";
<Icon icon="ph:clover" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="ph:clover" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="ph:clover" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[ph--clover]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/ph -->
<div class="i-ph:clover"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="ph:clover"></iconify-icon>
Imagem HTML
<img src="https://iconyz.com/api/public/svg/ph/clover.svg" alt="Ícone Clover" width="24" height="24">
Ícones relacionados em Phosphor
O ícone Clover em outras coleções
Perguntas frequentes sobre Ícone Clover
O ícone Clover é grátis para uso comercial?
Sim. Phosphor icons são publicados sob a licença MIT, que permite o uso em projetos pessoais e comerciais.
Como uso o ícone Clover no React?
Instale @iconify/react e renderize <Icon icon="ph:clover" />, ou use “Copiar código” nesta página para obter um componente React independente.
Como adiciono o ícone Clover a uma página web?
Vincule o arquivo SVG em uma tag de imagem: <img src="https://iconyz.com/api/public/svg/ph/clover.svg" alt="Ícone Clover">, ou cole o código SVG diretamente na página para estilizá-lo com CSS.
Ver todos os Ícones Phosphor →
ICONYZ
