sailboat icon

sailboat-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.

Name
sailboat-light
Set
Phosphor
Style
Light
Viewbox
256×256
License
MIT

5 other variants in Phosphor

sailboatsailboat-boldsailboat-duotonesailboat-fillsailboat-thin

The same icon in other sets

sailboatEmoji One (Colored)sailboatFont Awesome 6 SolidsailboatFont Awesome SolidsailboatFluent EmojisailboatFluent Emoji FlatsailboatFluent Emoji High ContrastsailboatFirefox OS EmojisailboatHuge IconssailboatIconParksailboatIconPark OutlinesailboatIconPark SolidsailboatIconPark TwoTonesailboatLucidesailboat-fillMingCute IconsailboatNoto EmojisailboatOpenMojisailboat-fillRemix IconsailboatStreamline EmojissailboatTabler IconssailboatTwitter Emoji

Use the sailboat icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M245.41 173.4A6 6 0 0 0 240 170h-98v-28h74a6 6 0 0 0 4.44-10L142 45.68V8a6 6 0 0 0-10.66-3.78l-104 128A6 6 0 0 0 32 142h98v28H16a6 6 0 0 0-4.69 9.75l29.6 37A14 14 0 0 0 51.84 222h152.32a14 14 0 0 0 10.93-5.25l29.6-37a6 6 0 0 0 .72-6.35m-43-43.4H142V63.52Zm-157.8 0L130 24.9V130Zm161.11 79.25a2 2 0 0 1-1.56.75H51.84a2 2 0 0 1-1.56-.75L28.48 182h199Z"/></svg>

React

import type { SVGProps } from "react";

export function PhSailboatLight(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M245.41 173.4A6 6 0 0 0 240 170h-98v-28h74a6 6 0 0 0 4.44-10L142 45.68V8a6 6 0 0 0-10.66-3.78l-104 128A6 6 0 0 0 32 142h98v28H16a6 6 0 0 0-4.69 9.75l29.6 37A14 14 0 0 0 51.84 222h152.32a14 14 0 0 0 10.93-5.25l29.6-37a6 6 0 0 0 .72-6.35m-43-43.4H142V63.52Zm-157.8 0L130 24.9V130Zm161.11 79.25a2 2 0 0 1-1.56.75H51.84a2 2 0 0 1-1.56-.75L28.48 182h199Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M245.41 173.4A6 6 0 0 0 240 170h-98v-28h74a6 6 0 0 0 4.44-10L142 45.68V8a6 6 0 0 0-10.66-3.78l-104 128A6 6 0 0 0 32 142h98v28H16a6 6 0 0 0-4.69 9.75l29.6 37A14 14 0 0 0 51.84 222h152.32a14 14 0 0 0 10.93-5.25l29.6-37a6 6 0 0 0 .72-6.35m-43-43.4H142V63.52Zm-157.8 0L130 24.9V130Zm161.11 79.25a2 2 0 0 1-1.56.75H51.84a2 2 0 0 1-1.56-.75L28.48 182h199Z"/></svg>
</template>

CSS

.icon-sailboat-light {
  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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M245.41%20173.4A6%206%200%200%200%20240%20170h-98v-28h74a6%206%200%200%200%204.44-10L142%2045.68V8a6%206%200%200%200-10.66-3.78l-104%20128A6%206%200%200%200%2032%20142h98v28H16a6%206%200%200%200-4.69%209.75l29.6%2037A14%2014%200%200%200%2051.84%20222h152.32a14%2014%200%200%200%2010.93-5.25l29.6-37a6%206%200%200%200%20.72-6.35m-43-43.4H142V63.52Zm-157.8%200L130%2024.9V130Zm161.11%2079.25a2%202%200%200%201-1.56.75H51.84a2%202%200%200%201-1.56-.75L28.48%20182h199Z%22%2F%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M245.41%20173.4A6%206%200%200%200%20240%20170h-98v-28h74a6%206%200%200%200%204.44-10L142%2045.68V8a6%206%200%200%200-10.66-3.78l-104%20128A6%206%200%200%200%2032%20142h98v28H16a6%206%200%200%200-4.69%209.75l29.6%2037A14%2014%200%200%200%2051.84%20222h152.32a14%2014%200%200%200%2010.93-5.25l29.6-37a6%206%200%200%200%20.72-6.35m-43-43.4H142V63.52Zm-157.8%200L130%2024.9V130Zm161.11%2079.25a2%202%200%200%201-1.56.75H51.84a2%202%200%200%201-1.56-.75L28.48%20182h199Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/sailboat-light.svg?color=%231a73e8&size=48