bicycle icon

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

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

5 other variants in Phosphor

bicyclebicycle-boldbicycle-duotonebicycle-fillbicycle-thin

The same icon in other sets

bicycleAkar IconsbicycleBootstrap IconsbicycleCarbonbicycleEmoji One (Colored)bicycleElement PlusbicycleFont Awesome 6 SolidbicycleFont Awesome SolidbicycleFluent EmojibicycleFluent Emoji FlatbicycleFluent Emoji High ContrastbicycleFirefox OS EmojibicycleHuge IconsbicycleIconoirbicycleIonIconsbicycleLine AwesomebicycleMaterial Design IconsbicycleNoto EmojibicycleOpenMojibicycleStreamline EmojisbicycleTwitter Emoji

Use the bicycle icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M208 114a45.9 45.9 0 0 0-17.8 3.58L162.45 70H192a10 10 0 0 1 10 10a6 6 0 0 0 12 0a22 22 0 0 0-22-22h-40a6 6 0 0 0-5.18 9l13.4 23H98.11L81.18 61A6 6 0 0 0 76 58H48a6 6 0 0 0 0 12h24.55l15 25.64L70 119.62a46.22 46.22 0 1 0 9.68 7.09L94.11 107l32.71 56a6 6 0 0 0 5.19 3a5.9 5.9 0 0 0 3-.82a6 6 0 0 0 2.16-8.2l-32.07-55h62.11l12.63 21.66A46 46 0 1 0 208 114M82 160a34 34 0 1 1-19.13-30.57l-19.72 27a6 6 0 0 0 9.7 7.08l19.7-27A33.88 33.88 0 0 1 82 160m126 34a34 34 0 0 1-22-59.86L202.82 163a6 6 0 0 0 5.19 3a5.9 5.9 0 0 0 3-.82a6 6 0 0 0 2.16-8.2l-16.86-28.91A34 34 0 1 1 208 194"/></svg>

React

import type { SVGProps } from "react";

export function PhBicycleLight(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="M208 114a45.9 45.9 0 0 0-17.8 3.58L162.45 70H192a10 10 0 0 1 10 10a6 6 0 0 0 12 0a22 22 0 0 0-22-22h-40a6 6 0 0 0-5.18 9l13.4 23H98.11L81.18 61A6 6 0 0 0 76 58H48a6 6 0 0 0 0 12h24.55l15 25.64L70 119.62a46.22 46.22 0 1 0 9.68 7.09L94.11 107l32.71 56a6 6 0 0 0 5.19 3a5.9 5.9 0 0 0 3-.82a6 6 0 0 0 2.16-8.2l-32.07-55h62.11l12.63 21.66A46 46 0 1 0 208 114M82 160a34 34 0 1 1-19.13-30.57l-19.72 27a6 6 0 0 0 9.7 7.08l19.7-27A33.88 33.88 0 0 1 82 160m126 34a34 34 0 0 1-22-59.86L202.82 163a6 6 0 0 0 5.19 3a5.9 5.9 0 0 0 3-.82a6 6 0 0 0 2.16-8.2l-16.86-28.91A34 34 0 1 1 208 194"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M208 114a45.9 45.9 0 0 0-17.8 3.58L162.45 70H192a10 10 0 0 1 10 10a6 6 0 0 0 12 0a22 22 0 0 0-22-22h-40a6 6 0 0 0-5.18 9l13.4 23H98.11L81.18 61A6 6 0 0 0 76 58H48a6 6 0 0 0 0 12h24.55l15 25.64L70 119.62a46.22 46.22 0 1 0 9.68 7.09L94.11 107l32.71 56a6 6 0 0 0 5.19 3a5.9 5.9 0 0 0 3-.82a6 6 0 0 0 2.16-8.2l-32.07-55h62.11l12.63 21.66A46 46 0 1 0 208 114M82 160a34 34 0 1 1-19.13-30.57l-19.72 27a6 6 0 0 0 9.7 7.08l19.7-27A33.88 33.88 0 0 1 82 160m126 34a34 34 0 0 1-22-59.86L202.82 163a6 6 0 0 0 5.19 3a5.9 5.9 0 0 0 3-.82a6 6 0 0 0 2.16-8.2l-16.86-28.91A34 34 0 1 1 208 194"/></svg>
</template>

CSS

.icon-bicycle-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%22M208%20114a45.9%2045.9%200%200%200-17.8%203.58L162.45%2070H192a10%2010%200%200%201%2010%2010a6%206%200%200%200%2012%200a22%2022%200%200%200-22-22h-40a6%206%200%200%200-5.18%209l13.4%2023H98.11L81.18%2061A6%206%200%200%200%2076%2058H48a6%206%200%200%200%200%2012h24.55l15%2025.64L70%20119.62a46.22%2046.22%200%201%200%209.68%207.09L94.11%20107l32.71%2056a6%206%200%200%200%205.19%203a5.9%205.9%200%200%200%203-.82a6%206%200%200%200%202.16-8.2l-32.07-55h62.11l12.63%2021.66A46%2046%200%201%200%20208%20114M82%20160a34%2034%200%201%201-19.13-30.57l-19.72%2027a6%206%200%200%200%209.7%207.08l19.7-27A33.88%2033.88%200%200%201%2082%20160m126%2034a34%2034%200%200%201-22-59.86L202.82%20163a6%206%200%200%200%205.19%203a5.9%205.9%200%200%200%203-.82a6%206%200%200%200%202.16-8.2l-16.86-28.91A34%2034%200%201%201%20208%20194%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%22M208%20114a45.9%2045.9%200%200%200-17.8%203.58L162.45%2070H192a10%2010%200%200%201%2010%2010a6%206%200%200%200%2012%200a22%2022%200%200%200-22-22h-40a6%206%200%200%200-5.18%209l13.4%2023H98.11L81.18%2061A6%206%200%200%200%2076%2058H48a6%206%200%200%200%200%2012h24.55l15%2025.64L70%20119.62a46.22%2046.22%200%201%200%209.68%207.09L94.11%20107l32.71%2056a6%206%200%200%200%205.19%203a5.9%205.9%200%200%200%203-.82a6%206%200%200%200%202.16-8.2l-32.07-55h62.11l12.63%2021.66A46%2046%200%201%200%20208%20114M82%20160a34%2034%200%201%201-19.13-30.57l-19.72%2027a6%206%200%200%200%209.7%207.08l19.7-27A33.88%2033.88%200%200%201%2082%20160m126%2034a34%2034%200%200%201-22-59.86L202.82%20163a6%206%200%200%200%205.19%203a5.9%205.9%200%200%200%203-.82a6%206%200%200%200%202.16-8.2l-16.86-28.91A34%2034%200%201%201%20208%20194%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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