bus icon
bus from IconPark by ByteDance · Color · Hardware · Apache-2.0 Free for personal and commercial use.
- Name
- bus
- Set
- IconPark
- Style
- Color
- Category
- Hardware
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
busBoxIcons v2busBoxIcons v2 SolidbusCarbonbusEmoji One (Colored)busFont Awesome 6 SolidbusFont Awesome SolidbusFluent EmojibusFluent Emoji FlatbusFluent Emoji High ContrastbusFirefox OS EmojibusIconPark OutlinebusIconPark SolidbusIconPark TwoTonebusIconoirbusIonIconsbusJam IconsbusLine AwesomebusLucidebusMajesticonsbusMaterial Design Iconsbus-fillMingCute IconbusNoto EmojibusOpenMojibusPhosphor
More hardware icons from IconPark
Use the bus icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke="#000" stroke-linejoin="round" stroke-width="4"><path d="M6.01245 34.005V8.03613C6.01245 6.93156 6.90788 6.03613 8.01245 6.03613H40.0001C41.1046 6.03613 42.0001 6.93156 42.0001 8.03613V34.005C42.0001 35.6618 40.6569 37.005 39.0001 37.005H37.0049V37.9999C37.0049 40.2091 35.2141 41.9999 33.0049 41.9999H33.0045C30.7954 41.9999 29.0045 40.2091 29.0045 37.9999V37.005H19.008V38.0016C19.008 40.2098 17.2178 41.9999 15.0096 41.9999C12.8014 41.9999 11.0113 40.2098 11.0113 38.0016V37.005H9.01245C7.3556 37.005 6.01245 35.6618 6.01245 34.005Z"/><path stroke-linecap="round" d="M42 23H6"/><path fill="#2F88FF" stroke-linecap="round" d="M34 13H14V23H34V13Z"/><path stroke-linecap="round" d="M14 30H16"/><path stroke-linecap="round" d="M32 30H34"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkBus(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke="#000" strokeLinejoin="round" strokeWidth="4"><path d="M6.01245 34.005V8.03613C6.01245 6.93156 6.90788 6.03613 8.01245 6.03613H40.0001C41.1046 6.03613 42.0001 6.93156 42.0001 8.03613V34.005C42.0001 35.6618 40.6569 37.005 39.0001 37.005H37.0049V37.9999C37.0049 40.2091 35.2141 41.9999 33.0049 41.9999H33.0045C30.7954 41.9999 29.0045 40.2091 29.0045 37.9999V37.005H19.008V38.0016C19.008 40.2098 17.2178 41.9999 15.0096 41.9999C12.8014 41.9999 11.0113 40.2098 11.0113 38.0016V37.005H9.01245C7.3556 37.005 6.01245 35.6618 6.01245 34.005Z"/><path strokeLinecap="round" d="M42 23H6"/><path fill="#2F88FF" strokeLinecap="round" d="M34 13H14V23H34V13Z"/><path strokeLinecap="round" d="M14 30H16"/><path strokeLinecap="round" d="M32 30H34"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke="#000" stroke-linejoin="round" stroke-width="4"><path d="M6.01245 34.005V8.03613C6.01245 6.93156 6.90788 6.03613 8.01245 6.03613H40.0001C41.1046 6.03613 42.0001 6.93156 42.0001 8.03613V34.005C42.0001 35.6618 40.6569 37.005 39.0001 37.005H37.0049V37.9999C37.0049 40.2091 35.2141 41.9999 33.0049 41.9999H33.0045C30.7954 41.9999 29.0045 40.2091 29.0045 37.9999V37.005H19.008V38.0016C19.008 40.2098 17.2178 41.9999 15.0096 41.9999C12.8014 41.9999 11.0113 40.2098 11.0113 38.0016V37.005H9.01245C7.3556 37.005 6.01245 35.6618 6.01245 34.005Z"/><path stroke-linecap="round" d="M42 23H6"/><path fill="#2F88FF" stroke-linecap="round" d="M34 13H14V23H34V13Z"/><path stroke-linecap="round" d="M14 30H16"/><path stroke-linecap="round" d="M32 30H34"/></g></svg> </template>
CSS
.icon-bus {
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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M6.01245%2034.005V8.03613C6.01245%206.93156%206.90788%206.03613%208.01245%206.03613H40.0001C41.1046%206.03613%2042.0001%206.93156%2042.0001%208.03613V34.005C42.0001%2035.6618%2040.6569%2037.005%2039.0001%2037.005H37.0049V37.9999C37.0049%2040.2091%2035.2141%2041.9999%2033.0049%2041.9999H33.0045C30.7954%2041.9999%2029.0045%2040.2091%2029.0045%2037.9999V37.005H19.008V38.0016C19.008%2040.2098%2017.2178%2041.9999%2015.0096%2041.9999C12.8014%2041.9999%2011.0113%2040.2098%2011.0113%2038.0016V37.005H9.01245C7.3556%2037.005%206.01245%2035.6618%206.01245%2034.005Z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M42%2023H6%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20stroke-linecap%3D%22round%22%20d%3D%22M34%2013H14V23H34V13Z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M14%2030H16%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M32%2030H34%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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20d%3D%22M6.01245%2034.005V8.03613C6.01245%206.93156%206.90788%206.03613%208.01245%206.03613H40.0001C41.1046%206.03613%2042.0001%206.93156%2042.0001%208.03613V34.005C42.0001%2035.6618%2040.6569%2037.005%2039.0001%2037.005H37.0049V37.9999C37.0049%2040.2091%2035.2141%2041.9999%2033.0049%2041.9999H33.0045C30.7954%2041.9999%2029.0045%2040.2091%2029.0045%2037.9999V37.005H19.008V38.0016C19.008%2040.2098%2017.2178%2041.9999%2015.0096%2041.9999C12.8014%2041.9999%2011.0113%2040.2098%2011.0113%2038.0016V37.005H9.01245C7.3556%2037.005%206.01245%2035.6618%206.01245%2034.005Z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M42%2023H6%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20stroke-linecap%3D%22round%22%20d%3D%22M34%2013H14V23H34V13Z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M14%2030H16%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M32%2030H34%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park/bus.svg?color=%231a73e8&size=48
