Hoplon icon

file-icons:hoplon

The Hoplon icon (file-icons:hoplon) 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="M356.731 487.79H155.27c-19.4 0-37.416-10.472-47.017-27.33L7.055 282.777c-9.407-16.517-9.407-37.038 0-53.554L108.253 51.539c9.6-16.858 27.616-27.33 47.016-27.33H356.73c19.399 0 37.415 10.472 47.017 27.33l101.196 177.684c9.408 16.516 9.408 37.037 0 53.555L403.748 460.46c-9.602 16.859-27.617 27.33-47.017 27.33M155.27 53.06a25.31 25.31 0 0 0-21.948 12.757L32.124 243.5c-4.391 7.71-4.391 17.29 0 25l101.197 177.683a25.31 25.31 0 0 0 21.948 12.758H356.73a25.31 25.31 0 0 0 21.948-12.758L479.876 268.5c4.392-7.71 4.392-17.29 0-25L378.679 65.817a25.31 25.31 0 0 0-21.948-12.757zm31.282 80.96l31.29 54.348l-76.683 135.15l31.351 55.5c5.735 5.747 10.887 3.628 15.676-3.39l61.431-107.61c4.59-4.929 8.965-4.848 13.134 0l60.16 105.068c5.266 11.519 13.699 10.26 16.947 5.508l31.553-56.511L256.119 121.7h-62.334c-6.913.508-9.339 5.405-7.234 12.32"/></svg>

How to use the Hoplon icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Hoplon icon FAQ

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

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

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

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

Browse all File Icons →