flight takeoff icon

flight-takeoff from Material Symbols Light by Google · Regular · Transit · Apache-2.0 Free for personal and commercial use.

Name: flight-takeoff
Set: Material Symbols Light
Style: Regular
Category: Transit
Viewbox: 24×24
License: Apache 2.0
Aliases: flight-takeoff-outline, flight-takeoff-outline-sharp, flight-takeoff-sharp

1 other variant in Material Symbols Light

flight-takeoff-rounded

The same icon in other sets

flight-takeoffMaterial Symbols flight-takeoff-fillMingCute Icon flight-takeoff-fillRemix Icon flight-takeoffTDesign Icons

Use the flight takeoff icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4 20v-1h16v1zm1.327-4.923L2.231 9.904l1.458-.381l2.665 2.273l4.135-1.079l-4.926-6.611l1.862-.487l7.11 6.025l4.269-1.13q.569-.148 1.09.158q.52.307.668.876t-.12 1.09t-.838.668z"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightFlightTakeoff(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4 20v-1h16v1zm1.327-4.923L2.231 9.904l1.458-.381l2.665 2.273l4.135-1.079l-4.926-6.611l1.862-.487l7.11 6.025l4.269-1.13q.569-.148 1.09.158q.52.307.668.876t-.12 1.09t-.838.668z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4 20v-1h16v1zm1.327-4.923L2.231 9.904l1.458-.381l2.665 2.273l4.135-1.079l-4.926-6.611l1.862-.487l7.11 6.025l4.269-1.13q.569-.148 1.09.158q.52.307.668.876t-.12 1.09t-.838.668z"/></svg>
</template>

CSS

.icon-flight-takeoff {
  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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4%2020v-1h16v1zm1.327-4.923L2.231%209.904l1.458-.381l2.665%202.273l4.135-1.079l-4.926-6.611l1.862-.487l7.11%206.025l4.269-1.13q.569-.148%201.09.158q.52.307.668.876t-.12%201.09t-.838.668z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4%2020v-1h16v1zm1.327-4.923L2.231%209.904l1.458-.381l2.665%202.273l4.135-1.079l-4.926-6.611l1.862-.487l7.11%206.025l4.269-1.13q.569-.148%201.09.158q.52.307.668.876t-.12%201.09t-.838.668z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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

flight takeoff icon

1 other variant in Material Symbols Light

The same icon in other sets

More transit icons from Material Symbols Light

Use the flight takeoff icon

SVG

React

Vue

CSS