Hop icon

file-icons:hop

The Hop icon (file-icons:hop) 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="M238.785 504.809L7.185 273.17c-9.467-9.853-9.693-24.21 0-34.403l231.6-231.64c9.352-9.233 24.451-9.769 34.397 0l231.599 231.64c9.513 10.113 9.737 24.336 0 34.406L273.182 504.81c-8.815 8.952-23.88 10.204-34.397 0M16.215 264.14l231.599 231.64c4.364 4.365 11.978 4.365 16.336 0l231.602-231.64c4.429-4.593 4.688-11.357 0-16.342L264.153 16.158c-4.472-4.427-11.672-4.565-16.34.002L16.216 247.797c-4.418 4.552-4.623 11.55 0 16.342m323.854-46.612c10.414 6.416 26.94-5.006 25.507-6.512c-10.698-5.5-20.764-10.252-19.319-15.495c1.896-4.04 6.502-5.893 13.908-2.55c4.189 1.89 10.838 8.376 17 13.436c3.833 3.246 6.842 1.136 12.699 5.716c2.51 2.056 5.255 3.655 12.19 7.096c9.848 4.887 15.732 9.374 15.732 11.998c-.518 1.833-7.354 9.087-23.88 5.391c-18.955-3.85-23.212 3.405-37.304 16.307c-27.954 28.965-17.018 3.74-40.457 36.903c-8.662 13.427-22.154 18.506-25.475 16.667c-3.001-1.696-5.45-6.316-5.664-8.91c-.424-4.438 8.139-8.421 8.808-4.435c1.488 4.392 8.687 1.3 13.906-11.662c4.688-12.55-5.176-18.807-9.908-20.438c-9.934 3.886-18.074 8.892-18.26 24.861c1.083 18.72 1.083 37.834 7.457 41.037c15.944 8.656 50.678 17.585 81.693 28.631c13.06 4.511 12.921 8.061 2.411 9.753c-36.755-8.791-74.926-11.305-92.763-18.688c-6.088-2.927-8.006-4.772-11.177-10.752c-9.462-17.541-9.276-41.724-23.832-65.542c-4.48-5.457-32.624-15.239-42.344-33.402c-1.439-2.73-2.454-2.752-6.59-.14c-26.54 16.044-52.846 26.108-74.421 24.62c-26.349-1.817-45.162-12.206-47.737-25.086c-14.477-23.838.216-29.79 1.268-19.349c13.363 30.111 38.285 46.481 86.576 7.334c42.435-36.6 80.054-94.272 131.284-55.604c12.73 9.567 27.733 30.019 48.692 48.815"/></svg>

How to use the Hop icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Related icons in File Icons

Hop icon in other icon sets

Hop icon FAQ

Is the Hop 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 Hop icon in React?

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

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

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

Browse all File Icons →