The Phosphor clover icon depicts a four-leaf clover, commonly used in UIs to represent luck, nature, or Irish themes.
Common uses
- Representing a 'lucky' or 'chance' outcome.
- Illustrating nature or plant-related content.
- Theming for St. Patrick's Day or Irish cultural elements.
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { Clover } from '@phosphor-icons/react';
<Clover size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<Clover size={24} />thin
<Clover size={24} weight="thin" />light
<Clover size={24} weight="light" />bold
<Clover size={24} weight="bold" />fill
<Clover size={24} weight="fill" />duotone
<Clover size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- nature
- Keywords
- *new*four leaf cloverplantsluckluckyirishnaturecloverfour leafplant
FAQ
- What is the clover icon used for?
- It's typically used to symbolize luck, nature, or Irish heritage in user interfaces.
- How do I use the clover icon in React?
- You can import it directly from the library: import { Clover } from '@phosphor-icons/react'.
- What is the license for the Phosphor clover icon?
- The Phosphor icon library, including the clover icon, is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Phosphor.
Looking for something else? Search Phosphor and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →