ferry boat icon
ferry-boat from Huge Icons by Hugeicons · Stroke · MIT Free for personal and commercial use.
- Name
- ferry-boat
- Set
- Huge Icons
- Style
- Stroke
- Viewbox
- 24×24
- License
- MIT
Use the ferry boat icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5"><path stroke-linejoin="round" d="M19.02 14.303L17.81 17m1.21-2.697H16m3.02 0c.765-1.703 1.147-2.555.91-3.33a2 2 0 0 0-.079-.216c-.318-.741-1.142-1.098-2.791-1.813L14.2 7.706C13.115 7.236 12.571 7 12 7s-1.115.235-2.201.706L6.94 8.944c-1.649.715-2.473 1.072-2.791 1.813a2 2 0 0 0-.08.217c-.236.774.146 1.626.91 3.33M6.19 17l-1.21-2.697m0 0H8"/><path stroke-linejoin="round" d="M18 9V8c0-1.886 0-2.828-.586-3.414S15.886 4 14 4h-4c-1.886 0-2.828 0-3.414.586S6 6.114 6 8v1m6-5V2"/><path d="M2 21.193c.685 1.051 1.571 1.051 2.273 0c2.257-3.452 4.407 2.483 6 .04c2.43-3.664 4.178 2.689 6-.04c2.376-3.635 3.857 2.385 5.727.391"/></g></svg>
React
import type { SVGProps } from "react";
export function HugeiconsFerryBoat(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeWidth="1.5"><path strokeLinejoin="round" d="M19.02 14.303L17.81 17m1.21-2.697H16m3.02 0c.765-1.703 1.147-2.555.91-3.33a2 2 0 0 0-.079-.216c-.318-.741-1.142-1.098-2.791-1.813L14.2 7.706C13.115 7.236 12.571 7 12 7s-1.115.235-2.201.706L6.94 8.944c-1.649.715-2.473 1.072-2.791 1.813a2 2 0 0 0-.08.217c-.236.774.146 1.626.91 3.33M6.19 17l-1.21-2.697m0 0H8"/><path strokeLinejoin="round" d="M18 9V8c0-1.886 0-2.828-.586-3.414S15.886 4 14 4h-4c-1.886 0-2.828 0-3.414.586S6 6.114 6 8v1m6-5V2"/><path d="M2 21.193c.685 1.051 1.571 1.051 2.273 0c2.257-3.452 4.407 2.483 6 .04c2.43-3.664 4.178 2.689 6-.04c2.376-3.635 3.857 2.385 5.727.391"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5"><path stroke-linejoin="round" d="M19.02 14.303L17.81 17m1.21-2.697H16m3.02 0c.765-1.703 1.147-2.555.91-3.33a2 2 0 0 0-.079-.216c-.318-.741-1.142-1.098-2.791-1.813L14.2 7.706C13.115 7.236 12.571 7 12 7s-1.115.235-2.201.706L6.94 8.944c-1.649.715-2.473 1.072-2.791 1.813a2 2 0 0 0-.08.217c-.236.774.146 1.626.91 3.33M6.19 17l-1.21-2.697m0 0H8"/><path stroke-linejoin="round" d="M18 9V8c0-1.886 0-2.828-.586-3.414S15.886 4 14 4h-4c-1.886 0-2.828 0-3.414.586S6 6.114 6 8v1m6-5V2"/><path d="M2 21.193c.685 1.051 1.571 1.051 2.273 0c2.257-3.452 4.407 2.483 6 .04c2.43-3.664 4.178 2.689 6-.04c2.376-3.635 3.857 2.385 5.727.391"/></g></svg> </template>
CSS
.icon-ferry-boat {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M19.02%2014.303L17.81%2017m1.21-2.697H16m3.02%200c.765-1.703%201.147-2.555.91-3.33a2%202%200%200%200-.079-.216c-.318-.741-1.142-1.098-2.791-1.813L14.2%207.706C13.115%207.236%2012.571%207%2012%207s-1.115.235-2.201.706L6.94%208.944c-1.649.715-2.473%201.072-2.791%201.813a2%202%200%200%200-.08.217c-.236.774.146%201.626.91%203.33M6.19%2017l-1.21-2.697m0%200H8%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M18%209V8c0-1.886%200-2.828-.586-3.414S15.886%204%2014%204h-4c-1.886%200-2.828%200-3.414.586S6%206.114%206%208v1m6-5V2%22%2F%3E%3Cpath%20d%3D%22M2%2021.193c.685%201.051%201.571%201.051%202.273%200c2.257-3.452%204.407%202.483%206%20.04c2.43-3.664%204.178%202.689%206-.04c2.376-3.635%203.857%202.385%205.727.391%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M19.02%2014.303L17.81%2017m1.21-2.697H16m3.02%200c.765-1.703%201.147-2.555.91-3.33a2%202%200%200%200-.079-.216c-.318-.741-1.142-1.098-2.791-1.813L14.2%207.706C13.115%207.236%2012.571%207%2012%207s-1.115.235-2.201.706L6.94%208.944c-1.649.715-2.473%201.072-2.791%201.813a2%202%200%200%200-.08.217c-.236.774.146%201.626.91%203.33M6.19%2017l-1.21-2.697m0%200H8%22%2F%3E%3Cpath%20stroke-linejoin%3D%22round%22%20d%3D%22M18%209V8c0-1.886%200-2.828-.586-3.414S15.886%204%2014%204h-4c-1.886%200-2.828%200-3.414.586S6%206.114%206%208v1m6-5V2%22%2F%3E%3Cpath%20d%3D%22M2%2021.193c.685%201.051%201.571%201.051%202.273%200c2.257-3.452%204.407%202.483%206%20.04c2.43-3.664%204.178%202.689%206-.04c2.376-3.635%203.857%202.385%205.727.391%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/hugeicons/ferry-boat.svg?color=%231a73e8&size=48
