dine in icon

dine-in from Material Symbols Light by Google · Regular · Social · Apache-2.0 Free for personal and commercial use.

Name: dine-in
Set: Material Symbols Light
Style: Regular
Category: Social
Viewbox: 24×24
License: Apache 2.0
Aliases: dine-in-outline

2 other variants in Material Symbols Light

dine-in-rounded dine-in-sharp

The same icon in other sets

dine-inMaterial Symbols

More social icons from Material Symbols Light

Use the dine in icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.616 19q-.691 0-1.153-.462T3 17.384v-9.73h1v9.73q0 .27.173.443t.443.173h6v1zM7.212 5.885q-.595 0-1.019-.425T5.77 4.442t.424-1.018T7.212 3q.613 0 1.028.424q.414.424.414 1.018T8.239 5.46t-1.028.424M12.442 21v-4.77h-5.23q-.595 0-1.019-.423t-.424-1.038V9.177q0-.644.437-1.084t1.055-.44q.437 0 .773.249q.335.248.616.54q1.067 1.11 2.249 2.045t2.736.936h1.85q-.53-.31-.844-.841q-.314-.532-.314-1.198h4.814q0 .666-.315 1.198t-.843.841H21v1h-3.77V21h-1v-8.577h-2.595q-1.421 0-2.627-.7t-2.354-1.75v4.777H12q.594 0 1.018.424t.424 1.018V21z"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightDineIn(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="M4.616 19q-.691 0-1.153-.462T3 17.384v-9.73h1v9.73q0 .27.173.443t.443.173h6v1zM7.212 5.885q-.595 0-1.019-.425T5.77 4.442t.424-1.018T7.212 3q.613 0 1.028.424q.414.424.414 1.018T8.239 5.46t-1.028.424M12.442 21v-4.77h-5.23q-.595 0-1.019-.423t-.424-1.038V9.177q0-.644.437-1.084t1.055-.44q.437 0 .773.249q.335.248.616.54q1.067 1.11 2.249 2.045t2.736.936h1.85q-.53-.31-.844-.841q-.314-.532-.314-1.198h4.814q0 .666-.315 1.198t-.843.841H21v1h-3.77V21h-1v-8.577h-2.595q-1.421 0-2.627-.7t-2.354-1.75v4.777H12q.594 0 1.018.424t.424 1.018V21z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.616 19q-.691 0-1.153-.462T3 17.384v-9.73h1v9.73q0 .27.173.443t.443.173h6v1zM7.212 5.885q-.595 0-1.019-.425T5.77 4.442t.424-1.018T7.212 3q.613 0 1.028.424q.414.424.414 1.018T8.239 5.46t-1.028.424M12.442 21v-4.77h-5.23q-.595 0-1.019-.423t-.424-1.038V9.177q0-.644.437-1.084t1.055-.44q.437 0 .773.249q.335.248.616.54q1.067 1.11 2.249 2.045t2.736.936h1.85q-.53-.31-.844-.841q-.314-.532-.314-1.198h4.814q0 .666-.315 1.198t-.843.841H21v1h-3.77V21h-1v-8.577h-2.595q-1.421 0-2.627-.7t-2.354-1.75v4.777H12q.594 0 1.018.424t.424 1.018V21z"/></svg>
</template>

CSS

.icon-dine-in {
  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%22M4.616%2019q-.691%200-1.153-.462T3%2017.384v-9.73h1v9.73q0%20.27.173.443t.443.173h6v1zM7.212%205.885q-.595%200-1.019-.425T5.77%204.442t.424-1.018T7.212%203q.613%200%201.028.424q.414.424.414%201.018T8.239%205.46t-1.028.424M12.442%2021v-4.77h-5.23q-.595%200-1.019-.423t-.424-1.038V9.177q0-.644.437-1.084t1.055-.44q.437%200%20.773.249q.335.248.616.54q1.067%201.11%202.249%202.045t2.736.936h1.85q-.53-.31-.844-.841q-.314-.532-.314-1.198h4.814q0%20.666-.315%201.198t-.843.841H21v1h-3.77V21h-1v-8.577h-2.595q-1.421%200-2.627-.7t-2.354-1.75v4.777H12q.594%200%201.018.424t.424%201.018V21z%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%22M4.616%2019q-.691%200-1.153-.462T3%2017.384v-9.73h1v9.73q0%20.27.173.443t.443.173h6v1zM7.212%205.885q-.595%200-1.019-.425T5.77%204.442t.424-1.018T7.212%203q.613%200%201.028.424q.414.424.414%201.018T8.239%205.46t-1.028.424M12.442%2021v-4.77h-5.23q-.595%200-1.019-.423t-.424-1.038V9.177q0-.644.437-1.084t1.055-.44q.437%200%20.773.249q.335.248.616.54q1.067%201.11%202.249%202.045t2.736.936h1.85q-.53-.31-.844-.841q-.314-.532-.314-1.198h4.814q0%20.666-.315%201.198t-.843.841H21v1h-3.77V21h-1v-8.577h-2.595q-1.421%200-2.627-.7t-2.354-1.75v4.777H12q.594%200%201.018.424t.424%201.018V21z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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