Harbour icon

file-icons:harbour

The Harbour icon (file-icons:harbour) 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="M512 431.554c-2.164 5.552-3.09 8.329-10.185 12.34c-77.735 16.659-209.454 17.583-409.966-10.797c-12.541-8.122-22.901-14.634-36.402-20.36C260.124 441.266 432.253 446.82 512 431.554M231.012 63.77C159.7 160.035 77.225 285.809 49.724 328.009c27.501-42.2 109.976-167.974 181.288-264.24m279.08 363.811c.133-4.55-1.025-5.706-1.481-7.855C407.883 438.888 115.474 401.918 0 389.638c0 5.424.865 9.887 2.558 12.659c31.141 4.02 82.968 10.274 100.999 12.35c185.296 21.266 334.78 26.678 406.534 12.933m-311.958-48.496c-21.519-12.626-40.686.937-62.665 6.543l-6.84 15.025c24.61-9.551 75.292-12.74 103.386-8.352c-3.902-68.293-4.888-112.742-2.61-160.612c-22.619 63.62-28.394 107.12-31.27 147.396M76.782 385.79c56.468-22.719 104.863-26.006 118.656-18.806c0-32.615 7.627-165.984 41.394-255.593l-3.404 5.64c-22.208 58.653-45.108 95.592-54.462 193.32c-30.396-2.35-39.27 14.483-76.982 30.445c-11.714 20.564-20.46 36.196-25.202 44.994m154.23-322.022C159.7 160.035 77.225 285.809 49.724 328.009c39.617-24.922 84.232-48.233 124.425-36.577c0-32.615 2.811-152.39 56.863-227.663m250.184 266.69l12.658-.002c-.986 0-3.337-7.036-5.902-7.036c-13.985 0-27.997.014-42.02-.05c.126-7.66-.387-15.428-1.433-23.216c-.336-2.493-5.931-5.947-6.019-6.598c1.348 10.027 1.803 20.015 1.138 29.78c-22.366-.14-44.753-.512-67.099-1.475c2.812-82.25 6.762-164.464 8.412-246.75c.067-3.321-8.539-8.911-8.53-9.353c-1.71 85.267-5.89 170.457-8.713 255.689c-21.321-1.075-42.597-2.734-63.77-5.296c-.606-49.013-1.086-98.029-.996-147.041c.075-41.437.856-82.874 4.41-124.177c.275-3.18-8.549-9.125-8.529-9.352c-3.508 40.743-4.297 81.612-4.408 122.489c-.141 52.332.411 104.67 1.083 157.004a665 665 0 0 1-29.61-4.591c.345.066 3.09 6.609 5.408 7.02a658 658 0 0 0 24.284 3.865c.363 27.951.754 55.901 1.085 83.848c.039 3.379 8.523 8.808 8.53 9.353c-.364-30.689-.792-61.38-1.179-92.072c21.068 2.705 42.244 4.495 63.473 5.674c-.748 23.175-1.389 46.354-1.844 69.538c-.065 3.322 8.54 8.91 8.53 9.353c.513-26.151 1.263-52.294 2.136-78.434c22.189 1.062 44.425 1.51 66.642 1.696c-1.427 11.304-4.469 22.238-9.503 32.508c-9.265-1.627-18.92-1.63-27.127-.736c.677-.074 3.553 7.35 5.946 7.088c5.544-.603 11.694-.735 17.905-.259a94.6 94.6 0 0 1-9.503 13.417c-.965 1.138 5.588 7.512 5.947 7.089a94.5 94.5 0 0 0 12.71-19.34c7.4 1.338 14.497 3.659 20.337 7.213c3.197 1.945 1.33 7.125-.33 9.611c-2.367 3.541-7.165 5.093-11.016 6.197c-8.455 2.425-17.679 1.835-26.371 1.785c1.006.005 3.357 7.074 5.947 7.088c11.521.068 24.947 1.15 34.95-5.604c8.033-5.424 3.54-14.552-1.494-20.066c-5.046-5.53-11.975-9.211-19.605-11.524c4.583-10.92 7.078-22.503 7.908-34.418c11.864.074 23.722.085 35.562.085M140.62 476.418c.15-.185.308-.387.468-.57c8.327-9.887 23.959-18.092 46.49-17.295c43.926 1.541 80.972 4.573 147.826 1.289c-65.756-1.67-145.825-8.609-242.32-22.272c23.98 13.945 43.925 34.94 47.536 38.848"/></svg>

How to use the Harbour icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Harbour icon FAQ

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

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

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

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

Browse all File Icons →