elevator icon

elevator-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.

Name: elevator-thin
Set: Phosphor
Style: Thin
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

elevator elevator-bold elevator-duotone elevator-fill elevator-light

The same icon in other sets

elevatorFont Awesome 6 Solid elevator-20-filledFluent UI System Icons elevatorFluent Emoji elevatorFluent Emoji Flat elevatorFluent Emoji High Contrast elevatorIconoir elevatorMaterial Symbols elevatorMaterial Design Icons elevatorNoto Emoji elevatorOpenMoji elevatorTabler Icons elevatorTwitter Emoji

Use the elevator icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M208 36H48a12 12 0 0 0-12 12v160a12 12 0 0 0 12 12h160a12 12 0 0 0 12-12V48a12 12 0 0 0-12-12m-28 72v104h-48V108Zm-56 104H76V108h48Zm88-4a4 4 0 0 1-4 4h-20V104a4 4 0 0 0-4-4H72a4 4 0 0 0-4 4v108H48a4 4 0 0 1-4-4V48a4 4 0 0 1 4-4h160a4 4 0 0 1 4 4ZM148 72a4 4 0 0 1-4 4h-32a4 4 0 0 1 0-8h32a4 4 0 0 1 4 4"/></svg>

React

import type { SVGProps } from "react";

export function PhElevatorThin(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 36H48a12 12 0 0 0-12 12v160a12 12 0 0 0 12 12h160a12 12 0 0 0 12-12V48a12 12 0 0 0-12-12m-28 72v104h-48V108Zm-56 104H76V108h48Zm88-4a4 4 0 0 1-4 4h-20V104a4 4 0 0 0-4-4H72a4 4 0 0 0-4 4v108H48a4 4 0 0 1-4-4V48a4 4 0 0 1 4-4h160a4 4 0 0 1 4 4ZM148 72a4 4 0 0 1-4 4h-32a4 4 0 0 1 0-8h32a4 4 0 0 1 4 4"/></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 36H48a12 12 0 0 0-12 12v160a12 12 0 0 0 12 12h160a12 12 0 0 0 12-12V48a12 12 0 0 0-12-12m-28 72v104h-48V108Zm-56 104H76V108h48Zm88-4a4 4 0 0 1-4 4h-20V104a4 4 0 0 0-4-4H72a4 4 0 0 0-4 4v108H48a4 4 0 0 1-4-4V48a4 4 0 0 1 4-4h160a4 4 0 0 1 4 4ZM148 72a4 4 0 0 1-4 4h-32a4 4 0 0 1 0-8h32a4 4 0 0 1 4 4"/></svg>
</template>

CSS

.icon-elevator-thin {
  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%2036H48a12%2012%200%200%200-12%2012v160a12%2012%200%200%200%2012%2012h160a12%2012%200%200%200%2012-12V48a12%2012%200%200%200-12-12m-28%2072v104h-48V108Zm-56%20104H76V108h48Zm88-4a4%204%200%200%201-4%204h-20V104a4%204%200%200%200-4-4H72a4%204%200%200%200-4%204v108H48a4%204%200%200%201-4-4V48a4%204%200%200%201%204-4h160a4%204%200%200%201%204%204ZM148%2072a4%204%200%200%201-4%204h-32a4%204%200%200%201%200-8h32a4%204%200%200%201%204%204%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%2036H48a12%2012%200%200%200-12%2012v160a12%2012%200%200%200%2012%2012h160a12%2012%200%200%200%2012-12V48a12%2012%200%200%200-12-12m-28%2072v104h-48V108Zm-56%20104H76V108h48Zm88-4a4%204%200%200%201-4%204h-20V104a4%204%200%200%200-4-4H72a4%204%200%200%200-4%204v108H48a4%204%200%200%201-4-4V48a4%204%200%200%201%204-4h160a4%204%200%200%201%204%204ZM148%2072a4%204%200%200%201-4%204h-32a4%204%200%200%201%200-8h32a4%204%200%200%201%204%204%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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