Menu

Beta
Sign in
Beta
Bar Chart SVG icon, line

Bar Chart SVG icon, line

Three vertical bars rise to different heights above a baseline. Use this icon in analytics menus and quarterly reports.

Free · from Business icons, line · Set 2

Similar SVGs

More from Business icons, line · Set 2

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/4W6sOHsV47pR/amnt.svg" alt="Bar Chart" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="navy" data-name="Navy"><path d="M857 763c0-113 0-226 0-339 0-57 0-113 0-169 0-14 3-52-2-63-1-4-5-7-10-8-15-3-67 0-86 0-17 0-79-4-90 1-3 2-5 4-7 7-4 11-1 50-1 64 0 56 0 112 0 169 0 112 0 225 0 338-6 1-46 3-49 0-4-4-2-71-2-80 0-45 0-90 0-134 0-45 0-90 0-134 0-77 5-61-70-61-20 0-104-3-116 0-5 2-8 5-9 10-3 14 0 111 0 134 0 88 0 177 0 266h-51c0-59 0-119 0-178 0-14 3-63-2-73-2-3-5-5-9-6-15-3-68 0-87 0-18 0-76-3-88 0-3 1-7 4-8 6-5 10-2 60-2 74 0 58 0 117 0 175-13 5-46-5-50 11-6 23 26 18 40 18 39 0 79 0 119 0 79 0 158 0 238 0 79 0 158 0 238 0 39 0 79 0 119 0 11 0 46 3 34-20-6-12-37-5-49-8zM683 206h152v557h-152zM437 375h151v389c-50 0-101 0-151-1zM190 529h152v235c-21 0-142 3-152-1z" fill="#032252" stroke="#032252"/></g><g id="coral" data-name="Coral"><path d="M683 206v557h152v-557z" fill="#fc6962" stroke="#fc6962"/></g><g id="blue" data-name="Blue"><path d="M437 375v388c50 1 101 1 151 1v-389z" fill="#367ffb" stroke="#367ffb"/></g><g id="teal" data-name="Teal"><path d="M190 529v234c10 4 131 1 152 1v-235z" fill="#14b8a2" stroke="#14b8a2"/></g></svg>
CSS background-image
.bar-chart {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/4W6sOHsV47pR/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.bar-chart {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/4W6sOHsV47pR/amnt.svg") center / contain no-repeat;
}
React
import BarChartSvg from "./bar-chart.jsx"; // from the React tab above

<BarChartSvg width={48} height={48} />

Tags

barchartdatastatisticsbusinessiconline

Made with AMNT

AMNT Draw 1.2 drew this from the words Bar Chart: Three vertical bars of increasing height above a baseline. A flat colour icon. as part of the pack Business icons, line · Set 2. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings