Gap icon

file-icons:gap

The Gap icon (file-icons:gap) is a free SVG icon from the File Icons set by John Gardner. It is drawn on a 512 × 512 grid. File Icons are released under the ISC 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: File Icons
Author: John Gardner
License: ISC
Size: 512 × 512

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="currentColor" d="M280.74 278.935h49.312L279.594 106.92h-45.87l-50.459 172.015h47.19l7.021-33.256h36.196zm-36.728-64.219l11.5-54.471l11.578 54.471zm225.45-13.136l35.33 34.98c9.47 9.47 9.47 24.823 0 34.293L273.04 504.898c-9.47 9.47-24.823 9.47-34.292 0L7.428 274.348c-9.47-9.47-9.902-28.318-.432-37.788l26.182-25.923c.922 9.332 2.637 18.537 5.167 27.24l-15.987 15.83l233.536 235.829l233.536-235.83l-37.894-37.521c6.94-3.844 13.268-8.337 17.926-14.605M175.65 101.92c-7.709-4.16-15.451-7.078-23.211-9.363l86.309-85.455c9.47-9.47 24.822-9.47 34.292 0l84.6 83.763h-32.667l-69.08-68.4zm21.476 269.904l52.053-69.31h36.149v72.75h17.146v22.935h-17.146v38.99h-35.55V398.2h-52.652zm52.652 3.44v-34.228l-26.392 34.228zm-137.612-188.07h59.632v91.741h-25.994l-8.027-12.614c-14.526 17.584-35.571 22.99-60.397 5.352c-29.051-20.642-37.454-86.346-19.972-124.616c31.822-69.666 104.451-34.02 104.451-34.02v38.225c-11.563-10.512-56.567-29.002-66.895 17.87c-3.727 16.915-1.433 62.786 12.615 74.827c11.147 9.555 18.061-.287 19.495-5.679v-18.977h-14.908zm231.647 91.455V106.92h77.98c14.55 0 32.605 8.167 40.52 23.318c13.378 25.611 3.607 50.649-6.5 62.69c-17.965 21.406-67.276 17.775-67.276 17.775v67.946zm66.895-102.54c8.101-2.996 12.232-10.606 12.232-18.349c0-7.369-5.329-16.034-12.997-18.54h-20.642v38.418s12.71 1.686 21.407-1.53"/></svg>

How to use the Gap icon

React

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

<Icon icon="file-icons:gap" width="24" />

Vue

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

<template>
  <Icon icon="file-icons:gap" width="24" />
</template>

Svelte

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

<Icon icon="file-icons:gap" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[file-icons--gap]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/file-icons -->
<div class="i-file-icons:gap"></div>

Web component

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

<iconify-icon icon="file-icons:gap"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/file-icons/gap.svg" alt="Gap icon" width="24" height="24">

Gap icon FAQ

Is the Gap icon free for commercial use?

Yes. File Icons are released under the ISC license, which allows use in personal and commercial projects.

How do I use the Gap icon in React?

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

How do I add the Gap icon to a web page?

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

Browse all File Icons →