walk-bike from Material Symbols by Google · Regular · Transit · Apache-2.0 Free for personal and commercial use.

Name
walk-bike
Set
Material Symbols
Style
Regular
Category
Transit
Viewbox
24×24
License
Apache 2.0
Aliases
walk-bike-outline

2 other variants in Material Symbols

The same icon in other sets

More transit icons from Material Symbols

Use the walk bike icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3 20L5 7.875l-2 .8V11H1V8.35q0-.475.25-.85t.675-.55L6.05 5.3q.575-.225 1.113-.012T7.9 6q.075.15.175.638t.413 1.012t.9.938T11 9h1v2h-1q-.75 0-1.437-.225t-1.263-.6L7.9 12.5l1.625 1.55q.225.225.35.5t.125.6V20H8v-4l-2-2l-1 6zM6.513 3.988Q6 3.475 6 2.75t.513-1.237T7.75 1t1.238.513T9.5 2.75t-.513 1.238T7.75 4.5t-1.237-.513M18.5 22.026q-1.5 0-2.65-.837T14.225 19H11.5l1-2H14q.05-.55.238-1.062t.487-.938H12.5l1-2h2.45l-.675-2H13.5V9h1.775q.65 0 1.175.363t.725.987l.875 2.625q.125-.025.225-.012t.225.012q1.875 0 3.2 1.325t1.325 3.2t-1.325 3.2t-3.2 1.325m0-2.025q1.05 0 1.775-.725T21 17.5q0-.975-.662-1.687T18.725 15l.725 2.175l-1.9.625l-.725-2.15q-.375.35-.6.813T16 17.5q0 1.05.725 1.775T18.5 20"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsWalkBike(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="M3 20L5 7.875l-2 .8V11H1V8.35q0-.475.25-.85t.675-.55L6.05 5.3q.575-.225 1.113-.012T7.9 6q.075.15.175.638t.413 1.012t.9.938T11 9h1v2h-1q-.75 0-1.437-.225t-1.263-.6L7.9 12.5l1.625 1.55q.225.225.35.5t.125.6V20H8v-4l-2-2l-1 6zM6.513 3.988Q6 3.475 6 2.75t.513-1.237T7.75 1t1.238.513T9.5 2.75t-.513 1.238T7.75 4.5t-1.237-.513M18.5 22.026q-1.5 0-2.65-.837T14.225 19H11.5l1-2H14q.05-.55.238-1.062t.487-.938H12.5l1-2h2.45l-.675-2H13.5V9h1.775q.65 0 1.175.363t.725.987l.875 2.625q.125-.025.225-.012t.225.012q1.875 0 3.2 1.325t1.325 3.2t-1.325 3.2t-3.2 1.325m0-2.025q1.05 0 1.775-.725T21 17.5q0-.975-.662-1.687T18.725 15l.725 2.175l-1.9.625l-.725-2.15q-.375.35-.6.813T16 17.5q0 1.05.725 1.775T18.5 20"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3 20L5 7.875l-2 .8V11H1V8.35q0-.475.25-.85t.675-.55L6.05 5.3q.575-.225 1.113-.012T7.9 6q.075.15.175.638t.413 1.012t.9.938T11 9h1v2h-1q-.75 0-1.437-.225t-1.263-.6L7.9 12.5l1.625 1.55q.225.225.35.5t.125.6V20H8v-4l-2-2l-1 6zM6.513 3.988Q6 3.475 6 2.75t.513-1.237T7.75 1t1.238.513T9.5 2.75t-.513 1.238T7.75 4.5t-1.237-.513M18.5 22.026q-1.5 0-2.65-.837T14.225 19H11.5l1-2H14q.05-.55.238-1.062t.487-.938H12.5l1-2h2.45l-.675-2H13.5V9h1.775q.65 0 1.175.363t.725.987l.875 2.625q.125-.025.225-.012t.225.012q1.875 0 3.2 1.325t1.325 3.2t-1.325 3.2t-3.2 1.325m0-2.025q1.05 0 1.775-.725T21 17.5q0-.975-.662-1.687T18.725 15l.725 2.175l-1.9.625l-.725-2.15q-.375.35-.6.813T16 17.5q0 1.05.725 1.775T18.5 20"/></svg>
</template>

CSS

.icon-walk-bike {
  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%22M3%2020L5%207.875l-2%20.8V11H1V8.35q0-.475.25-.85t.675-.55L6.05%205.3q.575-.225%201.113-.012T7.9%206q.075.15.175.638t.413%201.012t.9.938T11%209h1v2h-1q-.75%200-1.437-.225t-1.263-.6L7.9%2012.5l1.625%201.55q.225.225.35.5t.125.6V20H8v-4l-2-2l-1%206zM6.513%203.988Q6%203.475%206%202.75t.513-1.237T7.75%201t1.238.513T9.5%202.75t-.513%201.238T7.75%204.5t-1.237-.513M18.5%2022.026q-1.5%200-2.65-.837T14.225%2019H11.5l1-2H14q.05-.55.238-1.062t.487-.938H12.5l1-2h2.45l-.675-2H13.5V9h1.775q.65%200%201.175.363t.725.987l.875%202.625q.125-.025.225-.012t.225.012q1.875%200%203.2%201.325t1.325%203.2t-1.325%203.2t-3.2%201.325m0-2.025q1.05%200%201.775-.725T21%2017.5q0-.975-.662-1.687T18.725%2015l.725%202.175l-1.9.625l-.725-2.15q-.375.35-.6.813T16%2017.5q0%201.05.725%201.775T18.5%2020%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%22M3%2020L5%207.875l-2%20.8V11H1V8.35q0-.475.25-.85t.675-.55L6.05%205.3q.575-.225%201.113-.012T7.9%206q.075.15.175.638t.413%201.012t.9.938T11%209h1v2h-1q-.75%200-1.437-.225t-1.263-.6L7.9%2012.5l1.625%201.55q.225.225.35.5t.125.6V20H8v-4l-2-2l-1%206zM6.513%203.988Q6%203.475%206%202.75t.513-1.237T7.75%201t1.238.513T9.5%202.75t-.513%201.238T7.75%204.5t-1.237-.513M18.5%2022.026q-1.5%200-2.65-.837T14.225%2019H11.5l1-2H14q.05-.55.238-1.062t.487-.938H12.5l1-2h2.45l-.675-2H13.5V9h1.775q.65%200%201.175.363t.725.987l.875%202.625q.125-.025.225-.012t.225.012q1.875%200%203.2%201.325t1.325%203.2t-1.325%203.2t-3.2%201.325m0-2.025q1.05%200%201.775-.725T21%2017.5q0-.975-.662-1.687T18.725%2015l.725%202.175l-1.9.625l-.725-2.15q-.375.35-.6.813T16%2017.5q0%201.05.725%201.775T18.5%2020%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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