Home/Libraries/Freehand free icons (Iconify)/performance-presentation-graph

Freehand free icons (Iconify)

PerformancePresentationGraph

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"><g fill="#818cf8" fill-rule="evenodd" clip-rule="evenodd"><path d="M22.585 13.223a6.8 6.8 0 0 0-2.297-.34c-1.099 0-2.237.13-3.206.16l-5.532.16c-1.807.07-3.664.15-5.501.29a47 47 0 0 0-3.665.429a.33.33 0 0 0-.28.379a.32.32 0 0 0 .37.28c1.178-.16 2.396-.26 3.624-.32c1.828-.08 3.685-.08 5.472-.09h5.532c.95 0 2.087-.11 3.166-.09c.64.003 1.277.104 1.887.3c.32.12.53.21.57.36s-.06.12-.12.189c-.416.39-.943.642-1.508.719q-.994.147-1.997.16h-3.156l-10.045.29c-.819 0-1.728.14-2.606.13a5.7 5.7 0 0 1-1.618-.2c-.45-.13-.739-.34-.819-.62a.9.9 0 0 1 .4-.888a.38.38 0 0 0 .05-.53a.37.37 0 0 0-.53 0a1.62 1.62 0 0 0-.749 1.678a1.83 1.83 0 0 0 1.338 1.198a7 7 0 0 0 1.838.28c.898 0 1.827-.05 2.656-.06h5.162c-.07.43-.15.859-.21 1.288c-.489.3-.998.59-1.477.909c-.26.17-.51.35-.76.539c-.249.19-.488.39-.708.599a19 19 0 0 0-1.478 1.638a.33.33 0 0 0 0 .469a.32.32 0 0 0 .46 0c.579-.41 1.188-.769 1.787-1.178a17 17 0 0 0 1.428-1.139c.23-.2.45-.42.669-.629v.62c0 .688.08 1.357.13 1.996a.38.38 0 1 0 .748 0c.09-.669.22-1.318.31-1.997l.06-.639c.23.27.45.55.689.82l.51.528c.179.18.369.34.558.5c.46.37.939.679 1.408.998a.32.32 0 0 0 .46 0a.31.31 0 0 0 0-.46c-.34-.498-.66-.998-.999-1.457c-.18-.19-.35-.37-.53-.54a9 9 0 0 0-.578-.489c-.48-.369-.999-.689-1.448-.998a14 14 0 0 0-.16-1.458h7.23a16 16 0 0 0 2.176-.18a3.49 3.49 0 0 0 2.607-1.667c.25-.6.09-1.418-1.319-1.937M7.816 8.979l1.997 1.418a.35.35 0 0 0 .4 0a.37.37 0 0 0 .07.2a.39.39 0 0 0 .539 0a3.523 3.523 0 0 0 .439-4.993a3.994 3.994 0 0 0-5.053-1.328A4.4 4.4 0 0 0 4.022 7.15a3.72 3.72 0 0 0 .878 3.455a3.5 3.5 0 0 0 2.107.999a4.8 4.8 0 0 0 2.197-.29a.34.34 0 0 0 .21-.42a.33.33 0 0 0-.4-.229a4.1 4.1 0 0 1-1.867.12a2.6 2.6 0 0 1-1.498-.809a2.3 2.3 0 0 1-.52-1.398h1c1.887-.14 1.208.02 1.687.4m2.566.998a.36.36 0 0 0-.1-.18L8.555 7.98a6 6 0 0 0-.5-.5h-.07q.17-.3.3-.618q.116-.249.2-.51q.08-.266.13-.539v-.649a3.27 3.27 0 0 1 1.797 1.099a2.676 2.676 0 0 1-.03 3.714M5.22 7.591a1 1 0 0 1 0-.14a3.2 3.2 0 0 1 1.538-1.997c.26-.14.545-.23.838-.27c-.06.11-.12.22-.17.33a5 5 0 0 0-.299.998a7 7 0 0 0-.09.79a5 5 0 0 0-.669 0q-.582.11-1.148.289m9.496-1.099c-.2 0-.4 0-.53 1.858a4.5 4.5 0 0 0 0 .639q.013.326.07.649c.24 1.707.37 1.877.69 1.857s.37-.21.489-1.907a4.5 4.5 0 0 0 0-.64a5 5 0 0 0-.06-.638c-.25-1.848-.47-1.828-.66-1.818m2.997-2.766a.32.32 0 0 0-.34.32c-.12.829-.28 1.637-.37 2.476c0 .36-.06.72-.07 1.079c-.01.36 0 .719 0 1.078c0 .849.14 1.678.25 2.516a.39.39 0 0 0 .4.36a.37.37 0 0 0 .35-.4c0-.848.139-1.677.199-2.536c0-.559.07-1.128.07-1.687c0-.999-.12-1.918-.18-2.866a.34.34 0 0 0-.31-.34"/><path d="M1.096 13.602a.32.32 0 0 0 .31.34a.32.32 0 0 0 .339-.32c.15-1.478.31-2.996.34-4.434V6.542c0-1.328-.14-2.636-.16-3.994a.38.38 0 0 0-.75 0a51 51 0 0 0-.309 3.884v3.316c.06 1.288.16 2.566.23 3.854M2.234 2.278c.48.06.999.09 1.458.12c1.108 0 2.217 0 3.345.07c1.997.09 3.994.18 5.991.19c1.348 0 2.686 0 3.995-.06l3.764.05c.17 0 .999-.14.869.06c.103.244.16.504.17.769v6.89c0 .739 0 1.467.06 2.196a.37.37 0 0 0 .399.36a.36.36 0 0 0 .35-.38v-2.166c.06-1.698.16-3.405.19-5.093q.15-1.093.169-2.197a2.3 2.3 0 0 0-.4-1.098a1 1 0 0 0-.499-.37a4.7 4.7 0 0 0-1.188-.16c-.759 0-1.538-.08-2.307-.1h-1.557l-10.026.2c-1.118 0-2.227.1-3.335.11c-.47 0-.939 0-1.408-.05a.33.33 0 0 0-.37.29a.34.34 0 0 0 .33.37"/></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. PerformancePresentationGraphIcon.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.