Plant Ragweed icon
Used to represent a type of allergen around ragweed. The Plant Ragweed icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Plant Ragweed icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { PlantRagweed24Regular, PlantRagweed24Filled } from "@fluentui/react-icons";
export function Example() {
return <PlantRagweed24Regular aria-label="Plant Ragweed" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_plant_ragweed_24_regular.svg" width="24" height="24" alt="Plant Ragweed"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 5C9 3.34315 10.3431 2 12 2C13.6569 2 15 3.34315 15 5C15 5.18441 14.9833 5.36512 14.9513 5.54063C16.1166 5.75308 17 6.77337 17 8C17 8.68136 16.7274 9.29906 16.2854 9.75C16.7274 10.2009 17 10.8186 17 11.5C17 12.8807 15.8807 14 14.5 14H12.75V18.6893L16.2197 15.2197C16.5126 14.9268 16.9874 14.9268 17.2803 15.2197C17.5732 15.5126 17.5732 15.9874 17.2803 16.2803L12.75 20.8107V22.25C12.75 22.6642 12.4142 23 12 23C11.5858 23 11.25 22.6642 11.25 22.25V20.8107L6.71967 16.2803C6.42678 15.9874 6.42678 15.5126 6.71967 15.2197C7.01256 14.9268 7.48744 14.9268 7.78033 15.2197L11.25 18.6893V14H9.5C8.11929 14 7 12.8807 7 11.5C7 10.8186 7.27258 10.2009 7.71464 9.75C7.27258 9.29906 7 8.68136 7 8C7 6.77337 7.88341 5.75308 9.04871 5.54063C9.01671 5.36512 9 5.18441 9 5ZM9.5 9C9.91421 9 10.25 9.33579 10.25 9.75C10.25 10.1642 9.91421 10.5 9.5 10.5C8.94772 10.5 8.5 10.9477 8.5 11.5C8.5 12.0523 8.94772 12.5 9.5 12.5H14.5C15.0523 12.5 15.5 12.0523 15.5 11.5C15.5 10.9477 15.0523 10.5 14.5 10.5C14.0858 10.5 13.75 10.1642 13.75 9.75C13.75 9.33579 14.0858 9 14.5 9C15.0523 9 15.5 8.55228 15.5 8C15.5 7.44772 15.0523 7 14.5 7H13.8711C13.5943 7 13.3399 6.84749 13.2095 6.60327C13.0791 6.35906 13.0939 6.06287 13.2479 5.83281C13.4071 5.59487 13.5 5.30942 13.5 5C13.5 4.17157 12.8284 3.5 12 3.5C11.1716 3.5 10.5 4.17157 10.5 5C10.5 5.30942 10.5929 5.59487 10.7521 5.83281C10.9061 6.06287 10.9209 6.35906 10.7905 6.60327C10.6601 6.84749 10.4057 7 10.1289 7H9.5C8.94772 7 8.5 7.44772 8.5 8C8.5 8.55228 8.94772 9 9.5 9Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/plant_ragweed_24_regular.svg";Details
| Name | Plant Ragweed |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_plant_ragweed_24_regular.svg |
| Filled file | ic_fluent_plant_ragweed_24_filled.svg |
| React components | PlantRagweed24Regular, PlantRagweed24Filled |
| License | MIT (© Microsoft Corporation) |