Shape Organic icon
Used to represent organic shapes on canvas. The Shape Organic 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 Shape Organic 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 { ShapeOrganic24Regular, ShapeOrganic24Filled } from "@fluentui/react-icons";
export function Example() {
return <ShapeOrganic24Regular aria-label="Shape Organic" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_shape_organic_24_regular.svg" width="24" height="24" alt="Shape Organic"> 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="M16.8519 8.94568C16.5029 8.65876 16.0005 7.98364 16.0005 6.35C16.0005 5.27845 15.6592 4.43207 15.1201 3.78757C14.5922 3.15648 13.9081 2.75767 13.2699 2.50329C12.6298 2.24823 12.0004 2.12417 11.5384 2.06278C11.3054 2.03183 11.11 2.01618 10.9706 2.00824C10.8606 2.00198 10.7985 2.00015 10.7352 2L10.7339 2C8.46789 2 6.74536 2.62091 5.45547 3.59732C4.17381 4.56752 3.37083 5.84929 2.86811 7.09416C2.36606 8.33733 2.15281 9.56897 2.06329 10.4815C1.73488 13.8289 2.46488 17.7522 5.25136 19.9172C7.25986 21.4778 9.95578 22 12.7505 22C15.3258 22 17.6268 21.4251 19.304 20.1846C21.0111 18.922 22.0001 17.0202 22.0005 14.56C22.0005 12.2402 20.9125 10.8792 19.7938 10.1275C19.2493 9.76157 18.7096 9.54643 18.3081 9.42225C17.8273 9.27353 17.2524 9.27505 16.8519 8.94568ZM6.17168 18.7328C3.776 16.8714 3.27592 13.484 3.55612 10.6279C3.63676 9.80603 3.82713 8.72517 4.25897 7.65584C4.69013 6.58821 5.3513 5.55748 6.36081 4.7933C7.6224 3.8383 9.316 3.41648 10.8853 3.50582C10.9929 3.51194 11.1504 3.52442 11.3408 3.54972C11.7256 3.60083 12.2254 3.70177 12.7145 3.89671C13.2054 4.09233 13.6505 4.36852 13.9695 4.74993C14.2773 5.11793 14.5005 5.62155 14.5005 6.35C14.5005 8.31636 15.1231 9.46624 15.8992 10.1043C16.2738 10.4123 16.6516 10.5729 16.9408 10.6565C17.2446 10.7442 17.5618 10.7615 17.8648 10.8553C18.1665 10.9486 18.5642 11.1084 18.9572 11.3725C21.562 13.123 20.6369 17.3331 18.412 18.9787C17.0779 19.9654 15.1293 20.5 12.7505 20.5C10.1002 20.5 7.79906 19.9972 6.17168 18.7328Z" 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/shape_organic_24_regular.svg";Details
| Name | Shape Organic |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_shape_organic_24_regular.svg |
| Filled file | ic_fluent_shape_organic_24_filled.svg |
| React components | ShapeOrganic24Regular, ShapeOrganic24Filled |
| License | MIT (© Microsoft Corporation) |