bar chart emoji
bar-chart from Noto Emoji by Google Inc · Default · Objects · Apache-2.0 Free for personal and commercial use.
- Name
- bar-chart
- Set
- Noto Emoji
- Style
- Default
- Category
- Objects
- Viewbox
- 128×128
- License
- Apache 2.0
The same emoji in other sets
bar-chart-outlinedAnt Design Iconsbar-chartBootstrap Iconsbar-chartBoxIcons v2bar-chartEmoji One (Colored)bar-chart-fillEva Iconsbar-chartFont Awesome Regularbar-chartFont Awesome Solidbar-chartFeather Iconsbar-chartFluent Emojibar-chartFluent Emoji Flatbar-chartFluent Emoji High Contrastbar-chartHuge Iconsbar-chartHumbleiconsbar-chartIonIconsbar-chartJam Iconsbar-chartMaterial Symbolsbar-chartMaterial Symbols Lightbar-chartOpenMojibar-chartRadix Iconsbar-chart-fillRemix Iconbar-chartStreamline Emojisbar-chart-outlineTeenyiconsbar-chartTwitter Emoji
More objects icons from Noto Emoji
Use the bar chart emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#fff" d="M4 4h120v120H4z"/><path fill="none" stroke="#b0bec5" stroke-miterlimit="10" stroke-width="2" d="M124 24.35H5.57M124 43.67H5.47M124 62.99H5.36M124 82.31H5.26M124 101.64H5.15"/><path fill="#9ccc65" d="M38.72 121.91H21.89V55.38c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46z"/><path fill="#f44336" d="M72.42 121.91H55.58V74.84c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46v47.07z"/><path fill="#0091ea" d="M103.64 121.91H91.73c-1.36 0-2.46-1.1-2.46-2.46V25.86c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46v93.59c0 1.36-1.1 2.46-2.46 2.46"/><path fill="#b0bec5" d="M124 120H8V4H4v120h120z"/><path fill="#b0bec5" d="M122 6v116H6V6zm2-2H4v120h120z"/></svg>
React
import type { SVGProps } from "react";
export function NotoBarChart(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#fff" d="M4 4h120v120H4z"/><path fill="none" stroke="#b0bec5" strokeMiterlimit="10" strokeWidth="2" d="M124 24.35H5.57M124 43.67H5.47M124 62.99H5.36M124 82.31H5.26M124 101.64H5.15"/><path fill="#9ccc65" d="M38.72 121.91H21.89V55.38c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46z"/><path fill="#f44336" d="M72.42 121.91H55.58V74.84c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46v47.07z"/><path fill="#0091ea" d="M103.64 121.91H91.73c-1.36 0-2.46-1.1-2.46-2.46V25.86c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46v93.59c0 1.36-1.1 2.46-2.46 2.46"/><path fill="#b0bec5" d="M124 120H8V4H4v120h120z"/><path fill="#b0bec5" d="M122 6v116H6V6zm2-2H4v120h120z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#fff" d="M4 4h120v120H4z"/><path fill="none" stroke="#b0bec5" stroke-miterlimit="10" stroke-width="2" d="M124 24.35H5.57M124 43.67H5.47M124 62.99H5.36M124 82.31H5.26M124 101.64H5.15"/><path fill="#9ccc65" d="M38.72 121.91H21.89V55.38c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46z"/><path fill="#f44336" d="M72.42 121.91H55.58V74.84c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46v47.07z"/><path fill="#0091ea" d="M103.64 121.91H91.73c-1.36 0-2.46-1.1-2.46-2.46V25.86c0-1.36 1.1-2.46 2.46-2.46h11.91c1.36 0 2.46 1.1 2.46 2.46v93.59c0 1.36-1.1 2.46-2.46 2.46"/><path fill="#b0bec5" d="M124 120H8V4H4v120h120z"/><path fill="#b0bec5" d="M122 6v116H6V6zm2-2H4v120h120z"/></svg> </template>
CSS
.icon-bar-chart {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20128%20128%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M4%204h120v120H4z%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23b0bec5%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%20d%3D%22M124%2024.35H5.57M124%2043.67H5.47M124%2062.99H5.36M124%2082.31H5.26M124%20101.64H5.15%22%2F%3E%3Cpath%20fill%3D%22%239ccc65%22%20d%3D%22M38.72%20121.91H21.89V55.38c0-1.36%201.1-2.46%202.46-2.46h11.91c1.36%200%202.46%201.1%202.46%202.46z%22%2F%3E%3Cpath%20fill%3D%22%23f44336%22%20d%3D%22M72.42%20121.91H55.58V74.84c0-1.36%201.1-2.46%202.46-2.46h11.91c1.36%200%202.46%201.1%202.46%202.46v47.07z%22%2F%3E%3Cpath%20fill%3D%22%230091ea%22%20d%3D%22M103.64%20121.91H91.73c-1.36%200-2.46-1.1-2.46-2.46V25.86c0-1.36%201.1-2.46%202.46-2.46h11.91c1.36%200%202.46%201.1%202.46%202.46v93.59c0%201.36-1.1%202.46-2.46%202.46%22%2F%3E%3Cpath%20fill%3D%22%23b0bec5%22%20d%3D%22M124%20120H8V4H4v120h120z%22%2F%3E%3Cpath%20fill%3D%22%23b0bec5%22%20d%3D%22M122%206v116H6V6zm2-2H4v120h120z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20128%20128%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M4%204h120v120H4z%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23b0bec5%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%20d%3D%22M124%2024.35H5.57M124%2043.67H5.47M124%2062.99H5.36M124%2082.31H5.26M124%20101.64H5.15%22%2F%3E%3Cpath%20fill%3D%22%239ccc65%22%20d%3D%22M38.72%20121.91H21.89V55.38c0-1.36%201.1-2.46%202.46-2.46h11.91c1.36%200%202.46%201.1%202.46%202.46z%22%2F%3E%3Cpath%20fill%3D%22%23f44336%22%20d%3D%22M72.42%20121.91H55.58V74.84c0-1.36%201.1-2.46%202.46-2.46h11.91c1.36%200%202.46%201.1%202.46%202.46v47.07z%22%2F%3E%3Cpath%20fill%3D%22%230091ea%22%20d%3D%22M103.64%20121.91H91.73c-1.36%200-2.46-1.1-2.46-2.46V25.86c0-1.36%201.1-2.46%202.46-2.46h11.91c1.36%200%202.46%201.1%202.46%202.46v93.59c0%201.36-1.1%202.46-2.46%202.46%22%2F%3E%3Cpath%20fill%3D%22%23b0bec5%22%20d%3D%22M124%20120H8V4H4v120h120z%22%2F%3E%3Cpath%20fill%3D%22%23b0bec5%22%20d%3D%22M122%206v116H6V6zm2-2H4v120h120z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/noto/bar-chart.svg?color=%231a73e8&size=48
