smiley melting icon

smiley-melting-fill from Phosphor by Phosphor Icons · Fill · MIT Free for personal and commercial use.

Name
smiley-melting-fill
Set
Phosphor
Style
Fill
Viewbox
256×256
License
MIT

5 other variants in Phosphor

Related icons in Phosphor

Use the smiley melting icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M235.6 176h-15.36a104 104 0 1 0-184.52 0H20.4A12.26 12.26 0 0 0 8 187.78A12 12 0 0 0 20 200h60a8 8 0 0 1 0 16h-7.84a8.2 8.2 0 0 0-8 6.33A8 8 0 0 0 72 232h127.73a8.18 8.18 0 0 0 8.25-7.47a8 8 0 0 0-8-8.53H144a8 8 0 0 1 0-16h7.79a8.28 8.28 0 0 0 8.15-7.05A8 8 0 0 0 152 184h-16c-14.93 0-30.59-5.78-43-15.85c-13.55-11-21-25.27-21-40.15a57 57 0 0 1 .71-9a8.21 8.21 0 0 1 8.85-7a8 8 0 0 1 7 9.27A41.3 41.3 0 0 0 88 128c0 22.16 26.26 40 48 40h15.44c13.5 0 24.86 11.05 24.55 24.55a24 24 0 0 1-.23 2.83a4 4 0 0 0 4 4.62H236a12 12 0 0 0 12-12.22A12.26 12.26 0 0 0 235.6 176M127.9 93.56a12 12 0 1 1-13.46-13.46a12 12 0 0 1 13.46 13.46m48 48a12 12 0 1 1-13.46-13.46a12 12 0 0 1 13.46 13.46"/></svg>

React

import type { SVGProps } from "react";

export function PhSmileyMeltingFill(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="M235.6 176h-15.36a104 104 0 1 0-184.52 0H20.4A12.26 12.26 0 0 0 8 187.78A12 12 0 0 0 20 200h60a8 8 0 0 1 0 16h-7.84a8.2 8.2 0 0 0-8 6.33A8 8 0 0 0 72 232h127.73a8.18 8.18 0 0 0 8.25-7.47a8 8 0 0 0-8-8.53H144a8 8 0 0 1 0-16h7.79a8.28 8.28 0 0 0 8.15-7.05A8 8 0 0 0 152 184h-16c-14.93 0-30.59-5.78-43-15.85c-13.55-11-21-25.27-21-40.15a57 57 0 0 1 .71-9a8.21 8.21 0 0 1 8.85-7a8 8 0 0 1 7 9.27A41.3 41.3 0 0 0 88 128c0 22.16 26.26 40 48 40h15.44c13.5 0 24.86 11.05 24.55 24.55a24 24 0 0 1-.23 2.83a4 4 0 0 0 4 4.62H236a12 12 0 0 0 12-12.22A12.26 12.26 0 0 0 235.6 176M127.9 93.56a12 12 0 1 1-13.46-13.46a12 12 0 0 1 13.46 13.46m48 48a12 12 0 1 1-13.46-13.46a12 12 0 0 1 13.46 13.46"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M235.6 176h-15.36a104 104 0 1 0-184.52 0H20.4A12.26 12.26 0 0 0 8 187.78A12 12 0 0 0 20 200h60a8 8 0 0 1 0 16h-7.84a8.2 8.2 0 0 0-8 6.33A8 8 0 0 0 72 232h127.73a8.18 8.18 0 0 0 8.25-7.47a8 8 0 0 0-8-8.53H144a8 8 0 0 1 0-16h7.79a8.28 8.28 0 0 0 8.15-7.05A8 8 0 0 0 152 184h-16c-14.93 0-30.59-5.78-43-15.85c-13.55-11-21-25.27-21-40.15a57 57 0 0 1 .71-9a8.21 8.21 0 0 1 8.85-7a8 8 0 0 1 7 9.27A41.3 41.3 0 0 0 88 128c0 22.16 26.26 40 48 40h15.44c13.5 0 24.86 11.05 24.55 24.55a24 24 0 0 1-.23 2.83a4 4 0 0 0 4 4.62H236a12 12 0 0 0 12-12.22A12.26 12.26 0 0 0 235.6 176M127.9 93.56a12 12 0 1 1-13.46-13.46a12 12 0 0 1 13.46 13.46m48 48a12 12 0 1 1-13.46-13.46a12 12 0 0 1 13.46 13.46"/></svg>
</template>

CSS

.icon-smiley-melting-fill {
  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%22M235.6%20176h-15.36a104%20104%200%201%200-184.52%200H20.4A12.26%2012.26%200%200%200%208%20187.78A12%2012%200%200%200%2020%20200h60a8%208%200%200%201%200%2016h-7.84a8.2%208.2%200%200%200-8%206.33A8%208%200%200%200%2072%20232h127.73a8.18%208.18%200%200%200%208.25-7.47a8%208%200%200%200-8-8.53H144a8%208%200%200%201%200-16h7.79a8.28%208.28%200%200%200%208.15-7.05A8%208%200%200%200%20152%20184h-16c-14.93%200-30.59-5.78-43-15.85c-13.55-11-21-25.27-21-40.15a57%2057%200%200%201%20.71-9a8.21%208.21%200%200%201%208.85-7a8%208%200%200%201%207%209.27A41.3%2041.3%200%200%200%2088%20128c0%2022.16%2026.26%2040%2048%2040h15.44c13.5%200%2024.86%2011.05%2024.55%2024.55a24%2024%200%200%201-.23%202.83a4%204%200%200%200%204%204.62H236a12%2012%200%200%200%2012-12.22A12.26%2012.26%200%200%200%20235.6%20176M127.9%2093.56a12%2012%200%201%201-13.46-13.46a12%2012%200%200%201%2013.46%2013.46m48%2048a12%2012%200%201%201-13.46-13.46a12%2012%200%200%201%2013.46%2013.46%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%22M235.6%20176h-15.36a104%20104%200%201%200-184.52%200H20.4A12.26%2012.26%200%200%200%208%20187.78A12%2012%200%200%200%2020%20200h60a8%208%200%200%201%200%2016h-7.84a8.2%208.2%200%200%200-8%206.33A8%208%200%200%200%2072%20232h127.73a8.18%208.18%200%200%200%208.25-7.47a8%208%200%200%200-8-8.53H144a8%208%200%200%201%200-16h7.79a8.28%208.28%200%200%200%208.15-7.05A8%208%200%200%200%20152%20184h-16c-14.93%200-30.59-5.78-43-15.85c-13.55-11-21-25.27-21-40.15a57%2057%200%200%201%20.71-9a8.21%208.21%200%200%201%208.85-7a8%208%200%200%201%207%209.27A41.3%2041.3%200%200%200%2088%20128c0%2022.16%2026.26%2040%2048%2040h15.44c13.5%200%2024.86%2011.05%2024.55%2024.55a24%2024%200%200%201-.23%202.83a4%204%200%200%200%204%204.62H236a12%2012%200%200%200%2012-12.22A12.26%2012.26%200%200%200%20235.6%20176M127.9%2093.56a12%2012%200%201%201-13.46-13.46a12%2012%200%200%201%2013.46%2013.46m48%2048a12%2012%200%201%201-13.46-13.46a12%2012%200%200%201%2013.46%2013.46%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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