Home/Libraries/Siemens Industrial Experience Icons (Iconify)/chart-value-horizontal

Siemens Industrial Experience Icons (Iconify)

ChartValueHorizontal

License: MITCommercial Safe

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 512 512"><path fill="#818cf8" fill-rule="evenodd" d="M405.333 106.667H106.667v298.666h298.666zM106.667 64H64v384h384V64zm107.021 65.667q18.52 0 27.416 13.125Q250 155.844 250 183.042q0 24.645-7.073 37.187q-9.115 16.115-29.239 16.115q-18.594 0-27.49-13.125q-8.823-13.198-8.823-40.761q0-24.208 7.073-36.75q9.114-16.041 29.24-16.041m0 14.583q-9.189 0-13.636 9.479q-4.448 9.406-4.448 28.875q0 20.052 4.156 29.094q4.667 10.062 13.928 10.062q9.187 0 13.635-9.479q4.448-9.552 4.448-29.239t-4.156-28.73q-4.594-10.062-13.927-10.062m57.166 90.927l1.386-15.167q7.364 1.896 12.031 1.896q15.166 0 23.26-11.812q5.834-8.386 7.073-20.49q-8.677 8.896-21.364 8.896q-14.51 0-22.678-9.99q-6.927-8.386-6.927-22.822q0-16.042 8.823-25.667q9.48-10.354 26.032-10.354q18.666 0 27.635 12.25q8.02 11.01 8.021 31.062q0 21.584-7.438 37.406q-12.176 25.959-42.146 25.959q-5.03 0-13.708-1.167m27.708-91.365q-7.656 0-12.25 5.615q-4.52 5.614-4.52 15.094q0 8.677 4.01 13.854q4.448 5.906 12.323 5.906q7.802 0 12.687-5.541q4.886-5.542 4.886-14.365q0-9.77-4.667-15.094q-4.812-5.469-12.469-5.469M263.627 388.36l-18.566-18.566l30.101-30.102h-78.24v-26.256h78.24l-30.101-30.102l18.566-18.566l61.796 61.796z" clip-rule="evenodd"/></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. ChartValueHorizontalIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **MIT** 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.