log icon

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

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

5 other variants in Phosphor

loglog-boldlog-duotonelog-filllog-light

The same icon in other sets

logCatppuccin Iconslog-16Octicons

Use the log icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M208 136a8 8 0 1 1-8-8a8 8 0 0 1 8 8m36 0c0 17.83-4.38 34.66-12.32 47.38C223.36 196.67 212.11 204 200 204H56c-12.11 0-23.36-7.33-31.68-20.62C16.38 170.66 12 153.83 12 136s4.38-34.66 12.32-47.38C32.64 75.33 43.89 68 56 68h38.34l38.83-38.83A4 4 0 0 1 136 28h32a4 4 0 0 1 0 8h-30.34l-32 32H200c12.11 0 23.36 7.33 31.68 20.62C239.62 101.34 244 118.17 244 136m-64.87 60a52.2 52.2 0 0 1-10.81-12.62a77 77 0 0 1-8.47-19.38H80a4 4 0 0 1 0-8h77.91a104.5 104.5 0 0 1-1.91-20c0-17.83 4.38-34.66 12.32-47.38A52.2 52.2 0 0 1 179.13 76H56c-15.64 0-29 16.72-33.94 40H104a4 4 0 0 1 0 8H20.72a100 100 0 0 0-.72 12c0 33.08 16.15 60 36 60ZM236 136c0-33.08-16.15-60-36-60s-36 26.92-36 60s16.15 60 36 60s36-26.92 36-60"/></svg>

React

import type { SVGProps } from "react";

export function PhLogThin(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 136a8 8 0 1 1-8-8a8 8 0 0 1 8 8m36 0c0 17.83-4.38 34.66-12.32 47.38C223.36 196.67 212.11 204 200 204H56c-12.11 0-23.36-7.33-31.68-20.62C16.38 170.66 12 153.83 12 136s4.38-34.66 12.32-47.38C32.64 75.33 43.89 68 56 68h38.34l38.83-38.83A4 4 0 0 1 136 28h32a4 4 0 0 1 0 8h-30.34l-32 32H200c12.11 0 23.36 7.33 31.68 20.62C239.62 101.34 244 118.17 244 136m-64.87 60a52.2 52.2 0 0 1-10.81-12.62a77 77 0 0 1-8.47-19.38H80a4 4 0 0 1 0-8h77.91a104.5 104.5 0 0 1-1.91-20c0-17.83 4.38-34.66 12.32-47.38A52.2 52.2 0 0 1 179.13 76H56c-15.64 0-29 16.72-33.94 40H104a4 4 0 0 1 0 8H20.72a100 100 0 0 0-.72 12c0 33.08 16.15 60 36 60ZM236 136c0-33.08-16.15-60-36-60s-36 26.92-36 60s16.15 60 36 60s36-26.92 36-60"/></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 136a8 8 0 1 1-8-8a8 8 0 0 1 8 8m36 0c0 17.83-4.38 34.66-12.32 47.38C223.36 196.67 212.11 204 200 204H56c-12.11 0-23.36-7.33-31.68-20.62C16.38 170.66 12 153.83 12 136s4.38-34.66 12.32-47.38C32.64 75.33 43.89 68 56 68h38.34l38.83-38.83A4 4 0 0 1 136 28h32a4 4 0 0 1 0 8h-30.34l-32 32H200c12.11 0 23.36 7.33 31.68 20.62C239.62 101.34 244 118.17 244 136m-64.87 60a52.2 52.2 0 0 1-10.81-12.62a77 77 0 0 1-8.47-19.38H80a4 4 0 0 1 0-8h77.91a104.5 104.5 0 0 1-1.91-20c0-17.83 4.38-34.66 12.32-47.38A52.2 52.2 0 0 1 179.13 76H56c-15.64 0-29 16.72-33.94 40H104a4 4 0 0 1 0 8H20.72a100 100 0 0 0-.72 12c0 33.08 16.15 60 36 60ZM236 136c0-33.08-16.15-60-36-60s-36 26.92-36 60s16.15 60 36 60s36-26.92 36-60"/></svg>
</template>

CSS

.icon-log-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%20136a8%208%200%201%201-8-8a8%208%200%200%201%208%208m36%200c0%2017.83-4.38%2034.66-12.32%2047.38C223.36%20196.67%20212.11%20204%20200%20204H56c-12.11%200-23.36-7.33-31.68-20.62C16.38%20170.66%2012%20153.83%2012%20136s4.38-34.66%2012.32-47.38C32.64%2075.33%2043.89%2068%2056%2068h38.34l38.83-38.83A4%204%200%200%201%20136%2028h32a4%204%200%200%201%200%208h-30.34l-32%2032H200c12.11%200%2023.36%207.33%2031.68%2020.62C239.62%20101.34%20244%20118.17%20244%20136m-64.87%2060a52.2%2052.2%200%200%201-10.81-12.62a77%2077%200%200%201-8.47-19.38H80a4%204%200%200%201%200-8h77.91a104.5%20104.5%200%200%201-1.91-20c0-17.83%204.38-34.66%2012.32-47.38A52.2%2052.2%200%200%201%20179.13%2076H56c-15.64%200-29%2016.72-33.94%2040H104a4%204%200%200%201%200%208H20.72a100%20100%200%200%200-.72%2012c0%2033.08%2016.15%2060%2036%2060ZM236%20136c0-33.08-16.15-60-36-60s-36%2026.92-36%2060s16.15%2060%2036%2060s36-26.92%2036-60%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%20136a8%208%200%201%201-8-8a8%208%200%200%201%208%208m36%200c0%2017.83-4.38%2034.66-12.32%2047.38C223.36%20196.67%20212.11%20204%20200%20204H56c-12.11%200-23.36-7.33-31.68-20.62C16.38%20170.66%2012%20153.83%2012%20136s4.38-34.66%2012.32-47.38C32.64%2075.33%2043.89%2068%2056%2068h38.34l38.83-38.83A4%204%200%200%201%20136%2028h32a4%204%200%200%201%200%208h-30.34l-32%2032H200c12.11%200%2023.36%207.33%2031.68%2020.62C239.62%20101.34%20244%20118.17%20244%20136m-64.87%2060a52.2%2052.2%200%200%201-10.81-12.62a77%2077%200%200%201-8.47-19.38H80a4%204%200%200%201%200-8h77.91a104.5%20104.5%200%200%201-1.91-20c0-17.83%204.38-34.66%2012.32-47.38A52.2%2052.2%200%200%201%20179.13%2076H56c-15.64%200-29%2016.72-33.94%2040H104a4%204%200%200%201%200%208H20.72a100%20100%200%200%200-.72%2012c0%2033.08%2016.15%2060%2036%2060ZM236%20136c0-33.08-16.15-60-36-60s-36%2026.92-36%2060s16.15%2060%2036%2060s36-26.92%2036-60%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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