lips icon

lips-outline from Material Symbols Light by Google · Outline · Social · Apache-2.0 Free for personal and commercial use.

Name: lips-outline
Set: Material Symbols Light
Style: Outline
Category: Social
Viewbox: 24×24
License: Apache 2.0
Aliases: lips-outline-sharp

3 other variants in Material Symbols Light

lips lips-outline-rounded lips-rounded

The same icon in other sets

lipsFirefox OS Emoji lipsMaterial Symbols

More social icons from Material Symbols Light

Use the lips icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m11.677 17l.665.02q2.72 0 4.855-1.387t3.332-3.683q-1.27.43-3.602 1.01q-2.333.579-4.965.579q-2.537 0-4.828-.553t-3.6-.978q1.293 2.277 3.31 3.634T11.677 17m0 1q-3.463 0-5.973-1.898T2 11.058L6.723 6.7q.348-.31.76-.486t.879-.176q.334 0 .656.096q.323.095.62.268l2.381 1.464L14.4 6.402q.298-.173.61-.268q.313-.096.648-.096q.465 0 .887.176t.77.486L22 11.039q-1.021 3.127-3.675 5.044T12.342 18zm.29-5.462q2.506 0 4.815-.565t3.709-.99l-3.864-3.556q-.208-.188-.472-.292t-.522-.104q-.17 0-.326.037t-.301.138l-2.987 1.828l-2.903-1.77q-.183-.12-.388-.177t-.393-.056q-.239 0-.465.084q-.226.085-.414.254l-3.954 3.633q1.356.425 3.658.98q2.302.557 4.807.557"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightLipsOutline(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="m11.677 17l.665.02q2.72 0 4.855-1.387t3.332-3.683q-1.27.43-3.602 1.01q-2.333.579-4.965.579q-2.537 0-4.828-.553t-3.6-.978q1.293 2.277 3.31 3.634T11.677 17m0 1q-3.463 0-5.973-1.898T2 11.058L6.723 6.7q.348-.31.76-.486t.879-.176q.334 0 .656.096q.323.095.62.268l2.381 1.464L14.4 6.402q.298-.173.61-.268q.313-.096.648-.096q.465 0 .887.176t.77.486L22 11.039q-1.021 3.127-3.675 5.044T12.342 18zm.29-5.462q2.506 0 4.815-.565t3.709-.99l-3.864-3.556q-.208-.188-.472-.292t-.522-.104q-.17 0-.326.037t-.301.138l-2.987 1.828l-2.903-1.77q-.183-.12-.388-.177t-.393-.056q-.239 0-.465.084q-.226.085-.414.254l-3.954 3.633q1.356.425 3.658.98q2.302.557 4.807.557"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m11.677 17l.665.02q2.72 0 4.855-1.387t3.332-3.683q-1.27.43-3.602 1.01q-2.333.579-4.965.579q-2.537 0-4.828-.553t-3.6-.978q1.293 2.277 3.31 3.634T11.677 17m0 1q-3.463 0-5.973-1.898T2 11.058L6.723 6.7q.348-.31.76-.486t.879-.176q.334 0 .656.096q.323.095.62.268l2.381 1.464L14.4 6.402q.298-.173.61-.268q.313-.096.648-.096q.465 0 .887.176t.77.486L22 11.039q-1.021 3.127-3.675 5.044T12.342 18zm.29-5.462q2.506 0 4.815-.565t3.709-.99l-3.864-3.556q-.208-.188-.472-.292t-.522-.104q-.17 0-.326.037t-.301.138l-2.987 1.828l-2.903-1.77q-.183-.12-.388-.177t-.393-.056q-.239 0-.465.084q-.226.085-.414.254l-3.954 3.633q1.356.425 3.658.98q2.302.557 4.807.557"/></svg>
</template>

CSS

.icon-lips-outline {
  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%22m11.677%2017l.665.02q2.72%200%204.855-1.387t3.332-3.683q-1.27.43-3.602%201.01q-2.333.579-4.965.579q-2.537%200-4.828-.553t-3.6-.978q1.293%202.277%203.31%203.634T11.677%2017m0%201q-3.463%200-5.973-1.898T2%2011.058L6.723%206.7q.348-.31.76-.486t.879-.176q.334%200%20.656.096q.323.095.62.268l2.381%201.464L14.4%206.402q.298-.173.61-.268q.313-.096.648-.096q.465%200%20.887.176t.77.486L22%2011.039q-1.021%203.127-3.675%205.044T12.342%2018zm.29-5.462q2.506%200%204.815-.565t3.709-.99l-3.864-3.556q-.208-.188-.472-.292t-.522-.104q-.17%200-.326.037t-.301.138l-2.987%201.828l-2.903-1.77q-.183-.12-.388-.177t-.393-.056q-.239%200-.465.084q-.226.085-.414.254l-3.954%203.633q1.356.425%203.658.98q2.302.557%204.807.557%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%22m11.677%2017l.665.02q2.72%200%204.855-1.387t3.332-3.683q-1.27.43-3.602%201.01q-2.333.579-4.965.579q-2.537%200-4.828-.553t-3.6-.978q1.293%202.277%203.31%203.634T11.677%2017m0%201q-3.463%200-5.973-1.898T2%2011.058L6.723%206.7q.348-.31.76-.486t.879-.176q.334%200%20.656.096q.323.095.62.268l2.381%201.464L14.4%206.402q.298-.173.61-.268q.313-.096.648-.096q.465%200%20.887.176t.77.486L22%2011.039q-1.021%203.127-3.675%205.044T12.342%2018zm.29-5.462q2.506%200%204.815-.565t3.709-.99l-3.864-3.556q-.208-.188-.472-.292t-.522-.104q-.17%200-.326.037t-.301.138l-2.987%201.828l-2.903-1.77q-.183-.12-.388-.177t-.393-.056q-.239%200-.465.084q-.226.085-.414.254l-3.954%203.633q1.356.425%203.658.98q2.302.557%204.807.557%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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