outlet icon

outlet from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name
outlet
Set
IonIcons
Style
Regular
Viewbox
512×512
License
MIT

The same icon in other sets

outletBootstrap IconsoutletMaterial SymbolsoutletMaterial Symbols LightoutletOpenMojioutlet-fillRemix IconoutletTabler Icons

Use the outlet icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M369.541 32H142.359C81.521 32 32 82.574 32 144.604v222.79C32 429.426 81.521 480 142.359 480h227.182C430.479 480 480 429.426 480 367.395v-222.79C480 82.574 430.479 32 369.541 32zM175 250.954v.67c0 10.882-9.09 20.376-19.875 20.376h-23.27C121.073 272 112 262.506 112 251.624V148.161c1-10.768 9.193-20.161 19.855-20.161h23.27c10.886 0 19.875 9.847 19.875 20.831v102.123zM297 395.74v2.68c0 11.439-8.872 17.58-20.1 17.58h-41.798c-11.23 0-20.102-8.141-20.102-19.58v-29.317c0-23.33 18.118-42.287 40.999-42.287 22.883 0 41.001 18.957 41.001 42.287v28.637zm103-144.786v.67c0 10.882-9.071 20.376-19.855 20.376h-24.27C345.093 272 336 262.506 336 251.624V148.161c1-10.768 9.215-20.161 19.875-20.161h24.27c10.784 0 19.855 9.847 19.855 20.831v102.123z" fill="currentColor"/></svg>

React

import type { SVGProps } from "react";

export function IonOutlet(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M369.541 32H142.359C81.521 32 32 82.574 32 144.604v222.79C32 429.426 81.521 480 142.359 480h227.182C430.479 480 480 429.426 480 367.395v-222.79C480 82.574 430.479 32 369.541 32zM175 250.954v.67c0 10.882-9.09 20.376-19.875 20.376h-23.27C121.073 272 112 262.506 112 251.624V148.161c1-10.768 9.193-20.161 19.855-20.161h23.27c10.886 0 19.875 9.847 19.875 20.831v102.123zM297 395.74v2.68c0 11.439-8.872 17.58-20.1 17.58h-41.798c-11.23 0-20.102-8.141-20.102-19.58v-29.317c0-23.33 18.118-42.287 40.999-42.287 22.883 0 41.001 18.957 41.001 42.287v28.637zm103-144.786v.67c0 10.882-9.071 20.376-19.855 20.376h-24.27C345.093 272 336 262.506 336 251.624V148.161c1-10.768 9.215-20.161 19.875-20.161h24.27c10.784 0 19.855 9.847 19.855 20.831v102.123z" fill="currentColor"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M369.541 32H142.359C81.521 32 32 82.574 32 144.604v222.79C32 429.426 81.521 480 142.359 480h227.182C430.479 480 480 429.426 480 367.395v-222.79C480 82.574 430.479 32 369.541 32zM175 250.954v.67c0 10.882-9.09 20.376-19.875 20.376h-23.27C121.073 272 112 262.506 112 251.624V148.161c1-10.768 9.193-20.161 19.855-20.161h23.27c10.886 0 19.875 9.847 19.875 20.831v102.123zM297 395.74v2.68c0 11.439-8.872 17.58-20.1 17.58h-41.798c-11.23 0-20.102-8.141-20.102-19.58v-29.317c0-23.33 18.118-42.287 40.999-42.287 22.883 0 41.001 18.957 41.001 42.287v28.637zm103-144.786v.67c0 10.882-9.071 20.376-19.855 20.376h-24.27C345.093 272 336 262.506 336 251.624V148.161c1-10.768 9.215-20.161 19.875-20.161h24.27c10.784 0 19.855 9.847 19.855 20.831v102.123z" fill="currentColor"/></svg>
</template>

CSS

.icon-outlet {
  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%20512%20512%22%3E%3Cpath%20d%3D%22M369.541%2032H142.359C81.521%2032%2032%2082.574%2032%20144.604v222.79C32%20429.426%2081.521%20480%20142.359%20480h227.182C430.479%20480%20480%20429.426%20480%20367.395v-222.79C480%2082.574%20430.479%2032%20369.541%2032zM175%20250.954v.67c0%2010.882-9.09%2020.376-19.875%2020.376h-23.27C121.073%20272%20112%20262.506%20112%20251.624V148.161c1-10.768%209.193-20.161%2019.855-20.161h23.27c10.886%200%2019.875%209.847%2019.875%2020.831v102.123zM297%20395.74v2.68c0%2011.439-8.872%2017.58-20.1%2017.58h-41.798c-11.23%200-20.102-8.141-20.102-19.58v-29.317c0-23.33%2018.118-42.287%2040.999-42.287%2022.883%200%2041.001%2018.957%2041.001%2042.287v28.637zm103-144.786v.67c0%2010.882-9.071%2020.376-19.855%2020.376h-24.27C345.093%20272%20336%20262.506%20336%20251.624V148.161c1-10.768%209.215-20.161%2019.875-20.161h24.27c10.784%200%2019.855%209.847%2019.855%2020.831v102.123z%22%20fill%3D%22currentColor%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%20512%20512%22%3E%3Cpath%20d%3D%22M369.541%2032H142.359C81.521%2032%2032%2082.574%2032%20144.604v222.79C32%20429.426%2081.521%20480%20142.359%20480h227.182C430.479%20480%20480%20429.426%20480%20367.395v-222.79C480%2082.574%20430.479%2032%20369.541%2032zM175%20250.954v.67c0%2010.882-9.09%2020.376-19.875%2020.376h-23.27C121.073%20272%20112%20262.506%20112%20251.624V148.161c1-10.768%209.193-20.161%2019.855-20.161h23.27c10.886%200%2019.875%209.847%2019.875%2020.831v102.123zM297%20395.74v2.68c0%2011.439-8.872%2017.58-20.1%2017.58h-41.798c-11.23%200-20.102-8.141-20.102-19.58v-29.317c0-23.33%2018.118-42.287%2040.999-42.287%2022.883%200%2041.001%2018.957%2041.001%2042.287v28.637zm103-144.786v.67c0%2010.882-9.071%2020.376-19.855%2020.376h-24.27C345.093%20272%20336%20262.506%20336%20251.624V148.161c1-10.768%209.215-20.161%2019.875-20.161h24.27c10.784%200%2019.855%209.847%2019.855%2020.831v102.123z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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