ICONYZ
English
Mesh Quad icon from @icons

Mesh Quad icon

at-icons:mesh-quad

The Mesh Quad icon (at-icons:mesh-quad) is a free SVG icon from the @icons set by Valentin Fossati. It is drawn on a 24 × 24 grid. @icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set
@icons
Author
Valentin Fossati
License
MIT
Size
24 × 24
Tags
meshquad
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none"><g fill="currentColor" clip-path="url(#SVGDMFyGe9Y)"><path d="M2 12a2 2 0 0 1 .635.104l.074.028q.072.027.143.06l.048.024a2 2 0 0 1 .883.883l.024.049q.033.07.06.142q.016.038.028.074a2 2 0 0 1 .09.863a2 2 0 0 1-.09.408l-.026.072a2 2 0 0 1-.05.122l-.036.071A1.997 1.997 0 0 1 0 14c0-.78.447-1.454 1.099-1.784l.048-.024A2 2 0 0 1 2 12m12 0a2 2 0 0 1 .635.104l.074.028q.073.027.143.06l.048.024a1.998 1.998 0 1 1-2.823 2.33a2 2 0 0 1 .027-1.182l.028-.074q.027-.073.06-.142l.024-.05c.192-.38.502-.69.883-.882l.049-.024q.07-.033.142-.06l.074-.027l.088-.028A2 2 0 0 1 14 12m-2.826 1c-.11.313-.174.649-.174 1s.063.687.174 1H4.826c.11-.313.174-.649.174-1s-.063-.687-.174-1zM3 11.174A3 3 0 0 0 2 11c-.351 0-.687.063-1 .174V4.825c.313.111.649.175 1 .175a3 3 0 0 0 1-.175zm12 0A3 3 0 0 0 14 11c-.351 0-.687.063-1 .174V4.825c.313.111.649.175 1 .175a3 3 0 0 0 1-.175zM2 0c.78 0 1.453.447 1.783 1.099l.012.022q.04.082.072.169q.016.038.028.074l.024.076a2 2 0 0 1 .066.788a2 2 0 0 1-.09.407l-.028.074a2 2 0 0 1-.06.143l-.024.048A2 2 0 1 1 2 0m12 0a2 2 0 1 1-1.784 2.9l-.024-.048a2 2 0 0 1-.06-.143q-.016-.038-.027-.074l-.028-.088a1.98 1.98 0 0 1 .055-1.257a2 2 0 0 1 .073-.169l.01-.022A2 2 0 0 1 14 0m-2.826 1c-.11.313-.174.649-.174 1s.063.687.174 1H4.826c.11-.313.174-.649.174-1s-.063-.687-.174-1z"/></g><defs><clipPath id="SVGDMFyGe9Y"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></g></svg>

How to use the Mesh Quad icon

React

import { Icon } from "@iconify/react";

<Icon icon="at-icons:mesh-quad" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="at-icons:mesh-quad" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="at-icons:mesh-quad" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[at-icons--mesh-quad]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/at-icons -->
<div class="i-at-icons:mesh-quad"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="at-icons:mesh-quad"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/at-icons/mesh-quad.svg" alt="Mesh Quad icon" width="24" height="24">

Related icons in @icons

Mesh Quad icon FAQ

Is the Mesh Quad icon free for commercial use?

Yes. @icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Mesh Quad icon in React?

Install @iconify/react and render <Icon icon="at-icons:mesh-quad" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Mesh Quad icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/at-icons/mesh-quad.svg" alt="Mesh Quad icon">, or paste the SVG code inline to style it with CSS.

Browse all @icons →