bar chart emoji
bar-chart from Fluent Emoji Flat by Microsoft Corporation · Default · Objects · MIT Free for personal and commercial use.
- Name
- bar-chart
- Set
- Fluent Emoji Flat
- Style
- Default
- Category
- Objects
- Viewbox
- 32×32
- License
- MIT
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 High Contrastbar-chartHuge Iconsbar-chartHumbleiconsbar-chartIonIconsbar-chartJam Iconsbar-chartMaterial Symbolsbar-chartMaterial Symbols Lightbar-chartNoto Emojibar-chartOpenMojibar-chartRadix Iconsbar-chart-fillRemix Iconbar-chartStreamline Emojisbar-chart-outlineTeenyiconsbar-chartTwitter Emoji
More objects icons from Fluent Emoji Flat
Use the bar chart emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#e1d8ec" d="M2 6a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4v20c0 1.48-.804 2.773-2 3.465L26.554 29a4 4 0 0 0-3.014.23L22 30h-3l-3-1.5l-3 1.5h-3l-1.54-.77A4 4 0 0 0 5.446 29L4 29.465A4 4 0 0 1 2 26z"/><path fill="#b4acbc" d="M10 11v10H2v1h8v8h1v-8h10v8h1v-8h8v-1h-8V11h8v-1h-8V2h-1v8H11V2h-1v8H2v1zm1 0h10v10H11z"/><path fill="#00d26a" d="M6 30h4V10.214C10 9.542 9.453 9 8.774 9H5.226C4.547 9 4 9.542 4 10.213v19.252c.588.34 1.271.535 2 .535"/><path fill="#f70a8d" d="M17.774 17h-3.548c-.679 0-1.226.542-1.226 1.214V30h6V18.214c0-.672-.547-1.214-1.226-1.214"/><path fill="#00a6ed" d="M22 30h4c.729 0 1.412-.195 2-.535V7.209C28 6.539 27.453 6 26.774 6h-3.548C22.547 6 22 6.54 22 7.209z"/></g></svg>
React
import type { SVGProps } from "react";
export function FluentEmojiFlatBarChart(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#e1d8ec" d="M2 6a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4v20c0 1.48-.804 2.773-2 3.465L26.554 29a4 4 0 0 0-3.014.23L22 30h-3l-3-1.5l-3 1.5h-3l-1.54-.77A4 4 0 0 0 5.446 29L4 29.465A4 4 0 0 1 2 26z"/><path fill="#b4acbc" d="M10 11v10H2v1h8v8h1v-8h10v8h1v-8h8v-1h-8V11h8v-1h-8V2h-1v8H11V2h-1v8H2v1zm1 0h10v10H11z"/><path fill="#00d26a" d="M6 30h4V10.214C10 9.542 9.453 9 8.774 9H5.226C4.547 9 4 9.542 4 10.213v19.252c.588.34 1.271.535 2 .535"/><path fill="#f70a8d" d="M17.774 17h-3.548c-.679 0-1.226.542-1.226 1.214V30h6V18.214c0-.672-.547-1.214-1.226-1.214"/><path fill="#00a6ed" d="M22 30h4c.729 0 1.412-.195 2-.535V7.209C28 6.539 27.453 6 26.774 6h-3.548C22.547 6 22 6.54 22 7.209z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#e1d8ec" d="M2 6a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4v20c0 1.48-.804 2.773-2 3.465L26.554 29a4 4 0 0 0-3.014.23L22 30h-3l-3-1.5l-3 1.5h-3l-1.54-.77A4 4 0 0 0 5.446 29L4 29.465A4 4 0 0 1 2 26z"/><path fill="#b4acbc" d="M10 11v10H2v1h8v8h1v-8h10v8h1v-8h8v-1h-8V11h8v-1h-8V2h-1v8H11V2h-1v8H2v1zm1 0h10v10H11z"/><path fill="#00d26a" d="M6 30h4V10.214C10 9.542 9.453 9 8.774 9H5.226C4.547 9 4 9.542 4 10.213v19.252c.588.34 1.271.535 2 .535"/><path fill="#f70a8d" d="M17.774 17h-3.548c-.679 0-1.226.542-1.226 1.214V30h6V18.214c0-.672-.547-1.214-1.226-1.214"/><path fill="#00a6ed" d="M22 30h4c.729 0 1.412-.195 2-.535V7.209C28 6.539 27.453 6 26.774 6h-3.548C22.547 6 22 6.54 22 7.209z"/></g></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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23e1d8ec%22%20d%3D%22M2%206a4%204%200%200%201%204-4h20a4%204%200%200%201%204%204v20c0%201.48-.804%202.773-2%203.465L26.554%2029a4%204%200%200%200-3.014.23L22%2030h-3l-3-1.5l-3%201.5h-3l-1.54-.77A4%204%200%200%200%205.446%2029L4%2029.465A4%204%200%200%201%202%2026z%22%2F%3E%3Cpath%20fill%3D%22%23b4acbc%22%20d%3D%22M10%2011v10H2v1h8v8h1v-8h10v8h1v-8h8v-1h-8V11h8v-1h-8V2h-1v8H11V2h-1v8H2v1zm1%200h10v10H11z%22%2F%3E%3Cpath%20fill%3D%22%2300d26a%22%20d%3D%22M6%2030h4V10.214C10%209.542%209.453%209%208.774%209H5.226C4.547%209%204%209.542%204%2010.213v19.252c.588.34%201.271.535%202%20.535%22%2F%3E%3Cpath%20fill%3D%22%23f70a8d%22%20d%3D%22M17.774%2017h-3.548c-.679%200-1.226.542-1.226%201.214V30h6V18.214c0-.672-.547-1.214-1.226-1.214%22%2F%3E%3Cpath%20fill%3D%22%2300a6ed%22%20d%3D%22M22%2030h4c.729%200%201.412-.195%202-.535V7.209C28%206.539%2027.453%206%2026.774%206h-3.548C22.547%206%2022%206.54%2022%207.209z%22%2F%3E%3C%2Fg%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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23e1d8ec%22%20d%3D%22M2%206a4%204%200%200%201%204-4h20a4%204%200%200%201%204%204v20c0%201.48-.804%202.773-2%203.465L26.554%2029a4%204%200%200%200-3.014.23L22%2030h-3l-3-1.5l-3%201.5h-3l-1.54-.77A4%204%200%200%200%205.446%2029L4%2029.465A4%204%200%200%201%202%2026z%22%2F%3E%3Cpath%20fill%3D%22%23b4acbc%22%20d%3D%22M10%2011v10H2v1h8v8h1v-8h10v8h1v-8h8v-1h-8V11h8v-1h-8V2h-1v8H11V2h-1v8H2v1zm1%200h10v10H11z%22%2F%3E%3Cpath%20fill%3D%22%2300d26a%22%20d%3D%22M6%2030h4V10.214C10%209.542%209.453%209%208.774%209H5.226C4.547%209%204%209.542%204%2010.213v19.252c.588.34%201.271.535%202%20.535%22%2F%3E%3Cpath%20fill%3D%22%23f70a8d%22%20d%3D%22M17.774%2017h-3.548c-.679%200-1.226.542-1.226%201.214V30h6V18.214c0-.672-.547-1.214-1.226-1.214%22%2F%3E%3Cpath%20fill%3D%22%2300a6ed%22%20d%3D%22M22%2030h4c.729%200%201.412-.195%202-.535V7.209C28%206.539%2027.453%206%2026.774%206h-3.548C22.547%206%2022%206.54%2022%207.209z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-emoji-flat/bar-chart.svg?color=%231a73e8&size=48
