Home/Libraries/OpenMoji (Iconify)/broccoli

OpenMoji (Iconify)

Broccoli

License: CC-BY-SA-4.0

ICON SIZE

STROKE WEIGHT1.5px

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 72 72"><defs><path id="SVGp0L0PdgF" d="M26.723 45.314q-.63.072-1.278.072c-6.125 0-11.096-4.942-11.096-11.038c0-3.656 1.787-6.894 4.537-8.905c.88-.643 1.445-1.612 1.711-2.67c1.734-6.897 8.008-12.002 15.473-12.002c7.579 0 13.936 5.274 15.545 12.341c.233 1.026.838 1.907 1.674 2.546c2.634 2.01 4.33 5.168 4.33 8.728c0 6.077-4.952 11-11.058 11q-.242 0-.48-.01"/><path id="SVGRzyUQcjj" d="M46.08 45.386s-.202 0-.548-.029h-.039m-18.317-.077c-.77.106-1.288.106-1.288.106"/></defs><path fill="#b1cc33" stroke="#818cf8" stroke-miterlimit="10" stroke-width="1.5" d="M46.98 45.39c-2.83.03-3.78 2.88-3.78 2.88s-.97 1.92-.97 4.81v5.73c0 1.09-.87 1.96-1.96 1.96h-7.61a1.95 1.95 0 0 1-1.96-1.96v-5.73c0-2.89-.97-4.81-.97-4.81s-.92-2.76-3.65-2.88c0 0 1.43-.11 1.1-.11c1.81-.24 5.05-1.05 6.4-3.74c0 0 0-2.31 2.31-2.31s2.5 2.31 2.5 2.31c1.55 3.1 5.58 3.7 7.1 3.82c-.09.01-.19.01-.29.03z"/><path fill="#5c9e31" d="M58.388 34.386c0 6.077-5.106 11-11.404 11c-.048 0-.087 0-.135-.01c-.23.01-.471 0-.692-.019a4.5 4.5 0 0 0-.625 0h-.039c-1.24-.096-4.173-.519-6.048-2.365c0 0 9.651-16.11 9.805-15.642s-32.045 4.075-13.266-1.031c7.769-2.115 9.913-4.74 9.48-7.23L36.07 10.77c.24 0 .471.01.702.02c7.548.259 13.808 5.441 15.433 12.326c.23 1.02.856 1.904 1.721 2.539c2.721 2.009 4.462 5.172 4.462 8.73"/><path fill="#5c9e31" d="M39.445 42.992s-.779-.885-1.058-1.452c0 0-.192-2.308-2.5-2.308S33.58 41.54 33.58 41.54c-1.346 2.692-4.587 3.5-6.404 3.74c-.212 0-.423.01-.644.03c-.404.047-.818.076-1.231.076c-.144 0-.288-.01-.423-.01c-6.164-.163-11.106-5.038-11.106-11.028c0-3.654 1.846-6.895 4.683-8.904c.904-.644 1.48-1.616 1.76-2.673c1.509-5.818 6.355-10.366 12.451-11.635a13 13 0 0 1 1.375-.23c.231-.03.462-.058.702-.078c.433-.038-4.836-.057 1.327-.057c8.303 0 17.18 13.379-.086 15.548C55.65 17.75 62.85 45.75 39.445 42.992"/><path fill="#b1cc33" d="M30.81 46.742a8 8 0 0 0 1.818 1.462a8 8 0 0 1-1.885-1.462c-.682-.721-1.596-1.173-2.567-1.356h.144c.942.183 1.827.635 2.49 1.356m14.395-1.356c-1.029.125-1.98.567-2.692 1.317a8 8 0 0 1-5.587 2.52a7.7 7.7 0 0 0 5.298-2.52c.692-.75 1.616-1.192 2.606-1.317z"/><path fill="#5c9e31" stroke="#818cf8" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="1.5" d="M46.984 45.386c-2.837.039-3.789 2.885-3.789 2.885s-.961 1.923-.961 4.808v5.73a1.96 1.96 0 0 1-1.962 1.962c0-9.25 1.79-16.209 1.79-16.209c.626 2.032 4.922.824 4.922.824z"/><g fill="none" stroke="#818cf8" stroke-miterlimit="10" stroke-width="1.5"><use href="#SVGp0L0PdgF"/><use href="#SVGp0L0PdgF"/><use href="#SVGRzyUQcjj" stroke-linecap="round" stroke-linejoin="round"/><path stroke-linecap="round" stroke-linejoin="round" d="M25.888 45.386s5.769 0 7.692-3.846"/><path stroke-linecap="round" d="M43.195 48.27s-.961 1.924-.961 4.808v5.73a1.963 1.963 0 0 1-1.963 1.963h-7.613a1.963 1.963 0 0 1-1.963-1.963v-5.73c0-2.884-.961-4.807-.961-4.807"/><path stroke-linecap="round" stroke-linejoin="round" d="M46.08 45.386s-5.77 0-7.692-3.846"/><use href="#SVGp0L0PdgF"/><use href="#SVGRzyUQcjj" stroke-linecap="round" stroke-linejoin="round"/></g></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. BroccoliIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-SA-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.