Home/Libraries/Freehand free icons (Iconify)/programming-flowchart

Freehand free icons (Iconify)

ProgrammingFlowchart

License: CC-BY-4.0

ICON SIZE

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 24 24"><path fill="#818cf8" fill-rule="evenodd" d="M9.255 13.29a23 23 0 0 0 2.442-1.572a.36.36 0 0 0-.15-.48c-.59-.38-1.15-.78-1.751-1.16l-.75-.461c-.271-.15-.521-.29-.791-.41c-.6-.29-1.201-.521-1.792-.781c0-.12.09-.23.13-.36s0-.18 0-.26v-.14c.692-.01 1.381-.1 2.052-.271a4 4 0 0 0 1.781-1a2.53 2.53 0 0 0 .84-2.082a2.67 2.67 0 0 0-1.1-1.902a4.4 4.4 0 0 0-1.481-.71a6 6 0 0 0-1.591-.19a.36.36 0 0 0-.36.36a.37.37 0 0 0 .36.36c.463.013.921.093 1.36.24c.422.136.815.346 1.162.62a1.8 1.8 0 0 1 .68 1.282a1.6 1.6 0 0 1-.6 1.24c-.393.331-.86.561-1.361.671a9.8 9.8 0 0 1-2.532.2q-.603.015-1.201-.06a7 7 0 0 1-1.161-.22a2.4 2.4 0 0 1-1.361-.86a1.33 1.33 0 0 1-.1-1.422l.33-.58a4.3 4.3 0 0 1 1.671-.97a8 8 0 0 1 2.002-.391a.32.32 0 0 0 0-.64a8.5 8.5 0 0 0-2.672.4a4.6 4.6 0 0 0-1.652.92q-.141.151-.26.32q-.165.229-.29.481a2.33 2.33 0 0 0 .08 2.522a3.55 3.55 0 0 0 2.002 1.391q.66.193 1.34.28a6 6 0 0 1 .941.05v.11q-.015.13 0 .26q.053.229.15.44c-.58.171-1.16.331-1.73.561c-.281.12-.571.26-.851.4s-.54.3-.801.471c-.63.38-1.211.79-1.831 1.19a6 6 0 0 0-.4.601a.33.33 0 0 0 .23.39q.296.127.56.31c.47.321.89.732 1.34 1.002q.696.378 1.432.67q.959.343 1.951.57c0 .18-.12.351-.16.541q-.022.165 0 .33a2 2 0 0 0 0 .34q.066.334.18.651H1.54a.32.32 0 0 0-.33.3a.34.34 0 0 0 .09.22c-.24.551-.46 1.091-.66 1.662q-.208.625-.34 1.27c0 .201-.2.831-.25 1.252c-.018.185.003.373.06.55a1.25 1.25 0 0 0 .84.62a9.6 9.6 0 0 0 2.402.24a47 47 0 0 0 6.635-.66c.49-.08-.1 0 .77-2.381a20 20 0 0 0 .26-.831q.11-.395.16-.8a1.6 1.6 0 0 0-.13-.731a.78.78 0 0 0-.43-.41a2.2 2.2 0 0 0-.7-.12l-1.421-.17h-.87l-1.302.05c0-.211.11-.411.15-.631q.015-.17 0-.34q.015-.176 0-.35a4 4 0 0 0-.2-.521l1.551-.63c.51-.321.981-.551 1.431-.841m-.85 4.443l1.47.11q.135.009.271 0v.15a4 4 0 0 1-.07.54a9 9 0 0 1-.22 1.001c-.15.53-.33 1.051-.47 1.572a.23.23 0 0 0 0 .14c-.731 0-1.932.09-3.243.11H3.9c-.73 0-1.601 0-2.171-.09h-.621c-.33 0 .08-1.001.1-1.241q.08-.694.25-1.371c.12-.47.25-.931.4-1.381a.3.3 0 0 0 0-.1l3.834.42zM6.203 13.93l-.22.14L2.68 12.4c-.51-.2-1-.49-1.53-.69a1.4 1.4 0 0 0-.171-.06c.6-.23 1.2-.461 1.781-.721l.851-.4c.27-.14.54-.28.8-.44c.571-.351 1.121-.731 1.712-1.102c.52.41 1 .83 1.551 1.201q.374.255.77.47c.27.15.541.28.811.4c.27.121.7.291 1.001.431c-.55.24-1.1.47-1.641.76s-.9.541-1.351.801s-.68.61-1.061.881" clip-rule="evenodd"/><path fill="#818cf8" fill-rule="evenodd" d="M1.059 21.176c0 .05 0 .07.06.09s-.03-.13-.06-.09" clip-rule="evenodd"/><path fill="#818cf8" d="M19.393 7.435v-.82l-.13-.931a2.26 2.26 0 0 0-1.07-1.471a5.4 5.4 0 0 0-2.383-.34c-.9 0-1.801.11-2.712.13h-1.14a.33.33 0 0 0-.36.27a.32.32 0 0 0 .27.36q.783.165 1.58.24c.781.09 1.562.13 2.332.21a4.6 4.6 0 0 1 1.852.21c.305.16.535.433.64.761l.18.66c0 .23 0 .47.05.711v.12c-.1.24.731.29.841 0c.04-.06.04-.09.05-.11m-1.401 8.407q-.039.58-.15 1.15a4.3 4.3 0 0 1-.19.701a1.25 1.25 0 0 1-.65.79a3.05 3.05 0 0 1-1.232.3c-.93.1-1.871.12-2.802.211a10 10 0 0 0-1.23.16a.34.34 0 0 0-.28.36a.32.32 0 0 0 .36.27h1.17c.951 0 1.892.15 2.832.17a3.7 3.7 0 0 0 2.082-.59c.44-.343.747-.827.87-1.37q.127-.544.16-1.102q.03-.525 0-1.05v-.851a.431.431 0 0 0-.85-.08zm6.005-5.254c-.16-2.352-.67-2.182-.71-2.182h-.07a29 29 0 0 0-3.323-.4h-2.342c-.7 0-1.371.07-2.002.14q-.715.08-1.41.26a6 6 0 0 0-.781 1.851a5 5 0 0 0-.08.7a6 6 0 0 0 0 .701c.07.546.208 1.08.41 1.592a.38.38 0 0 0 .44.27a.35.35 0 0 0 .22-.19a.29.29 0 0 0 .22.28q.692.213 1.412.29c.65.09 2.792.17 3.202.21h1a26 26 0 0 0 3.313-.28c.23 0 .27.17.45-2.162q.068-.539.05-1.08m-4.314 2.401h-1.64c-.771 0-1.572.15-2.363.15a6 6 0 0 1-1-.06a.3.3 0 0 0-.34.18v-.09a6 6 0 0 1 0-.83c0-.28.05-.55.07-.83s0-.551 0-.821V9.106h.72c.78 0 1.551.13 2.362.19h5.374c0 .4-.1.791-.13 1.192v1.39c0 .47.11.931.17 1.392c-1.02-.14-2.112-.28-3.223-.28"/></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. ProgrammingFlowchartIcon.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-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.