Skip to content
tablericons

analytics

Chart Grid Dots icon

Download the Chart Grid Dots icon as free SVG or PNG. Compare outline and filled styles. Copy React, Vue or Svelte code.

  • chart
  • graph
  • statistics
  • analytics
  • data
  • report
  • diagram
  • grid
  • dots
  • dot-plot
Style
Size
Stroke
Color
Download SVG

Press C to copy SVG, J for JSX, D to download.

Category
analytics
Styles
Outline, filled
Component
IconChartGridDots
License
MIT · Paweł Kuna

Code

Copy it the way you use it

chart-grid-dots.svg
<svg
  xmlns="http://www.w3.org/2000/svg"
  width="24"
  height="24"
  viewBox="0 0 24 24"
  fill="none"
  stroke="currentColor"
  stroke-width="2"
  stroke-linecap="round"
  stroke-linejoin="round"
 
>
  <path d="M16 6a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
  <path d="M4 12a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
  <path d="M4 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
  <path d="M16 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
  <path d="M8 18h8" />
  <path d="M18 20v1" />
  <path d="M18 3v1" />
  <path d="M6 20v1" />
  <path d="M6 10v-7" />
  <path d="M12 3v18" />
  <path d="M18 8v8" />
  <path d="M8 12h13" />
  <path d="M21 6h-1" />
  <path d="M16 6h-13" />
  <path d="M3 12h1" />
  <path d="M20 18h1" />
  <path d="M3 18h1" />
  <path d="M6 14v2" />
</svg>

Use the Chart Grid Dots icon

For a decorative icon beside text, add aria-hidden="true" to the SVG. For an icon-only control, put its accessible name on the button or link.

React example
import { IconChartGridDots } from '@tabler/icons-react';

<IconChartGridDots size={24} stroke={2} />
Read the React guide
Vue example
import { IconChartGridDots } from '@tabler/icons-vue';

<IconChartGridDots :size="24" :stroke="2" />
Read the Vue guide
Svelte 5 example
import { IconChartGridDots } from '@tabler/icons-svelte-runes';

<IconChartGridDots size={24} stroke={2} />
Read the Svelte guide

Related

Related icons

See all 49 analytics icons